release: v0.10.0

packages/skill/SKILL.md

@@ -15,6 +15,8 @@ description: "웹 디자인 전 과정을 끌고 가는 파이프라인 스킬.
 
 **쓰지 않는다**: 대시보드의 데이터 밀도 설계(→ 데이터 시각화 스킬) · 순수 백엔드 · 이미 확립된 디자인 시스템을 따라야만 하는 작업(그 시스템을 따르는 게 맞다) · "일단 돌아가게만" 요청
 
+관리자 화면을 함께 만들 때 designpaca가 맡는 것은 **브랜드 표면·정보 위계·상호작용 상태·진실성/규제 게이트**다. 지표 정의, 차트 해석, 대규모 표의 열 우선순위와 밀도 최적화는 데이터 시각화·도메인 스킬의 근거를 추가로 받아야 한다. `관리자 밀도 3` 다이얼은 이 경계를 없애는 허가가 아니다.
+
 ## 우선순위
 
 충돌하면 위가 이긴다. **이 스킬의 기본값은 맨 아래다.**
@@ -200,6 +202,8 @@ description: "웹 디자인 전 과정을 끌고 가는 파이프라인 스킬.
 
 R1과 R2를 같은 업종에서 고르면 결과는 그 업종의 평균이 된다. SaaS 구조 + SaaS 톤 = 또 하나의 SaaS 슬롭이다.
 
+**목표 시장이 다른 레퍼런스는 자동으로 중립이 되지 않는다.** 단위·용어·문의 방식·사진 조도·신뢰 표지는 문화권의 일부다. 시장 적합성이 중요한 브리프는 R1을 같은 목표 시장에서 우선 찾고, R2는 **같은 문화권의 다른 업종**을 우선한다. 다른 문화권의 R3는 구현 기법 하나만 가져온다. 상세 계약은 `reference-method.md`와, 가상·AI·규제 쇼케이스면 `trustworthy-showcases.md`를 따른다.
+
 - 어디서 찾는가 → `references/galleries.md` (브리프별 라우팅 표)
 - 어떻게 뜯어보는가 → `references/reference-method.md` (6축 해체 프레임워크, WebFetch 템플릿)
 
@@ -222,6 +226,7 @@ headed 브라우저가 있으면 스크린샷과 실측값을 바로 받는다
 - **한 문장 컨셉** — 이 사이트가 주는 인상을 한 문장으로. ("고급 잡지의 여백", "계기판처럼 정확한", "밤의 스튜디오")
 - **미학 프리셋** — 아래에서 고르거나, 브리프가 요구하면 새로 정의한다
 - **감수할 리스크 하나** — 정당화할 수 있는 과감한 선택 하나. 없으면 그 디자인은 안전하고 잊힌다
+- **표면 다이얼** — 랜딩·관리자·가맹처럼 과업이 다른 화면이 함께 있으면 각 표면의 표현성·정보 밀도·모션·증거 노출을 0~3으로 따로 적는다. 공통 토큰은 공유하되 과업 밀도까지 같게 만들지 않는다
 
 | 프리셋 | 한 줄 | 언제 |
 |---|---|---|
@@ -263,6 +268,7 @@ headed 브라우저가 있으면 스크린샷과 실측값을 바로 받는다
 자리를 만들기 전에 **무엇을 실을지** 정한다. 나중에 채우면 비율이 안 맞아 레이아웃을 다시 짠다.
 사용자가 준 사진이 있으면 무조건 그것이고, 없으면 **codex 가 설치돼 있는지 확인해 생성**한다.
 생성했으면 `design.md` 에 생성물이라고 적는다 — 나중에 실제 사진으로 바꿀 사람이 알아야 한다.
+히어로·증거 컷·모바일 히어로를 각각 슬롯으로 적은 **이미지 바이블**을 먼저 만든다. 데스크톱 크롭에서 핵심 피사체가 폴드 아래로 밀리면 모바일은 별도 원본을 만든다.
 싣기 전에 반드시 줄인다(실측: 10.1MB → 603KB).
 
 **4-1. 레이아웃과 타이포그래피** → `references/layout.md` (+ 폰트 적용은 `references/typography.md` §5, §6)
@@ -283,6 +289,9 @@ headed 브라우저가 있으면 스크린샷과 실측값을 바로 받는다
 - **키보드 단축키** — 콘솔의 손가락 문법. 숫자키 뷰 전환, `/` 검색 포커스. `kbd` 물리 키 칩으로 안내하고, 입력 요소에 포커스가 있을 때는 무력화한다
 - **본연의 도메인 동작** — 학적부는 기록, 시간표는 격자, 주문은 원장. 그 도메인이 종이에서 하던 핵심 동작 하나가 빠져 있으면 그게 곧 '데모 티'다
 
+**4-6. 진실 계약과 표면 분리** → `references/trustworthy-showcases.md` (가상 브랜드·예시 데이터·AI·규제 주제·고객/관리자 복수 경로일 때만)
+사실·예시·추론·미정을 구현 전에 나누고, 각 값의 출처를 사용자 진술·검증 출처·시스템 상태·합성 픽스처 중 하나로 추적한다. 오해가 생기는 주장·가격·행동 가까이에 라벨을 두되 같은 진실 범위는 가장 가까운 명확한 공통 부모가 한 번 소유한다. 보이는 입력과 판정 의존성은 같은 SSOT에서 만들고, 성공 행동이 다른 청중은 URL과 IA를 나눈다. AI는 출처가 붙은 입력·검증 사실·추론·불확실·수정·사람 검토를 함께 보여 주고, 진단·추천·예약·게시·내보내기처럼 위험한 규제 행동은 행동별 검증이 없으면 실패 폐쇄형으로 막는다.
+
 **실험 경로** → `references/experimental-canvas.md`
 HTML-in-Canvas(`drawElementImage`)는 **폴백을 완성한 뒤에만** 얹는다. 기본값은 쓰지 않는 것이다.
 
@@ -304,8 +313,9 @@ HTML-in-Canvas(`drawElementImage`)는 **폴백을 완성한 뒤에만** 얹는
 3. **이펙트 전부 끄기** — CSS 필터·WebGL·애니메이션을 끈 상태에서 페이지가 여전히 읽히는가
 4. **게이트 실행(폐쇄 루프)** — `tools/design-gate.mjs --init` 으로 설정을 만들고 돌린다. 오버플로·h1·수축·대비·SEO/meta·죽은 선택자·토큰 위생·스케일×폭까지 전 뷰 × 전 폭. L1(단위)·L5(탐색)·L6(시나리오 E2E)는 프로젝트 `tools/` 에 보강해 `npm run verify` 체인으로. **게이트 통과 없이 완료 선언 금지.**
 5. **상태 완결성 스윕** — 입력·파괴·열림이 있는 화면은 실제로 조작해 본다: 수치 입력에 범위 밖 값을 넣고, 파괴적 행동을 되돌려보고, 열린 메뉴를 Esc 로 닫는다. 기준은 `references/preflight.md` §4-1. 통과 못 하면 4단계로
+6. **상태별 시각 E2E** — URL별 390·1440 기본 화면과 결과·오류·모달 같은 핵심 상태를 캡처한다. 하니스는 개수·규격·0바이트·중복 해시를 단언하고, 캡처를 실제로 열어 목표 시장 적합성·시선 위계·이미지 크롭·반복을 눈으로 판정한다. 구조 PASS를 시각 PASS로 바꾸어 말하지 않는다
 
-> 게이트가 잡은 실제 사고 목록과 6계층 설계 근거는 `references/audit-gate.md` 다. 자기 검사 스크립트를 매번 새로 쓰지 마라 — 이 게이트를 심고 확장해라.
+> 게이트가 잡은 실제 사고 목록과 7계층 설계 근거는 `references/audit-gate.md` 다. 자기 검사 스크립트를 매번 새로 쓰지 마라 — 이 게이트를 심고 확장해라.
 
 #### 하드 게이트 — 전부 "아니오"여야 한다
 
@@ -376,6 +386,7 @@ HTML-in-Canvas(`drawElementImage`)는 **폴백을 완성한 뒤에만** 얹는
 | `references/tokens.md` | 3단계 — 토큰을 정할 때 |
 | `references/typography.md` | 3단계 — 폰트를 고를 때 / 4-1 — 적용할 때 |
 | `references/images.md` | **4-0 — 사진을 구하고 최적화할 때** |
+| `references/trustworthy-showcases.md` | **1·2·4·5단계 — 가상 브랜드·예시 데이터·AI·규제 주제·고객/관리자 복수 경로** |
 | `references/layout.md` | 4-1 — 그리드와 타이포 |
 | `references/svg-filters.md` | 4-2 — 재질을 만들 때 |
 | `references/three.md` | 4-3 — 입체가 필요할 때 |
@@ -385,7 +396,7 @@ HTML-in-Canvas(`drawElementImage`)는 **폴백을 완성한 뒤에만** 얹는
 | `references/preflight.md` | 5단계 — 감사 |
 | `references/antipatterns.md` | 3·5단계 — 한글 조판 / 슬롭 검출 |
 | `references/audit-gate.md` | **5단계 — 게이트(폐쇄 루프) 설계·설치·하니스 규칙** |
-| `tools/design-gate.mjs` | **5단계 — 범용 게이트 실행기(SEO/meta·대비·수축·시각·WebKit 옵션)** |
+| `tools/design-gate.mjs` | **5단계 — 범용 게이트 실행기(SEO/meta·대비·수축·페이지별 h1 최대 줄 계약·시각·WebKit 옵션)** |
 
 ## 작업 중 지켜야 할 것