디자인 토큰 & 브레이크포인트 시스템
5개 변수 모드와 브레이크포인트 시스템, 캐노니컬 토큰에서 복원한 전체 바인딩 전수조사.
Figma → 명세 → 스토어프론트
Recto는 캐노니컬 Figma 원본에서 모듈 단위로 재구축되었습니다. 이 페이지는 빌드·배포 히스토리와 디자이너 요청 처리 현황을 자동으로 동기화해 보여주는 공개 기록입니다.
실시간 · main / dev
main·dev 브랜치의 최신 커밋입니다. 두 브랜치에 푸시가 있을 때마다 자동으로 다시 빌드·배포되어 이 목록이 갱신됩니다. (생성 시점: 2026-10-10 15:23 UTC)
디자이너 요청 · 20건
디자이너가 Notion에 남긴 요청과 각 항목의 처리 상태입니다. 요청 원문은 Notion에서 실시간으로 가져오며, 상태는 운영/스테이징 반영 여부에 따라 표시됩니다.
| 항목 | 요청 | 상태 | 커밋 |
|---|---|---|---|
| Q2① | 확대 이미지: 화면 너비 맞춤 · 원본 비율 · 세로 스크롤 | 스테이징 반영 | 783770f |
| Q2② | 사이즈 목록 가로 스크롤 (작은 화면에서 전부 노출) | 스테이징 반영 | e0110fd |
| Q3 | 2차 확대 150% · 클릭 지점 중심 · 드래그 패닝 · 재클릭/바깥 클릭 축소 | 스테이징 반영 | 783770f |
| 사이즈 | PLP→PDP 진입 시 사이즈 미리 선택 해제 | 스테이징 반영 | e0110fd |
| 항목 | 요청 | 상태 | 커밋 |
|---|---|---|---|
| #1 | 카드·PDP에 모든 컬러웨이 스와치 표시 | 스테이징 반영 | 905fcde |
| #10 | AboutNav 'about' 비클릭 라벨 처리 | 운영 반영 | 8c2de01 |
| #11 | 필터 정렬(순서) 단일 선택 (radio) | 운영 반영 | 8c2de01 |
| #12 | 캠페인·컬렉션 확대 뷰어 (전체 이미지 + 줌) 검토 필요 #12는 로그상 AboutNav 드릴인(운영)과 캠페인 확대(스테이징) 두 곳에 등장 — 매핑 확인 필요 |
스테이징 반영 | dbe0a31 |
| #13 | 사이즈 오버레이 닫기(X) 상단 이동 + 개폐 애니메이션 | 운영 반영 | 7447c90 |
| #14 | 이미지 2차 확대 (돋보기 · 패닝 · 클릭아웃) | 스테이징 반영 | 783770f |
| #15 | PDP 본문 상단 패딩 조정 | 운영 반영 | 7447c90 |
| #2 | PLP 내비 가장자리 항목 잘림 방지 (좌우 패딩) | 운영 반영 | 7447c90 |
| #3 | PLP 내비 오버플로 스크롤 가장자리 정리 | 운영 반영 | 7447c90 |
| #4 | 헤더 1차 내비 재탭 시 메가메뉴 닫기 (태블릿 포함) | 운영 반영 | 8c2de01 |
| #5 | OS 관련 항목 검토 필요 로그상 'verify-only'로만 표기 — 정확한 요청 내용 확인 필요 |
확인 전용 | |
| #6 | PLP 카드 사이즈 전체 표시 + 스크롤 | 운영 반영 | 7447c90 |
| #7 | 드롭다운 사이즈 전체 표시 | 운영 반영 | 7447c90 |
| #8 | 사이즈 목록 스크롤 동작 | 운영 반영 | 7447c90 |
| #9a | 매장 재고 드로어 타이틀 정리 (regularTitle) | 운영 반영 | 7447c90 |
| #9b | 매장 목록 스크롤 | 확인 전용 |
방법론
각 모듈은 캐노니컬 파일에서 추출되어, 이를 무너뜨리려 시도하는 별도 에이전트의 독립 리뷰를 받았고, 모든 지적사항이 해결된 뒤에야 확정되었습니다 — 총 103건.
50MB Figma 파일에서 해당 캐노니컬 섹션을 기계적으로 추출.
토큰·지오메트리·상태·모션을 전수조사와 함께 정밀하게 명세로 작성.
별도 리뷰어가 모든 수치를 원본과 대조 검수하고, 빈틈이 있으면 반려.
모든 지적사항을 수정하고, 깨끗이 승인될 때까지 재검수.
명세를 라이브 스토어프론트로 구현하고 프로토타입과의 일치를 검증.
빌드 · 29개 모듈
단계별로 분류한 전체 모듈 목록입니다. 모든 모듈이 확정 게이트에 도달했으며, 각 모듈 하단의 수치는 그 과정에서 해결한 리뷰 지적사항 수입니다.
캐노니컬 Figma 파일에서 추출한 디자인 시스템 기본 요소.
5개 변수 모드와 브레이크포인트 시스템, 캐노니컬 토큰에서 복원한 전체 바인딩 전수조사.
6개 공유 텍스트/그리드 스타일 해독, 383개 임의 텍스트 노드와 문자 단위 오버라이드 전수조사.
Button / TextBTN 변형, 상태별 색상, 3.7천 개 인스턴스의 300ms ease-out 호버 처리.
TextField · CheckBox · Dropdown · Accordion — 커서 깜빡임 + 스마트 애니메이트 아코디언 동작.
브랜드 워드마크와 아이콘 세트, 지오메트리와 사용 규칙.
이미지 호버/디졸브 전환과 가격 표시 위젯.
커머스 위젯 — 사이즈 선택, 재고 표시, 장바구니 담기 요소.
글로벌 크롬 — 구분된 4개 헤더 세트, 메가메뉴 호버 모델, 내비·푸터·텍스트배너.
프로토타입에서 픽셀 단위로 재현한 모든 화면과 오버레이.
홈 화면 — 에디토리얼 영역, 히어로, 캠페인 카드.
상품 목록 페이지와 반응형 상품 그리드.
상품 목록 필터/정렬 오버레이 패널.
상품 상세 페이지 — 갤러리, 사이즈/색상, 정보 아코디언.
검색 오버레이 — 입력 상태 + 결과 상태.
매장 재고 확인 오버레이 + 재입고 알림.
위시리스트 드로어.
장바구니 드로어.
결제(체크아웃) 페이지.
회원가입과 로그인 인증 화면.
계정 대시보드와 하위 화면.
어바웃 — 캠페인/컬렉션 에디토리얼 내비게이션.
푸터 목적지 화면들.
팝업/모달 시스템.
글로벌 프로토타입 플로우 & 모션 — 4개 브레이크포인트 플로우, 전환 타이밍.
디자인을 라이브 스토어로 렌더링하는 Next.js + Shopify 스토어프론트.
Next.js 앱 아키텍처와 디자인 토큰 연결.
Shopify Storefront 연동 — 카탈로그, 검색, 고객.
장바구니와 커스텀 결제 (최소 Shopify 핸드오프).
조립, 프로토타입 플로우와의 라우팅 일치, QA 매트릭스.
에셋 수집과 검증.
이후 캐노니컬 페치에서 추가된 계정 복구 플로우.
아이디 찾기 + 비밀번호 찾기 인증 복구 화면.
기록 · 105개 체크포인트
빌드 중 기록된 모든 체크포인트와 출시 이후의 운영 수정 — 최초 추출부터 라이브 스토어, 그 이후까지의 전체 여정입니다. 최신 항목이 맨 위에 표시됩니다.
디자이너가 Q1–Q3에 답변(Notion 페이지 "9" + PLP 손그림 + 채팅)하여 check 103에서 보류됐던 배치 C(#1 색상)+배치 D(이미지 뷰어 줌)와 신규 사이즈 미리선택 해제를 구현. 6건 모두 dev → recto-dev.gunho.ai; prod 승격 PR은 여전히 대기. (A, e0110fd) PDP 진입 시 사이즈 미선택(check 99 되돌림) — `?color=` 딥링크 색상은 그대로 선택되고 사이즈만 사용자가 고름; 빈 선택 시 장바구니는 안전(크래시 없음) — 인뷰 쇼핑백은 사이즈 선택 전 무동작, 하단 고정바 쇼핑백은 상품으로 스크롤. (B, Q2②) 사이즈 목록 가로 스크롤(overflow-x:auto + nowrap)로 작은 화면에서 모든 사이즈 노출. (#1, 905fcde) 색상별 개별 상품을 스타일 코드(handle − 색상 slug)로 묶어 모든 PLP 카드·PDP에 색상 스와치 노출(현재 색 먼저/활성, 클릭 시 해당 색 PDP로 이동). (C+D, Q2①+Q3) PDP 확대 뷰어 = 원본 비율 전체 이미지·세로 스크롤(4:5 크롭 없음) + 클릭 지점 기준 150% 2차 확대·드래그 패닝(흰 여백 없음)·돋보기/잡기 커서·재클릭/바깥/✕/Esc 닫기. (#12) 캠페인/컬렉션 확대도 ZoomableImage로 동일 방식 적용. 데스크톱+모바일 390px 라이브 검증 완료. 디자이너 확인 필요: 무동작 인뷰 쇼핑백의 비활성 표시 여부, PLP 스와치 이동(토템 방식, 명세상 PDP만), "(색상)" 제목 접미사 중복.
인시던트: 스테이징 /shop이 크롬은 렌더했으나 상품 그리드가 비어 있음(PlpGrid 자식 0개). Cloud Run 로그로 진단: `TypeError: fetch failed`가 rev 00013(배치 B)에서만, 11:13 UTC부터 발생 — 그러나 00013은 09:37 배포 후 약 1.5시간 정상 동작(코드/이미지 결함이라면 첫 요청부터 실패).
Notion 페이지 "8"의 15개 이슈 피드백(로그인된 Chrome으로 열람; 비공개 페이지). 배치로 그룹화. 배치 A(7447c90) — CSS/빠른 수정: (#6/#7-8) PLP 카드 +드롭다운 사이즈 목록이 모든 사이즈를 표시하고 썸네일 내에서 스크롤 — `.card`를 컨테이너 쿼리 컨테이너로; 목록 경계 한정.
`dev`(recto-dev.gunho.ai)에서 클라이언트 조정 5건, 각각 라이브 검증: /account/address 추가+수정 폼의 전화번호 자동 포맷(ce2dec5): 신규 클라이언트 PhoneField가 서버 렌더 입력을 formatKoreanPhone onChange로 래핑(입력 시 010-XXXX-XXXX); phoneToE164가 제거.
워크플로 전환(98160dc): 앞으로 모든 recto-fable 수정은 `dev` 브랜치에서 진행, GitHub Actions + WIF로 별도 스테이징 서비스 recto-fable-dev(recto-dev.gunho.ai)에 자동 배포. dev→main은 PR 경유; main/prod 직접 커밋 금지. 스테이징은 격리(자체 미디어 버킷 경유).
클라이언트: 재입고 알림 신청 드로어 헤더가 Bold였음; Regular로 변경. RestockDrawer.tsx 한 줄 수정 — DrawerShell에 `regularTitle` 전달(BagDrawer가 이미 쓰는 플래그), <h2>가 text-bd-13-11 대신 text-rg-13-11로 렌더. 두 유틸리티 클래스(src/styles/typography.css).
요청: PDP 진입 시 색상만 선택된 상태로 두지 말 것 — 완전한 SKU(색상+사이즈) 해석. 활성 색상의 가용 최소 사이즈를 기본값으로; 해당 색상이 전부 품절이면 최소 사이즈 변형을 선택하고 장바구니 CTA는 재입고 알림 신청으로 표시.
feat/plp-card-color-size-cart 브랜치에서 구축(커밋 5개) → main으로 --no-ff 머지 → 푸시(e55fb91) → 사용자가 배포(Cloud Run rev recto-fable-00020-4tl, 트래픽 100%). (1) 카드가 최좌측 색상을 기본값으로; 칩 선택이 이미지(distinct 시 variant.image) + 사이즈를 구동.
신규 `src/components/about/AboutNav.tsx`(+ .module.css), PLPNav 모델 기반 클라이언트 브레드크럼 내비가 d-store(DStoreClient.tsx)와 f-store(about/f-store/page.tsx) 페이지의 정적 `StoreCrumbs.LocationRow`를 대체. `LocationRow` 제거; `KoreaNav`는 그대로.
M29(v2367)를 ../recto-fable에 구현: 신규 라우트 /find-id + /find-password(src/app/), 공유 src/components/forms/FindForm.tsx(변형 id|password; password는 선행 아이디 필드 추가) M29 §A0.2/§A0.3 준수. forms/ui.module.css(.body/.col/.stackS/.stackM/.field/.button) 재사용.
클라이언트 조정 3건. 빌드 0-err + 린트 클린, rev 00017 배포(recto-fable-00017-qrr, 100%), fd62c04 커밋 + 푸시. 라이브 검증(dev): /join + 재입고 드로어 전화번호 010-XXXX-XXXX 포맷; 로그인 "account" 제목 font-weight 400; 재입고 제출 justify-content center.
캠페인/컬렉션 메가메뉴 CONTENT IMAGE CAPTION에 대한 헤더 조정 2건(Header.tsx renderContent `<span class="… text-rg-13-11">`, 예: "men fall summer 2024"). 빌드 0-err + 린트 클린, rev 00016 배포(recto-fable-00016-x5q, 100%), 71e4cc6 커밋 + 푸시. 라이브 검증.
플랜 모드 배치(작업 7/9/10/11; 작업 8 PLP 카드 +/X는 클라이언트 지시로 건너뜀). 빌드 0-err + 린트 클린, rev 00015 배포(recto-fable-00015-s6w, 트래픽 100%), c9e6f66 커밋 + 푸시. 전부 모바일 500px·데스크탑 1366px에서 브라우저 라이브 검증(dev + recto.gunho.ai).
클라이언트 보고 모바일 수정 4건; 빌드 0-err + 린트 클린, rev 00014 배포(recto-fable-00014-q6b, 트래픽 100%), e53ee46 커밋 + origin main 푸시. 4건 모두 recto.gunho.ai에서 제공 CSS/HTML로 라이브 검증(이번엔 Chrome 확장이 연결 해제됨).
다중 배치 클라이언트 보고 UI 수정; 전부 브라우저 검증(dev + 라이브 recto.gunho.ai), 빌드 0-err + 린트 클린, rev 00013 배포(recto-fable-00013-24g, 트래픽 100%), 0e7fc82 커밋 + origin main 푸시. 세션의 제품 결정 / 정본 수정 PROGRESS.
사용자: About→Campaign에 개별 이미지 2개, About→Collection 2개, 메인 드롭다운 1개여야 함 — 빌드는 모든 메가메뉴 셀에 동일 플레이스홀더(ece298d0)를 보임. 근본 원인: M27 조립이 모든 Content 셀에 Img 마스터 기본값을 사용; 정본은 개별 ref 5개.
사용자가 사이트 전역 에디토리얼 이미지를 이미지 또는 비디오로 교체할 커스텀 인앱 대시보드를 선택(Shopify 메타오브젝트 대신), 공유 비밀번호 인증, 경량 빌드. 구축: GCS 버킷 recto-fable-media(공개 읽기; Cloud Run SA objectAdmin), ADMIN_PASSWORD 시크릿 + MEDIA_BUCKET.
사용자: 배너 닫기가 닫히지 않음. 정본에 충실했던 것(M08 §4: TextBanner 인터랙션 0개; M23 §8.9 프로토타입상 무반응) — 비활성으로 출하됐음. 제품 결정: 배선. TextBanner → 클라이언트 컴포넌트; 닫기가 해제 + 세션 지속(sessionStorage).
사용자가 f-store 브레드크럼 + 'korea' 좌측 정렬을 지적하며 전체 정렬 감사 요청. 정본 확인: Location/Filter 행 pa=CENTER(전 너비), korea TextBTN은 328/760/1240/1880에서 프레임 가운데 정렬 → StoreCrumbs 수정(브레드크럼 justify-content:center + grid-column 1/-1).
사용자: /about/f-store 텍스트가 좌측 정렬, 정본은 가운데 정렬. 정본 검증: 주소 TEXT 629:16059 + 지도 TextBTN 629:16061 = style.textAlignHorizontal CENTER(M20 §4.2); 우리의 .address는 text-align 없음(→ 좌측), .mapRow는 justify-self:start. 둘 다 가운데로 수정.
사용자: 폰에서 헤더 아이콘이 정본보다 작아 보임. 브라우저 측정: 글리프가 정본 12px 대비 약 5px로 렌더(M08 §1.1.1의 Vector). 근본 원인: 아이콘 SVG가 width/height=28(28×28 InteractiveArea)을 선언하나, 전역 `svg{max-width:100%}`가 SVG 너비를 12px로 클램프.
사용자: "회원가입은 전송되는데 변화가 없음; 로그인 버튼이 회색으로 남음." 진단(브라우저 E2E): 회원가입 흐름 자체는 정상(신규 가입 → /account로 로그인 상태 즉시 리다이렉트 — 검증); 사용자 시도는 Shopify의 전화번호 유일성 규칙으로 거부됨("Phone has already been ...").
사용자가 랜딩 페이지에서 Figma 대비 로고→콘텐츠 여백이 더 넓음을 발견. 근본 원인: 정본 모델은 Header를 모든 Body의 상단 60px에 ABSOLUTE로 겹쳐 배치(M18 §A0.1 그대로; M09 §0/M10 §1.1), Gap.L 패딩이 그 몫을 예산화; 우리의 in-flow sticky 헤더는 60px를 더함.
1) 로그인 버튼 가운데 정렬(좌측 정렬 변형 제거); 2) PDP 고정 구매 바를 IntersectionObserver로 스크롤 트리거화(제품 결정; 정본은 항상 표시); 3) 드로어 외부 클릭 시 닫힘(제품 결정; 정본 백드롭은 비활성 펜스였음).
API로 도메인 소유권 전면 검증(ADC + siteverification 권한; Porkbun API로 TXT 등록; Search Console 방문 0회). Cloud Run 도메인 매핑이 asia-northeast3에서 미지원 → 프로덕션급 대안 구축: 글로벌 외부 HTTPS LB.
https://recto-fable-1039760624489.asia-northeast3.run.app 에서 라이브 — GCP 프로젝트 recto-fable(신규, 결제 연결, API run/cloudbuild/artifactregistry/secretmanager), 리전 asia-northeast3, min-instances=1 + 시작 CPU 부스트, 1 vCPU/1Gi, SHOPIFY_* 시크릿 4개.
사용자가 /join으로 실제 계정 생성(스토어에서 클래식 고객 인증 작동 확인 — QA DEV-16의 인증 의문 해소; 이 스토어 admin에는 클래식/신규 토글 없음, 호스티드 표면 설정은 헤드리스 흐름과 무관). 보고: 멤버십 위젯이 사용자를 환영.
사용자: 위시 드로어(및 드로어 일반)가 페이지와 시각적으로 합쳐짐 — 정본 프레임에는 스트로크/스크림 없음(흰색 위 흰색; M16/M23 둘 다 미인코딩, 충실히 구현). 결정: ≥800에서만 DrawerShell 패널에 1px solid var(--color-black) border-left 적용.
사용자: PDP 위시리스트 버튼은 위시리스트에 추가해야 함(프로토타입/M12 §1.6-c는 오버레이 전용으로 배선; M25 §5는 하트에 추가를 할당 — 두 해석 모두 충실히 구현됐고 이제 사용자가 재정의). 두 PDP 위시 CTA 모두 addWish(handle) 호출 후 드로어 오픈(recto-fable).
사용자 승인 Chrome 탭에서 브라우저 QA 패스 실행: 4개 너비 패스(500*/800/1280/1920; *Chrome macOS 최소 너비 500 — DEV-15 브라우저 제약; 500에서 Mobile 모드 활성), 매트릭스 셀 1036개 전수 판정, Shopify 호스티드 결제로의 핸드오프 검증.
recto-fable 커밋: ecd24e3(A 크롬: Header/MegaMenu/TextBanner/Footer/PLPNav/AccountNav, TopBar 삭제), 04a363a(B 페이지: M09 Main 3영역 + 에디토리얼 카드 5개, M10 PLP 밀도/하단 바/카드 해부, M12 PDP 갤러리+ViewImg+아코디언+구매 바).
M27 명세 확정(364줄; 리뷰 전 23개 지적 인용 패스 + 3라운드 9→1→0). 조립 정책 레이어 정본화: 단계별 빌드 맵(0→H, opener 표기), R0–R8 디자인-대-데이터 규칙, 크롬 계약(Header 상태 기계, navMap 위 링크 타겟 테이블).
M26 구현 커밋(recto-fable): lib/cart 완성, /checkout 핸드오프 라우트, BagDrawer + BottomSheet, PDP/Wish/TopBar 배선, 로그인/로그아웃 장바구니 쿠키 정책. 독립 검증: 빌드 ✓ 린트 ✓ /checkout 307→/ ✓. M27(조립, 라우팅 일치) 진행.
M26 명세 확정(381→431줄, 2라운드: 9→0). 기록상 결정: M17 Payment 페이지 미구축; /checkout = 핸드오프 Route Handler(5단계: cookie→fetch→null/empty 리다이렉트→buyer-identity 부착→checkoutUrl로 307). 장바구니 API 표면 라이브 검증.
M25 구현 커밋(recto-fable d5a1d3a): lib/shopify(client/types/queries/customer/actions), 47키 navMap 바이트 일치, PLP/PDP/search/account/join 라이브 배선, 오버레이(Search/Login/Wish/Filter/Restock), localStorage 라이브러리, remotePatterns. 검증 완료.
M25 확정. 5라운드: 16→6→4→2(반박)→승인. 실 지적 궤적 16→6→4→0. r5가 필수 바이트 단위 프로브 프로토콜 하에 r4 분쟁을 판정: 오케스트레이터 반박을 전면 재현, 아티팩트(따옴표 제거 → 9)를 의도적으로 재현.
오케스트레이터가 r4 증거를 바이트 단위로 재검증(쿼리를 jq --arg로 GraphQL $q 변수로 전달; 페이로드에서 따옴표 보존 입증; 각 프로브를 productType 세트 검사와 함께 두 번 실행): 원본 명세 쿼리는 정확히 주장된 37/1/6/0을 반환; 제기된 의혹은 무효.
r4 반려 2(BLOCKER: men-tops-t-shirts 중간 쿼리가 37이 아닌 9개를 반환 — 따옴표가 붙은 &-구문이 Storefront 검색 구문에서 OR 평가를 순서 의존적으로 깨뜨림: "Shirts & Tops" OR T-Shirts → 0(!); T-Shirts OR Tops → 38 진합집합; MAJOR: r3).
M25 명세 작성(405→549줄; 핸들 12개 이상의 컬렉션 제안, jq 검증 카운트; 비공개 토큰 클라이언트; 클래식 고객 계정; 라이브 API 검증 내장). 카탈로그 스냅샷을 modules/M25-shopify-storefront/catalog-snapshot.json에 고정(상품 63개).
M24 구현이 ../recto-fable에 안착(커밋 a23683e, 추적 파일 278개): 스캐폴드(Next 16.2.9 / React 19.2.7 / TS 5.9.3 strict / pnpm@10.34.2 packageManager / engines+.nvmrc로 Node-22 핀), 명세 §3/§7에 따른 scripts/build-tokens.mjs + sync-assets.mjs.
M24 명세 1회차 확정(M11/M14에 이어 역대 세 번째 r1 클린). 작성 에이전트가 420줄 명세 작성(스택 핀 Node22/pnpm10/Next16/React19/TS5-strict; M01 §5 따라 src/design/tokens.ts를 둔 src/ 레이아웃; 30속성 매핑 테이블 + 제외 3개의 토큰 코드 생성).
사용자: Shopify 스토어에 상품은 있으나 컬렉션 없음; Storefront 토큰만 사용 가능(Storefront API로 컬렉션 생성 불가). PLAN.md START-HERE + 메모리에 기록: M25 1단계 = 카탈로그 쿼리 + 디자인 내비 분류 체계 기반 컬렉션 구조 제안.
사용자 지시로 저장소 이름 변경: recto-web → recto-fable(~/projects/verycommon/recto-fable; README, PLAN.md, PROGRESS.md, 메모리 모두 갱신; git 이력에 init + 이름 변경 커밋 표시). 참조 일관성 확보; "recto-web" 잔존 없음. 구현 단계 시작 예정.
사용자가 M24–M27 승인. 형제 저장소 생성: ~/projects/verycommon/recto-fable(git init, main 브랜치, FIGMA-FETCH 정본 소스 연결 README + 자격증명 안내, .gitignore에 .env* 포함). Shopify Storefront 자격증명 존재 확인.
M23 확정(r2 승인, 9→0; 리뷰어가 9건 수정 전부 재도출 — 22쌍 그룹핑, 823개 액션 SMART_ANIMATE 전수조사 전체, 세트별 정의 테이블 셀 단위, 네 세트의 1/1/3/3/3 메가메뉴 형태, 2052+474=2526 계약 산술 포함).
M23 수정 완료: 9/9 적용, 재도출 포함 — 세트별 정의 흐름 전수조사 전체(NAVIGATE 238 / OVERLAY 224 / URL 12 = 474)를 §7.2에 추가하여 계약 #3이 "배치 2052 + 정의 474 = 2526"으로 성립. 수정기는 SwipeList PUSH RIGHT ×6도 재분류.
M23 r1: 반려, 지적사항 9건(MAJOR 7 + MINOR 2), 전부 정밀 귀속/전수조사 오류: 22쌍(21×7 아님) AccountNav 정의 엣지 전수조사(AccountNav=6 Membership ×6+×1 이상치 포함); PLP 표준 순서 하트가 Mobile/TAB/1280에 걸침; SMART_ANIMATE 행 expand 오귀속.
M28 확정(r2 승인, 2→0; 리뷰어가 폰트 전수조사 수정을 file.json + M02 §2.3 + M02의 제외 DIRECTIVE + M01의 토큰 별칭 대비 검증, 수정이 다른 곳을 건드리지 않았음을 확인). 사용자가 제기한 에셋 공백 완전 해소: sha1 검증된 이미지 722개 디스크 상 보유.
M28 r1: 반려, 지적사항 2건 — 명세는 "단일 문서 폰트"라 주장했으나 M02는 정확히 2개 표본 노드에서 Neue Haas Grotesk Display Pro를 문서화(M02 DIRECTIVE에 따라 프로덕션에서 의도적으로 제외); 계약 항목 3이 그 모호함을 상속. M02 인용과 함께 둘 다 수정.
M28(에셋) 확보 완료: 이미지 722/722개 다운로드(2.0GB, 실패 0건); 722개 전부 sha1(content)==imageRef 검증(불일치 0건 — Figma imageRef는 콘텐츠 SHA-1); MIME 전수조사 jpeg 490 + png 232; 채움에 사용된 ref 213개 전부 존재; manifest.tsv 작성.
M23 추출 완료: 레코드 6036개 / 항목 8708개 / 액션 9019개 완전 귀속; 전이 시그니처 정확히 14개, 파일 전역에서 이징/지속시간 쌍은 단 2개; 인바운드 0 프레임 39개(Main-Mobile 흐름 시작 + ViewImg 14 + Popup 20 + Grid 4); 미연결 액션 47개(전부 M08).
M22 확정(r2 승인, 2→0; 두 수정 모두 검증 — Popup lorem을 M09의 565:29674와 바이트 비교, M01 §1.1 대 §1 상호참조 판정 포함). 추출 모듈 22개 전부 정본화(M01–M22): 토큰, 타이포그래피, 컴포넌트 레이어 전체.
M22 r1: 반려, 지적사항 2건(MAJOR §0.1 M01 상호참조가 M01 §1.1의 대안 규약 전수조사의 "정확히 그 프레임"이라 주장했으나 그 전수조사는 Grid 프레임 4개 포함 ×9/×5/×5/×5 — 엄격 부분집합 표현으로 재한정 후 ×8/×4/×4/×4 다중집합을 M01 §1의 Popup에 귀속).
M22(Popup) 추출 완료 — 마지막 화면 모듈: 프레임 20개 = 다이얼로그 패밀리 4개 × 표현 변형 5개(Mobile 바텀시트 포함); 노드 160개; Button 5:261 인스턴스 30개, 전부 의미상 공백(기본 장바구니 담기 라벨, 호버 전용); 섹션은 완전히 고립됨.
M19 확정(r2 승인, 10→0; 리뷰어가 10건 수정 전부 재도출 — 패밀리 프레임 14개의 내비 엣지 그룹핑, 46개 노드 gridRowsSizing 전수조사, 44개 프레임 푸터-y 차이 포함, M17 Open-questions 항목 11 정오표 플래그가 정확하다고 판정).
M21 확정(r2 승인, 3→0; 리뷰어가 16개 목적지 오버레이 전수조사, textRangeFills 바인딩 12개 전부 포함 381/12 bv-key 분할, BACK 버튼 오버라이드 목록 4개 + 전체 액션 전수조사를 바이트 단위로 재도출). 정본 모듈 20개(M01–M18, M20, M21).
M19 수정 완료: 10/10 적용, 전면 재도출(세트별 정의 엣지 분할 + 44개 프레임 푸터-y 직렬화 차이 포함). 수정기는 r1 판정의 자체 오표기도 정정함(M17의 잘못된 칩 라인은 Downstream contract가 아니라 Open-questions 항목 11) — 본인의 M17 오류.
M21 r1: 반려, 텍스트 지적사항 3건(MAJOR 오버레이 전수조사 산술 "기타 id 14개"→15; MINOR 푸터 주소 TEXT 12개의 textRangeFills가 bv-key 주장에서 누락; MINOR BACK 버튼 ;5:258 오버라이드 목록 축약이 boundVariables 필드를 가림). 인라인 수정.
M19 r1: 반려, 지적사항 10건(MAJOR 4건: CheckOut "보유자 0개" 자기모순; 정의 엣지 카운트가 배치된 허브 엣지와 혼동; textarea = 9개가 아닌 개행 10개; 허브 Text 자식 순서 주장이 4개 모드 중 2개에서 오류. MINOR 6건: 카운팅 오류 17→18 / 33→31 / 14→11, 푸터-y 이중 표기 포함).
M21(Footer 화면) 추출 완료: 프레임 12개, 중첩 SECTION 없음(MenbershipInfo / Agreement / FQA ×4 모드); 인스턴스 532개; 인터랙션 전수조사 472/656; 인바운드 엣지 416개(배치 푸터 372 + 마스터 12 + Nav 내부 24 + Account 버튼 8, 회원 탈퇴 ×4 포함).
M19(Account) 추출, 2차 시도에서 완료(증분 쓰기 성공): 중첩 SECTION 8개 / 프레임 44개; 노드 4497개, 인스턴스 1644개, 인터랙션 항목 1744개; 허브 히어로 + 9버튼 라우터; Edit 3상태 사이클; OrderList→Detail(항목 2만 연결); Restock 7항목 데이터셋; FQA.
M20 확정(r2 승인, 12→0; 리뷰어가 12건 수정 전부 재도출 — 240×0.50 opacity 전수조사, 48개 프레임 노드 카운트, 전수조사 2건, imageRef 교집합 10쌍, item#1↔Select 이미지 연결 주장 포함). 정본 모듈 19개(M01–M18, M20).
M20 수정 완료: 12/12 적용, 모든 값 재도출(opacity-0.50 ×240은 VAS 디밍으로 사실 문서화; 48개 프레임 전체의 실제 자식 재귀 카운트; layoutSizingVertical+layoutGrow 기반 사이징 태그 재도출, Body 52개·Nav 20개 전수조사 포함). 수정기가 항목 명시.
M20 r1: 반려, 지적사항 12건 — 세션 최대 판정. BLOCKER 1건: 명세가 opacity 오버라이드를 잔여물로 일축했으나 VAS 필름스트립 240개 항목이 opacity 0.50을 직렬화(활성 항목 디밍 동작 누락!). MAJOR: 오버라이드 멤버십이 "#2..#n"이 아닌 488/496(Campaign #1).
M19 추출기(1차 실행) 종료: 89분 / 도구 사용 64회 후 "요청 시간 초과", 아무것도 미기록. 완화책: 직접 섹션을 열거함(중첩 SECTION 8개, 프레임 44개: Account 4, Edit 12(중복 명칭 Mobile 프레임 포함), Adress 4, OrderList 8, RestockNotificationList 4).
M20(About) 추출 완료 — 프레임 수 기준 최대: 중첩 SECTION 5개 / 프레임 48개(Campaign 12, Collection 12, Brand 4, FStore 4, DStore 16); 인스턴스 2028개; 인터랙션 항목 1196개 / 보유자 760개; 이미지 채움 1132개(고유 132개); 보유 AboutImgItem 602:16285 완전 문서화.
M18 확정(r2 승인, 3→0; 리뷰어가 Title 정렬 4개 + Find 행 전부 재도출, 양측의 M08 인용 검증, Column.4 직렬화 2건의 float64 동등성 검사, 170개 엣지 배선 전수조사 재집계). 정본 모듈 18개(M01–M18). M20(About) 추출기.
M18 r1: 반려, 지적사항 3건(MAJOR Login Title counterAxisAlignItems CENTER가 4개 프레임 모두에 주장됨 — Mobile에만 참, TAB/1280/1920에서는 둘 다 null; MINOR 헤더 계정 사실에 대한 M08 §3 오인용 — 푸터 §3 인용은 정확하여 유지; MINOR Column.4 이중 직렬화).
M18(Join+Login) 추출 완료(재시작): Join = 풀페이지 프레임 4개(루트 비활성, 순수 흰색 채움, GRID Body, 자체 인터랙션 0개, 회원가입 CTA 미연결 막다른 길); Login = 표준 드로어 4개(로그인→Account NAVIGATE, 회원가입→Join NAVIGATE).
M17 확정(r2 승인, 4→0; 리뷰어가 566개 노드 전수조사, 미표기 1280 라인 포함 모든 rvp 플래그, Dropdown/TextField 스트로크 바인딩, M16 인바운드 엣지 4개를 재도출). 정본 모듈 17개(M01–M17). M19(Account) 추출기 시작(21MB 슬라이스 — jq 전용).
M17 r1: 반려, 지적사항 4건(MAJOR 노드 전수조사 2367→565 — 추출기가 VARIABLE_ALIAS 객체를 씬 노드로 셈; MAJOR TAB/1920 헤더 오버레이에서 resetVideoPosition 페어링 뒤바뀜; MAJOR Dropdown 스트로크 바인딩 16:268→87:2657로 M04와 모순; MINOR).
약 08:30에 세션 토큰 한도 도달: M17 추출기는 완전한 52KB 명세를 쓴 뒤 종료됨(Status: DRAFT, 정상 마감 섹션 — 요약 메시지만 유실); M18 추출기는 아무것도 쓰기 전에 종료. 한도는 KST 오전 9:10에 리셋, 즉시 재개.
M15 확정(r2 승인, 3→0; 리뷰어가 섹션 측과 정의 측 양쪽의 오버라이드 기록, 하트 20개, 카드 지오메트리 전부 재열거). 정본 모듈 16개(M01–M16 완료!). 오버레이 드로어 패밀리 전체 완료(Filter/Search/CheckStock/Restock).
M15 r1(재시작): 반려, 지적사항 3건(MAJOR §0.4 오버라이드 기록을 배치된 복제본에 오귀속 — 정의 내부 인스턴스에만 존재; MINOR 카드 높이 공식에서 8px 거터 누락; MINOR 1920 하트 우측 인셋 11.665008544921875이며 12 아님). 전부 인라인 수정.
M14 확정(재시작 후 r1 승인 — 지적 0건; 16개 항목 체크리스트, 유령 ;240:4621 실재 확인, PDP 슬라이스에서 인바운드 보유자 25개 검증, 핵심 외 약 70% 커버리지 포함). 정본 모듈 15개(M01–M14, M16). M17(Payment) 추출기 시작.
인프라 결함: M14 r1과 M15 r1 리뷰 에이전트가 모두 멈춤(600초 워치독 종료, 판정 없음, 리뷰 로그 미기록 — 검증 도중 종료된 것이지 반려 아님). 둘 다 "효율적 작업 / jq 일괄" 메모와 함께 새 r1 리뷰어로 재시작. 라운드 카운트에는 미산입.
M15(Wish) 추출 완료: 오버레이 프레임 4개, 보유 컴포넌트 1302:19901(인스턴스 20개), 4개 패턴으로 48/48/48 인터랙션, 아웃바운드 엣지 0개; 356개 항목 인바운드 전수조사가 M05 하트 수치를 재도출; 미해결 질문 9개. M14(CheckStock+Restock) 추출 완료.
M12 확정(r2 승인, 3→0; 리뷰어가 Empty 노드 32개 전체에서 clipsContent 분포 둘 다 독립 재도출, 부동소수 수정 22건 + 잔존 0건 검증, 수정된 모든 구절 재확인). 정본 모듈 14개(M01–M13, M16).
M13 확정(r3 승인, 1→1→0; r3가 M11/M16 비교 절을 두 섹션의 슬라이스 + 확정 명세 대비 검증). 정본 모듈 13개(M01–M11, M13, M16). M14(CheckStock+RestockNotification, 762:9955 + 762:9957) 추출기 시작.
M13 r2: 반려, 신규 MINOR 1건 — r1 수정 표현 "M11/M16 루트와 달리"가 M16에 대해 거짓(M16 루트는 null; SPACE_BETWEEN은 상속된 장바구니 행 Info 프레임에 있음 ;161:3619). 교훈: 수정 중 추가한 비교 절도 정본 검증을 거쳐야 함.
M12 r1: 반려, 지적사항 3건(MAJOR clipsContent 분포 — 프레임 Empty 7T/9F, spacer 11T/5F로, 주장된 4/12 "동일 반전"이 아님; MINOR 체계적 16자리 부동소수 직렬화 22개 값; MINOR 무의미 절 2건). 전부 직접 수정: 스크립트로 부동소수 40건 교체.
M13 r1: 반려, 지적사항 1건(MAJOR — §2.1/§5의 과도하게 일반화된 "SPACE_BETWEEN 없음" 문장 2건이 상속된 Completed-TextField 인스턴스 4개와 모순; 나머지 명세는 핵심 커버리지 100% 일치). 두 문장 모두 리뷰어 표현대로 범위 재한정.
M13(Search) 추출 완료: 프레임 8개(Search-Result 4 + Search 입력 4, 모두 M11 지오메트리와 일치하는 오버레이 패널); 보유 컴포넌트 374:4375 문서화(인스턴스 20개, Result 프레임당 5개, 오버라이드 클래스 A/B/C); 전수조사를 M03/M04/M05/M06과 교차 검증; 76/84/88.
M12(PDP) 추출 완료 — 현재까지 최대 모듈: 762:9932가 중첩 SECTION 2개 보유, 프레임 31개(PDP-Grid 17: base/SelectSize/SoldOut/Launch ×4 + BottomSheet-Mobile; PDP-ViewImg 14: Mobile+1280만, 인바운드 배선 0개 — 고립). 인스턴스 1802개.
M11 확정(r1 승인 — 파이프라인 첫 1회차 승인; 리뷰어가 핵심 값 100% + 나머지 거의 전부 재도출, 18개 항목 체크리스트, 지적 0건). 정본 모듈 12개(M01–M11, M16). M13(Search) 추출기 시작; M12(PDP) 추출기.
M11(Filter) 추출 완료: 오버레이 프레임 4개(DRAG→CLOSE, RIGHT/CENTER), 패싯은 TextBTN 칩만(M04 폼 컴포넌트 0개 — 예상과 달라 사실로 기록); 프레임당 인스턴스 39개(TextBTN 152 + 섹션 전역 Button 4, M03 전수조사와 일치); 섹션 내 308개.
M10 확정(r2 승인, 4→0; 4건 모두 슬라이스 대비 재도출, ×64 전이 패밀리 3개와 explicitVariableModes 보유 10건의 독립 재도출 포함). 정본 모듈 11개(M01–M10, M16). 진행 중: M11(Filter) 추출기; M12(PDP) 추출기.
M09 확정(r2 승인, 2→0; r1은 지적 2건만 나온 100% 핵심 감사 — 7:313의 잘못된 "분리된 바인딩" 괄호 설명 + 후행 LF md5 아티팩트; 둘 다 인라인 수정, r2가 수정 확인 + §1.3/§5.2 무회귀 확인). 정본 모듈 10개(M01–M09, M16).
재시작한 두 추출 모두 완료. M09 명세: 프레임 4개, 인터랙션 항목 161개/노드 103개, 7:320 전수조사 20개(프레임당 5개), 미해결 질문 5개(죽은 인터랙션을 가진 숨겨진 HeaderVer2; 미연결 모바일 로고). M10 명세: PLP 섹션은 프레임 8개(밀도 2 × 브레이크포인트 4) + Grid 4개.
새 세션. PLAN.md 레지스트리 + check-15 체크리스트 기준: 화면 파동을 처음부터 재시작(이전 M09/M10 부분 작업 폐기; 오래된 STATUS 파일만 잔존). 시작: M09(Main, 762:9926 + 독립 컴포넌트 7:320) 추출기; M10(PLP+Grid) 추출기.
M08 확정(r2, 11→0; SA 전수조사를 M03과 대조 정합). 앞서 끝낸 M16, M05, M07과 함께: 컴포넌트 레이어 전체 M01–M08 + 화면 모듈 M16이 정본화 — 총 9개 모듈 확정. 실행 중 에이전트 없음. 나머지에 대한 사용자 지시 대기.
M05 확정(r3, 12→2→0). ✅ M07 확정(r3, 8→2→0). ✅ M16 확정(r2 라운드 완료, 4→0 — 첫 화면 모듈; 중단됐던 실행의 칩 채움 관찰을 확인 후 수정). M08: r1 완료, 지적사항 11건(BLOCKER: 누락된 SMART_ANIMATE 접힘 42건 포함).
토큰 예산 복구. 앞선 M05 r2 에이전트는 실행되지 않음(세션 한도로 즉시 종료). 계획: 토큰 소비 조절을 위해 한 번에 두 개씩 리뷰 — 1파동: M07 r3(좁은 범위, 수정 2건) + M05 r2(수정 12건); 2파동: M08 r1(전체, AccountNav 지적 선반영) + M16 r1.
사용자: 약 3시간 17분간 토큰 소진; M05 r2 리뷰가 가능하면 마무리; 신규 작업은 시작하지 말 것. M07 r3 리뷰는 본 지시 전에 외부에서 중단됨(2회차 지적사항 2건은 이미 명세에 반영, 추후 확인 라운드만 필요). 일부를 제외하고 파이프라인 동결.
M06 확정(r2 승인, 5→0; 전수 재집계). M08 r1과 M16 r1 리뷰는 외부(사용자 측)에서 중단 — 재시작하지 않고 부분 지적사항은 리뷰 로그에 보존(M08의 AccountNav HORIZONTAL_SCROLLING 지적 검증 후 명세 수정; M16의 칩 채움 건 보존).
사용자 지시: 신규 추출 금지; 진행 중인 추출 중단; 진행 중인 보수적 리뷰의 승인 확보에 집중. 조치: 추출 에이전트 M09(Main), M17(Payment), M18(Join/Login), M10(PLP+Grid), M12(PDP) 중단 — 모두 진행 중이었으며 부분 작업 폐기.
M04 확정(r2 승인, 8→0). ✅ M03 확정(r3 승인, 6→1→0; 약 90% 재도출). 이제 기반+컴포넌트 모듈 4개가 정본화(M01–M04). M06 수정 완료(5/5 + 메커니즘 표현 1건 선제 정비); r2 시작. 화면 추출기 확장.
M02 확정(r3 승인 — 게이트를 통과한 첫 모듈; 105 전수조사가 명세 쪽으로 판정). ✅ M01 확정(r5 승인 — 8→7→5→2→0; 리뷰어 표현 기반 수정이 주효). M03 r2: MINOR 1건("모든 섹션" → 20개 중 17개) — 인라인 수정 후 r3 시작.
M01 r4: MINOR 2건만으로 반려 — 루프 가드 발동(연속 4회 반려). 근본 원인 확정 + 접근 변경: 5회차 수정은 리뷰어 표현을 그대로 사용(M01 리뷰 로그에 기록). r5 시작. M03 수정 완료(모든 수치 재검증); r2 진행.
판정 처리: M02 r2 반려(지적사항 5건, 전부 수정 — 독립 보정한 105개 노드 이중 별칭 전수조사 포함, 리뷰어는 101로 봄); M03 r1 반려(지적사항 6건: TextBTN 타이포그래피 오버라이드 128건 = 메인 내비/필터 라벨 — 수정 에이전트 투입); M01 r3 반려.
M01 2회차: 반려(지적사항 7건) — 다만 모두 개정에서 추가된 §1.1 텍스트(예외 검사 정규식이 너무 관대했음; 대안 규약으로 고정된 프레임 25개 + Footer 고정 33건 오판). 나머지는 100% 감사 통과. 7건 모두 수정 + 누락된 Open-questions 섹션 추가.
M02 리뷰 1회차: 반려, 지적사항 9건 — 핵심: 134개 노드가 문자 단위 styleOverrideTable 세그먼트를 보유(세그먼트 139개, 비스케일링 Mode-1 고정 런 포함 6개 클래스); 임시 텍스트 노드 383개 전부 Mode-1 프리미티브에 바인딩(비반응형). 명세 재작성(신규 §2.5).
M01 리뷰 1회차: 반려, 지적사항 8건(실제 Tablet 산술 오류 800−40≠768, 누락된 explicitVariableModes 메커니즘 포함 — 컬렉션 5:79, 모드 ID 도출: 5:2=Mobile, 767:0=Tablet, 5:1=DesktopSmall, 565:0=DesktopLarge). 8건 모두 명세에 반영 완료.
완료: M01 명세 초안(변수 모드 5개 + 바인딩 전수조사 + 미내보내기 문자열 변수 2개 복구). M02 명세 초안(공유 스타일 6개 완전 해독: 미사용 BD-13-12 포함 텍스트 스타일 4개, 모드 해석 설정을 가진 그리드 스타일 2개, 임시 타이포그래피 전수조사 383개 노드).
완료: 기계적으로 도출한 정본 슬라이스(섹션 슬라이스 20개 + canonical/derive/slice.sh로 인덱스 4개). PLAN.md 작성(27개 모듈 레지스트리, 파이프라인 규칙). 다음: M01(디자인 토큰) 추출. 루프 정체 점검: 루프 없음, 일정대로 진행 중.
입력물 인벤토리 정리(.env, 변수 토큰 파일 5개). REST로 Figma 정본 데이터 확보(file.json 50MB, 이름 "Recto", 컴포넌트 176개, 세트 31개, 스타일 6개, 섹션 20개, 인터랙션 보유 노드 6036개). variables/local 엔드포인트는 403(토큰 권한 범위) → 내보낸 5개로 대체.