← ClaudeAtlas

vibe.figmalisted

Figma 디자인을 코드로 옮기거나 구현 계획을 Figma에 반영할 때 — READ(Figma→Code)와 WRITE(plan→Figma)를 라우팅한다.
su-record/vibe · ★ 0 · AI & Automation · score 75
Install: claude install-skill su-record/vibe
# /vibe.figma Figma와 코드 사이의 **양방향 라우터**. 인자 조합으로 분기를 결정하고, 분기에 맞는 스킬을 순차 로드한다. ## Usage ``` # Branch 1: READ — 컨벤션 준수 /vibe.figma # 인터랙티브 (URL 줄바꿈으로 입력) /vibe.figma <design-url> # 디자인 1개 /vibe.figma <storyboard-url> <mo-url> <pc-url> # 스토리보드 + MO + PC 한 번에 /vibe.figma <mo-url> <pc-url> # MO + PC만 # Branch 2: READ — 독립 페이지 (컨벤션 무시) /vibe.figma --new /vibe.figma --new <mo-url> <pc-url> # Branch 3: WRITE — plan.md → Figma 디자인 생성 /vibe.figma <plan.md> --create # full (와이어 + 본 디자인) /vibe.figma <plan.md> --create-storyboard # 와이어만 (Step E 생략) /vibe.figma <plan.md> --create-design # 본 디자인만 (Step D 생략) # 공통 /vibe.figma --teach # 어느 branch든 design-teach를 인터랙티브로 강제 ``` > **URL 분류는 자동 처리됩니다** — fileKey가 다른 URL은 스토리보드 vs 디자인으로, ROOT 노드 name의 "MO"/"PC"로 디바이스를 구분합니다. 사용자는 URL 종류를 신경 쓰지 않고 한 번에 던지면 됩니다. ## Branch Routing (필수: 첫 단계에서 결정) 다음 알고리즘을 **그대로** 실행한다. 추정 금지. ``` Step 1) 플래그 수집 hasCreate = args에 "--create" 포함 (정확히 일치, 아래 두 플래그와 별개) hasCreateStoryboard = args에 "--create-storyboard" 포함 hasCreateDesign = args에 "--create-design" 포함 hasNew = args에 "--new" 포함 hasTeach = args에 "--teach" 포함 hasNewState = args에 "--new-state" 포함 (Branch 3 전용: state 파일 무시하고 새로 그림) hasEmitDesignMd = args에 "--emit-design-md" 포함 (Branch 1/2 전용: READ 완료 후 DESIGN.md 출