Storyboard Automation

스토리보드 아카이브
자동화 프로토콜

Figma MCP 데이터와 스크린샷을 교차 분석하여 66개 화면의 스토리보드를 CHAART OS 디자인 토큰 기반 HTML로 자동 변환합니다.

Total Screens

Generated

Pending

User Screens

Admin Screens

Automation Protocol — 4-Step Pipeline

Screenshot

Figma MCP get_screenshot 호출. 시각적 레이아웃과 컴포넌트 배치를 파악.

Design Context

Figma MCP get_design_context 호출. 구조, 텍스트, 스타일 데이터 추출.

Cross-Reference

스크린샷 + 데이터 교차 분석. 내용 이해 후 HTML 와이어프레임 + Description 테이블 구성.

Render & Calibrate

프리뷰 렌더링 후 getBoundingClientRect 실측. Zone/Marker 위치 보정.

사용자 화면 — User Screens (46)

LOG 회원가입 / 로그인 9 / 9

Screen ID	화면 이름	Node ID	Status	Updated	Action
LOG-001	로그인 진입 화면	21:1730	디자인완료	03.09	View
LOG-002	약관동의 바텀시트	1:16381	디자인완료	03.09	View
LOG-003	이메일 로그인 ID/PW 입력 바텀시트	1:16315	검토중	03.04	View
LOG-004	소셜 로그인 머지 바텀시트	1:16253	검토중	03.04	View
LOG-005	이메일 로그인 실패 바텀시트	1:16196	검토중	03.04	View
LOG-006	비밀번호 재설정/발송 완료 바텀시트	1:16114	검토중	03.04	View
LOG-007	온보딩 화면(신규 사용자)	1:15856	검토중	03.04	View
LOG-008	온보딩 화면(기존 사용자)	88:18475	검토중	03.07	View
LOG-009	시스템 모달	1:15714	디자인완료	03.09	View

HOM 홈 5 / 5

Screen ID	화면 이름	Node ID	Status	Updated	Action
HOM-001	홈 (최근 본 작품이 없을 때)	1:15370	수정중	03.09	View
HOM-002	홈 (찜한 작품이 있을 때)	1:15157	검토중	03.04	View
HOM-003	홈 (찜한 작품이 없는데 본 작품이 있을 때)	1:14944	검토중	03.04	View
HOM-004	홈 — 알림	1:14755	검토중	03.04	View
HOM-005	기획전 화면	1:14556	검토중	03.04	View

MKT 마켓 / 판매등록 13 / 13

Screen ID	화면 이름	Node ID	Status	Updated	Action
MKT-001	마켓 — 필터 탭 적용	1:13873	검토중	03.04	View
MKT-002	마켓 — 정렬 바텀시트	1:13508	검토중	03.04	View
MKT-003	판매등록 — 업로드 방식 선택	1:13371	검토중	03.04	View
MKT-004	판매 등록 상세 — 간접 업로드 — 보증서 확인 중	1:13169	검토중	03.04	View
MKT-005	판매 등록 상세 — 간접 업로드 — 보증서 기반 확인	1:12981	검토중	03.04	View
MKT-006	판매 등록 상세 — 간접 업로드 — 작품 사진 미리보기	1:12781	검토중	03.04	View
MKT-007	판매 등록 상세 — 간접 업로드 — 등록 완료	1:12588	검토중	03.04	View
MKT-008	판매 등록 상세 — 직접 업로드 — 작품 사진 미리보기	1:12362	검토중	03.04	View
MKT-009	판매 등록 상세 — 직접 업로드 — 보증서 파일 미리보기	1:12202	검토중	03.04	View
MKT-010	판매 등록 상세 — 직접 업로드 — 추가 사항	1:11942	검토중	03.04	View
MKT-011	판매등록 — 직접 업로드 — 완료	1:11824	검토중	03.04	View
MKT-012	판매등록 — 공통 모달	1:11687	검토중	03.04	View
MKT-013	작품 상세 페이지	1:11255	검토중	03.04	View

MYP 마이페이지 16 / 16

Screen ID	화면 이름	Node ID	Status	Updated	Action
MYP-001	마이페이지 메인 + 로그아웃 모달	1:9873	검토중	03.04	View
MYP-002	프로필 관리	1:9723	검토중	03.04	View
MYP-003	구매 내역 — 마켓 탭	1:9523	검토중	03.04	View
MYP-004	구매 내역 — 프라이빗 세일	1:9323	검토중	03.04	View
MYP-005	판매 내역 — 마켓	1:9123	검토중	03.04	View
MYP-006	판매 내역 — 프라이빗 세일	1:8923	검토중	03.04	View
MYP-007	찜한 작품	1:8736	검토중	03.04	View
MYP-008	계정 정보	1:8582	검토중	03.04	View
MYP-009	알림 설정	1:8444	검토중	03.04	View
MYP-010	공지사항 상세	1:8194	검토중	03.04	View
MYP-011	로그아웃 확인 모달	1:7901	검토중	03.04	View
MYP-012	1:1 문의 상세	1:7692	검토중	03.04	View
MYP-013	자주 묻는 질문(FAQ)	1:7504	검토중	03.04	View
MYP-014	약관/정책	1:7372	검토중	03.04	View
MYP-015	마케팅 수신 동의	1:7221	검토중	03.04	View
MYP-016	회원 탈퇴 서비스 개선 의견 작성	1:7072	검토중	03.04	View

PRS 프라이빗 세일 4 / 4

Screen ID	화면 이름	Node ID	Status	Updated	Action
PRS-001	프라이빗 세일 메인 화면	1:11018	검토중	03.04	View
PRS-002	프라이빗 세일 — 작품 구해요 등록	1:10715	검토중	03.04	View
PRS-003	프라이빗 세일 — 작품 팔아요	1:10409	검토중	03.04	View
PRS-004	프라이빗 세일 안내 모달	1:10247	검토중	03.04	View

관리자 화면 — Admin Screens (19)

BO-LIN 백오피스 로그인 3 / 3

Screen ID	화면 이름	Node ID	Status	Updated	Action
BO-LIN-001	백오피스 진입 페이지	1:6847	검토중	03.04	View
BO-LIN-002	백오피스 진입 — 이메일 형식 오류	1:6726	검토중	03.04	View
BO-LIN-003	백오피스 진입 — 각종 모달	1:6514	검토중	03.04	View

BO-USR 백오피스 사용자 관리 6 / 6

Screen ID	화면 이름	Node ID	Status	Updated	Action
BO-USR-001	사용자 관리 메인	1:6089	검토중	03.04	View
BO-USR-002	사용자관리 메인 (드롭다운 펼침 1)	1:5730	검토중	03.04	View
BO-USR-003	사용자관리 메인 (드롭다운 펼침 2)	1:5374	검토중	03.04	View
BO-USR-004	사용자 정보 상세	1:4590	검토중	03.04	View
BO-USR-005	사용자관리 상세보기 (드롭다운 펼침)	1:3878	검토중	03.04	View
BO-USR-006	사용자 관리 각종 모달	1:3699	검토중	03.04	View

BO-ART 백오피스 작품 관리 4 / 4

Screen ID	화면 이름	Node ID	Status	Updated	Action
BO-ART-001	작품 관리 메인	1:3175	검토중	03.04	View
BO-ART-002	작품 관리 상세보기	1:2829	검토중	03.04	View
BO-ART-003	작품 업로드	1:2516	검토중	03.04	View
BO-ART-004	작품 관리 메인 — 각종 모달	1:2283	검토중	03.04	View

BO-INQ 백오피스 문의 관리 2 / 2

Screen ID	화면 이름	Node ID	Status	Updated	Action
BO-INQ-001	작품 문의 관리 메인	1:441	검토중	03.04	View
BO-INQ-002	작품 문의 관리 메인 — 각종 모달	1:298	검토중	03.04	View

BO-TRN 백오피스 거래 관리 3 / 3

Screen ID	화면 이름	Node ID	Status	Updated	Action
BO-TRN-001	거래 관리 메인	1:1553	검토중	03.04	View
BO-TRN-002	거래 관리 메인 — 상세보기 페이지	1:1196	검토중	03.04	View
BO-TRN-003	거래 관리 메인 — 각종 모달	1:991	검토중	03.04	View

BO-ETC 백오피스 공통 1 / 1

Screen ID	화면 이름	Node ID	Status	Updated	Action
BO-ETC-001	GNB / 헤더 (알림 버튼 / 관리자 정보)	1:145	검토중	03.04	View

스토리보드 아카이브자동화 프로토콜