메뉴
Use when the user provides Figma frame screenshots, design exports, or mockups and wants the repo UI aligned to them. Focus on extracting structure, hierarchy, hidden-vs-visible behavior, spacing, and component states, then implement one focused frontend slice at a time.
| name | figma-ui-bridge |
| description | Use when the user provides Figma frame screenshots, design exports, or mockups and wants the repo UI aligned to them. Focus on extracting structure, hierarchy, hidden-vs-visible behavior, spacing, and component states, then implement one focused frontend slice at a time. |
Identify the main surface in the design. Usually: navigation shell, list pane, active panel, drawer, modal, or mobile state.
Extract behavior before pixels. Decide:
Map design elements onto existing codebase structure. Reuse repo components and patterns where possible. Do not invent a parallel design system unless the task requires it.
Implement the highest-leverage mismatch first. Prefer solving navigation and interaction model before color or decorative polish.
Validate with the frontend build/check command after edits.
