작업 방식
Figma Generate Design은 코드에서 디자인으로 향하는 방식으로 작동합니다. 결과물은 애플리케이션 코드가 아니라 Figma 안의 화면입니다. 페이지를 조립하기 전에 기존 컴포넌트 인스턴스, 라이브러리 변수, 텍스트 또는 효과 스타일을 찾습니다. 소스는 하드코딩된 값으로 비슷해 보이는 박스를 그리기보다 재사용을 우선합니다.
조립 전략은 점진적입니다. 먼저 래퍼 프레임을 만들고, 그 안에 각 섹션을 만든 뒤 검사합니다. 컴포넌트 텍스트 속성과 기본 베리언트는 소스 코드와 대조하며, 섹션별 스크린샷으로 축소된 전체 페이지 보기에서는 사라질 수 있는 잘린 텍스트와 남은 플레이스홀더를 찾아냅니다. 결과는 애플리케이션 스크린샷이 아니라 편집 가능한 디자인 시스템 인스턴스여야 합니다.
예상 결과물
- 컴포넌트 인스턴스로 구성된 새로운 또는 업데이트된 Figma 화면
- 변수에 바인딩된 색상, 간격, 반경과 재사용 가능한 스타일
- 소스와 비교한 섹션별 및 전체 화면 시각 검증
브리프에서 검토까지
- 01소스 화면 파악
섹션, 컴포넌트, 기본 prop 값을 읽습니다. 대상 Figma 파일과 기존 시스템 규칙을 확인합니다.
- 02자산 찾기와 재사용
기존 화면을 살펴보고 연결된 라이브러리에서 컴포넌트, 변수, 스타일을 검색합니다. 로컬 변수 결과가 비어 있어도 원격 토큰이 없다는 뜻은 아닙니다.
- 03섹션별 구축과 검증
먼저 래퍼를 만들고 한 번에 한 섹션씩 조립하며, 계속 진행하기 전에 텍스트, 베리언트, 레이아웃을 확인합니다.