hf-ui-design

To create UI design documentation from approved specifications, you start by collecting context, outlining information architecture and user flows, and recording ADRs before starting wireframes. This captures design context and governance ready for handoff.

A UI design system for declared UI surfaces includes information architecture maps, user flows, state matrices, ADRs, wireframes, design tokens, accessibility considerations, and a vocalized system declaration to ensure comprehensive context and governance.

You need to generate design tokens and state matrices when developing context-rich UI design documentation for features with explicit UI surfaces across pages, components, and interactions, ensuring design context is ready before implementation.

No, this approach is applied specifically to features with explicit UI surfaces declared in approved specifications. It focuses on developing IA, user flows, token systems, and ADRs for pages, components, and interactions rather than backend logic.

The best way to map atomic components and wireframes from specs is to first acquire design context, define the information architecture, and establish ADRs and token strategy, enabling structured component mapping and peer-review gating before implementation.

Your UI design handoff lacks accessibility considerations and ADRs because the design documentation was not developed context-rich from approved specifications, skipping the acquisition of design context, token strategy, and governance artifacts before implementation.