feat(skill): route fixes, delivery report, composition diversity, platform refresh
- route table: extension route for products with an existing visual language, feedback row, derived state tokens stay local - completion: blocking 0 plus reported unverified; hard-gate surface is the touched scope; delivery report starts with what and how to open - design.md created at step 0 with a skeleton, fingerprint line and change log; product-surface rubric reading; direction delegation states the chosen card and reason - layout: hero families, nav forms, footer forms; art-direction page convergence 6 axes; genre sections; image treatments; placeholder conventions; multi-screen order; Tailwind theme mapping - platform: scroll-driven examples, anchor positioning, canvas OT, three/R3F pins, shadcn style prefixes, Safari 26 notes, subgrid - design-gate: four result states, exit codes, cwd module resolution, --url/--out-dir/--strict, oklch contrast, dead selector word match - Korean font budget split from the Latin baseline
This commit is contained in:
parent
9bcb45cbd3
commit
88c11682b1
51 changed files with 5834 additions and 2259 deletions
|
|
@ -1,5 +1,18 @@
|
|||
# evidence ledger — 판단의 출처와 한계
|
||||
|
||||
**이 문서는 원장이다. 처음부터 끝까지 읽지 않는다.** 필요한 때 필요한 행만 찾아 읽는다.
|
||||
|
||||
## 이 문서를 읽는 법
|
||||
|
||||
| 이 문서를 여는 때 | 하는 일 |
|
||||
|---|---|
|
||||
| 다른 문서에 붙은 출처 ID(예: `[WCAG-TARGET]`)의 범위·한계를 확인해야 한다 | 그 ID를 검색해 해당 행만 읽는다 |
|
||||
| 결정에 근거를 붙여 `design.md`에 기록한다 | 아래 "기록 형식" 한 줄을 쓰고, 인용할 ID의 행만 읽는다 |
|
||||
| 어떤 원칙이 보편 규범인지 특정 사례인지 판단이 필요하다 | "종류" 열의 뜻(바로 아래 문단)과 해당 행만 읽는다 |
|
||||
| 새 출처를 추가한다 | 표 형식을 따라 행을 더한다 |
|
||||
|
||||
**기록 형식.** 결정마다 `출처 ID / 지지 주장 / 적용 조건 / 잘못된 일반화 / 구체 검증 / 예시 결정`을 남긴다. 예시는 아래 "사용할 때" 절에 있다. 근거는 이 브리프의 결정에 실제로 쓰인 것만 적는다. 인명·사조 이름만 붙인 근거는 기록이 아니다([art-direction.md](art-direction.md) §3-1).
|
||||
|
||||
조사일: 2026-09-12. 이 목록은 읽을거리 순위가 아니라, 디자인 결정에 쓸 수 있는 근거의 범위다. `normative`는 적합성 조건, `research`는 특정 인간-컴퓨터 상호작용의 경향, `practice`는 설계 절차, `case`는 한 사례 또는 심사 체계, `forecast`는 전망, `bibliography`는 서지 확인만 뜻한다. 사례·전망·서지는 효과나 인과를 증명하지 않는다.
|
||||
|
||||
| ID | 출처·날짜 | 종류 | 실제로 지지하는 주장 | 적용 조건 / 잘못된 일반화 | 구체 검증 |
|
||||
|
|
@ -46,7 +59,7 @@
|
|||
|
||||
## 외부 스킬 출처 (2026-09-24 흡수)
|
||||
|
||||
조사일: 2026-09-24. 아래는 `docs/design-skills-intake-plan-20260924.md`로 흡수한 외부 디자인 스킬 10종과 better-interface 자매 스킬 7종의 출처 ID다. 저장소·커밋·라이선스 전문은 [THIRD_PARTY_NOTICES.md](../THIRD_PARTY_NOTICES.md)에 있다. 이 스킬들의 종류는 모두 `practice`(실무자가 정리한 설계 절차)이며, "실제로 지지하는 주장"은 그 스킬이 실제로 제공하는 실무 지침·수치 시작값으로 좁혀 쓴다. 공통된 잘못된 일반화는 스킬 저자 개인·소속 팀의 관찰이나 수치를 웹 디자인 전반의 보편 규범으로 확대하는 것이다.
|
||||
조사일: 2026-09-24. 아래는 흡수 계획(저장소 전용, 설치본 미포함)에 따라 흡수한 외부 디자인 스킬 10종과 better-interface 자매 스킬 7종의 출처 ID다. 저장소·커밋·라이선스 전문은 [THIRD_PARTY_NOTICES.md](../THIRD_PARTY_NOTICES.md)에 있다. 이 스킬들의 종류는 모두 `practice`(실무자가 정리한 설계 절차)이며, "실제로 지지하는 주장"은 그 스킬이 실제로 제공하는 실무 지침·수치 시작값으로 좁혀 쓴다. 공통된 잘못된 일반화는 스킬 저자 개인·소속 팀의 관찰이나 수치를 웹 디자인 전반의 보편 규범으로 확대하는 것이다.
|
||||
|
||||
| ID | 출처·날짜 | 종류 | 실제로 지지하는 주장 | 적용 조건 / 잘못된 일반화 | 구체 검증 |
|
||||
|---|---|---|---|---|---|
|
||||
|
|
@ -54,7 +67,7 @@
|
|||
| SKILL-APPLE-DESIGN | [emilkowalski/skills — skills/apple-design](https://github.com/emilkowalski/skills/tree/85e8e23/skills/apple-design) · 커밋 `85e8e23` · MIT | practice | Apple 플랫폼의 인터럽트 가능한 제스처·스프링·모멘텀·러버밴드 구현을 정리한 수치 시작값과 구현 패턴이다(damping/response, 속도 인계, 모멘텀 투사 계수, 러버밴드 계수 등) | 저자가 제시한 계수를 물리 법칙이나 플랫폼 표준으로 취급하지 않는다. Apple풍 미학을 모든 브리프의 기본값으로 삼지 않는다(조건부 항목). 원 스킬이 수치에 1차 출처(WWDC 영상·타임스탬프)를 달지 않았다 — 3rd-party 재해석으로 취급하고 옮길 때 그 사실을 밝힌다 | 실제 구현에서 계수를 실측 조정하고, Apple풍이 브리프에 맞는 조건일 때만 적용한다 |
|
||||
| SKILL-EMIL-DESIGN-ENG | [emilkowalski/skills — skills/emil-design-eng](https://github.com/emilkowalski/skills/tree/85e8e23/skills/emil-design-eng) · 커밋 `85e8e23` · MIT | practice | 모션 구현 실무 지침(사용 빈도별 애니메이션 여부, 트랜지션과 키프레임의 차이, clip-path·드래그·툴팁 구현 레시피, 모션 QA 절차)이다 | "ease-in 절대 금지" 같은 단정을 그대로 규범화하지 않는다. velocity 0.11 같은 매직넘버는 저자의 실측값이지 보편 상수가 아니다 | 레시피를 실제 컴포넌트에 적용해 프레임 단위로 재생해 보고, duration·easing은 프로젝트 토큰(`--dur-*`, `--ease-*`)에 맞춰 재조정한다 |
|
||||
| SKILL-BEAUTIFUL-SHADOWS | [MengTo/Skills — agent-skills/web-design/beautiful-shadows](https://github.com/MengTo/Skills/tree/a965851/agent-skills/web-design/beautiful-shadows) · 커밋 `a965851` · MIT | practice | 3단(sm/md/lg) 다층 box-shadow 값과 컴포넌트 밀도별 단계 매핑을 제시하는 시작값 세트다 | 레이어 수가 늘수록 값이 커지고 진해지는 이유를 저자도 밝히지 않으므로 그 근거를 인용하지 않는다. Tailwind 임의값 문법은 그대로 쓰지 않고 CSS로 옮겨 쓴다 | 실제 배경·밀도에서 렌더해 과도한 틴팅·중첩을 확인한다 |
|
||||
| SKILL-WEB-A11Y | [addyosmani/web-quality-skills — skills/accessibility](https://github.com/addyosmani/web-quality-skills/tree/afa8da9/skills/accessibility) · 커밋 `afa8da9` · MIT | practice | Lighthouse·axe 자동 검사 → 실패 노드 국소화 → 수동 검증 → 재감사로 이어지는 증거 우선 접근성 감사 루프와 "자동 점수 100은 준수를 뜻하지 않는다"는 절차 지침이다 | 이 검사 순서를 WCAG 적합성 판정 자체로 착각하지 않는다. 자동화 도구가 잡아내는 범위는 WCAG 성공 기준의 일부일 뿐이다 | DevTools MCP나 axe-core가 있으면 실행하고, 없으면 미검증으로 보고하며 통과로 추정하지 않는다 |
|
||||
| SKILL-WEB-A11Y | [addyosmani/web-quality-skills — skills/accessibility](https://github.com/addyosmani/web-quality-skills/tree/afa8da9/skills/accessibility) · 커밋 `afa8da9` · MIT | practice | Lighthouse·axe 자동 검사 → 실패 노드 국소화 → 수동 검증 → 재감사로 이어지는 증거 우선 접근성 감사 루프와 "자동 점수 100은 준수를 뜻하지 않는다"는 절차 지침이다 | 이 검사 순서를 WCAG 적합성 판정 자체로 착각하지 않는다. 자동화 도구가 잡아내는 범위는 WCAG 성공 기준의 일부일 뿐이다 | 브라우저 자동화 도구의 Lighthouse 감사나 axe-core가 있으면 실행하고, 없으면 미검증으로 보고하며 통과로 추정하지 않는다 |
|
||||
| SKILL-DESIGN-REVIEW | [Superfuture/design-review — design-review/skills/design-review](https://github.com/Superfuture/design-review/tree/d4d2609/design-review/skills/design-review) · 커밋 `d4d2609` · MIT(plugin.json 선언, 저장소에 LICENSE 파일 없음 — THIRD_PARTY_NOTICES.md 참고) | practice | 디자인 리뷰 finding을 What·Why·Fix 3요소와 심각도로 구조화하고, 입력 종류별 진입·자동 적용 화이트리스트를 정리한 리뷰 절차다 | 서체 개수 상한·타입 스케일 단계 수 같은 저자의 규범적 수치는 취향 규칙이지 하드 게이트가 아니다. 텔레메트리·유료 게이팅 요소는 흡수하지 않는다 | finding마다 What·Why·Fix가 모두 채워졌는지, 심각도가 판정 위계와 일치하는지 확인한다 |
|
||||
| SKILL-SHADCN | [shadcn-ui/ui — skills/shadcn](https://github.com/shadcn-ui/ui/tree/98a1fe6/skills/shadcn) · 커밋 `98a1fe6` · MIT | practice | 기존 컴포넌트 우선·합성 규칙(Dialog Title 필수 등)과 "추측하지 말고 사용자 대신 기본값을 고르지 말라"는 안전 병합 절차다 | CLI 플래그·레지스트리 스키마·Tailwind 매핑 치트시트는 designpaca가 프레임워크를 전제하지 않는다는 원칙과 충돌해 흡수하지 않는다. shadcn 같은 컴포넌트 기반은 브랜드 디자인 시스템 자체가 아니다 | components.json 존재로 감지 여부를 판정하고, 감지했을 때만 component-systems.md 절을 연다 |
|
||||
| SKILL-IMPECCABLE | [pbakaus/impeccable — skill/reference/adapt.md](https://github.com/pbakaus/impeccable/tree/e0881d2/skill/reference/adapt.md), [skill/reference/adapt.native.md](https://github.com/pbakaus/impeccable/tree/e0881d2/skill/reference/adapt.native.md)(iOS↔Android 관용구 대응표) · 커밋 `e0881d2` · Apache-2.0 | practice | 입력 방식을 화면 크기와 별개 축으로 다루는 pointer·hover 쿼리, 컨테이너 쿼리, 커스텀 컨트롤 제스처 검증(레이아웃 통과 ≠ 제스처 통과)에 대한 구현 코드와 절차, 그리고 iOS↔Android 플랫폼 관용구 대응표다 | 모바일 하단 내비 기본값 같은 저자의 결론은 기각한다(designpaca 결정표가 더 엄밀하다). 빌드 시점 하네스별 본문 컴파일 방식은 흡수하지 않는다 | 실제 포인터·터치 입력에서 코드를 재현하고, 제스처 검증은 레이아웃 검사와 분리해 수행한다 |
|
||||
|
|
@ -93,8 +106,8 @@
|
|||
| KO-KRDS | [KRDS 컴포넌트 — 버튼 · 행정안전부](https://www.krds.go.kr/html/site/component/component_05_02.html) · 확인 2026-09-24 | practice | 행정안전부 KRDS(Korea Design System) 공식 가이드는 버튼 텍스트 라벨을 원칙적으로 동사형으로 제공하도록 규정하며, "완료·닫기·취소·추가·삭제"처럼 일반적으로 통용되는 경우는 예외로 둔다 | 정부 서비스 가이드를 모든 상업 제품의 카피 규범으로 강제하지 않는다. 이 스킬에서는 버튼 카피의 참고 관례로만 쓴다 | 실제 버튼 라벨이 동사형인지, 예외에 해당하는 일반 동작인지 확인한다 |
|
||||
| KO-TOSS-WRITING | [토스가 글을 쓰는 방법 — toss.tech](https://toss.tech/article/8-writing-principles-of-toss) · 확인 2026-09-24 | practice | 토스 기술 블로그가 공개한 글쓰기 코어밸류 5가지(Clear·Concise·Casual·Respect·Emotional)와 실행 원칙 8가지(예측 가능한 힌트, 군더더기 제거, 핵심 메시지 집중 등)다 | 한 기업의 브랜드 보이스를 모든 한국어 제품의 보편 톤으로 확대하지 않는다. 톤 슬롯이 다른 브리프(공공·금융 격식체 등)에는 그대로 적용하지 않는다 | 실제 카피가 원칙과 충돌하는지(불필요한 격식체, 숨은 감정 무시 등)를 문장 단위로 대조한다 |
|
||||
| WEB-BASELINE | [webstatus.dev](https://webstatus.dev/) · [MDN Baseline](https://developer.mozilla.org/en-US/docs/Glossary/Baseline/Compatibility) · 확인 2026-09-24 | practice | 특정 CSS·JS 기능이 Limited/Newly available/Widely available 중 어느 지원 상태인지, 각 브라우저가 언제 지원을 시작했는지를 추적한다. Widely available은 Newly available(전 주요 엔진 지원 완료) 시점으로부터 약 30개월이 지나야 붙는다 | 한 번 확인한 지원 상태를 날짜 없이 영구 사실처럼 인용하지 않는다. webstatus.dev와 MDN이 다른 값을 보일 때(예: text-box-trim)는 더 최신 확인일 쪽에 주의 문구를 남긴다 | 기능을 채택하기 전 webstatus.dev나 MDN의 현재 상태와 확인일을 다시 조회한다 |
|
||||
| PLATFORM-HIG-TARGET | Apple Human Interface Guidelines, Layout(터치 타깃 지침) · developer.apple.com/design/human-interface-guidelines/layout · **URL 미확인** — 2026-09-24 WebFetch로 재확인을 시도했으나 페이지가 클라이언트 사이드 렌더링(SPA)이라 본문을 가져오지 못했고, 이 세션의 WebSearch 예산이 소진돼 대체 인용을 확보하지 못했다 | bibliography | Apple HIG가 iOS 컨트롤의 최소 히트 영역을 44×44pt로 권장한다는 것은 업계에 널리 알려진 수치이지만, 이 세션에서는 1차 문서 원문 문구를 직접 확인하지 못했다 | 브리프가 모바일 앱 수준을 요구할 때만 적용하는 **프로젝트 계약**이며, WCAG AA의 보편 요건(24×24 CSS px, [WCAG-TARGET])으로 확대하지 않는다 | 다음 세션에서 Apple Developer 사이트를 JS 렌더링 가능한 브라우저 도구로 재조회해 정확한 문구·URL을 확정한다 |
|
||||
| PLATFORM-M3-TARGET | Material 3, Accessible design 또는 Layout 섹션 · m3.material.io · **URL 미확인** — 2026-09-24 WebFetch로 재확인을 시도했으나 페이지가 클라이언트 사이드 렌더링(SPA)이라 본문을 가져오지 못했고, 이 세션의 WebSearch 예산이 소진돼 대체 인용을 확보하지 못했다 | bibliography | Material 3가 터치 타깃 최소 크기를 48×48dp로 권장한다는 것은 업계에 널리 알려진 수치이지만, 이 세션에서는 1차 문서 원문 문구를 직접 확인하지 못했다 | 브리프가 모바일 앱 수준을 요구할 때만 적용하는 **프로젝트 계약**이며, WCAG AA의 보편 요건(24×24 CSS px, [WCAG-TARGET])으로 확대하지 않는다 | 다음 세션에서 m3.material.io를 JS 렌더링 가능한 브라우저 도구로 재조회해 정확한 문구·URL을 확정한다 |
|
||||
| PLATFORM-HIG-TARGET | Apple Human Interface Guidelines, Layout(터치 타깃 지침) · developer.apple.com/design/human-interface-guidelines/layout · **URL 미확인** — 2026-09-24 텍스트 페치 도구로 재확인을 시도했으나 페이지가 클라이언트 사이드 렌더링(SPA)이라 본문을 가져오지 못했고, 그 세션의 웹 검색 예산이 소진돼 대체 인용을 확보하지 못했다 | bibliography | Apple HIG가 iOS 컨트롤의 최소 히트 영역을 44×44pt로 권장한다는 것은 업계에 널리 알려진 수치이지만, 이 세션에서는 1차 문서 원문 문구를 직접 확인하지 못했다 | 브리프가 모바일 앱 수준을 요구할 때만 적용하는 **프로젝트 계약**이며, WCAG AA의 보편 요건(24×24 CSS px, [WCAG-TARGET])으로 확대하지 않는다 | 다음 세션에서 Apple Developer 사이트를 JS 렌더링 가능한 브라우저 도구로 재조회해 정확한 문구·URL을 확정한다 |
|
||||
| PLATFORM-M3-TARGET | Material 3, Accessible design 또는 Layout 섹션 · m3.material.io · **URL 미확인** — 2026-09-24 텍스트 페치 도구로 재확인을 시도했으나 페이지가 클라이언트 사이드 렌더링(SPA)이라 본문을 가져오지 못했고, 그 세션의 웹 검색 예산이 소진돼 대체 인용을 확보하지 못했다 | bibliography | Material 3가 터치 타깃 최소 크기를 48×48dp로 권장한다는 것은 업계에 널리 알려진 수치이지만, 이 세션에서는 1차 문서 원문 문구를 직접 확인하지 못했다 | 브리프가 모바일 앱 수준을 요구할 때만 적용하는 **프로젝트 계약**이며, WCAG AA의 보편 요건(24×24 CSS px, [WCAG-TARGET])으로 확대하지 않는다 | 다음 세션에서 m3.material.io를 JS 렌더링 가능한 브라우저 도구로 재조회해 정확한 문구·URL을 확정한다 |
|
||||
|
||||
## 사용할 때
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue