304 lines
9.3 KiB
JSON
304 lines
9.3 KiB
JSON
{
|
|
"components": [
|
|
{
|
|
"anti-examples": [
|
|
"multiple-primary-actions",
|
|
"icon-without-name"
|
|
],
|
|
"examples": [
|
|
"primary-task",
|
|
"secondary-task",
|
|
"destructive-confirmation"
|
|
],
|
|
"id": "button",
|
|
"recipe": "actions/button.yaml",
|
|
"state": "stable",
|
|
"surfaces": [
|
|
"public-web",
|
|
"product-app",
|
|
"interactive-learning",
|
|
"developer-platform"
|
|
],
|
|
"tokens": [
|
|
"color.accent",
|
|
"color.danger",
|
|
"radius.control",
|
|
"motion.fast"
|
|
]
|
|
},
|
|
{
|
|
"anti-examples": [
|
|
"placeholder-as-label",
|
|
"error-by-color-only"
|
|
],
|
|
"examples": [
|
|
"labeled-input",
|
|
"inline-validation"
|
|
],
|
|
"id": "field",
|
|
"recipe": "forms/field.yaml",
|
|
"state": "stable",
|
|
"surfaces": [
|
|
"public-web",
|
|
"product-app",
|
|
"interactive-learning",
|
|
"developer-platform"
|
|
],
|
|
"tokens": [
|
|
"color.text",
|
|
"color.text-muted",
|
|
"color.border",
|
|
"radius.control"
|
|
]
|
|
},
|
|
{
|
|
"anti-examples": [
|
|
"blank-screen",
|
|
"spinner-without-context"
|
|
],
|
|
"examples": [
|
|
"empty",
|
|
"loading",
|
|
"error",
|
|
"partial",
|
|
"completed"
|
|
],
|
|
"id": "status-panel",
|
|
"recipe": "feedback/status-panel.yaml",
|
|
"state": "candidate",
|
|
"surfaces": [
|
|
"product-app",
|
|
"interactive-learning",
|
|
"developer-platform"
|
|
],
|
|
"tokens": [
|
|
"color.surface",
|
|
"color.text",
|
|
"color.danger",
|
|
"radius.surface"
|
|
]
|
|
}
|
|
],
|
|
"current-release": "org-design-0.2.0",
|
|
"generated-by": ".claude/hooks/compile_design_system.py",
|
|
"page-archetypes": [
|
|
{
|
|
"id": "public-value-entry",
|
|
"patterns": [
|
|
"task-entry"
|
|
],
|
|
"purpose": "누구를 위한 무엇인지 설명하고 핵심 작업 또는 다음 정보로 진입시킨다.",
|
|
"required-states": [
|
|
"default",
|
|
"loading",
|
|
"error"
|
|
],
|
|
"state": "candidate",
|
|
"surfaces": [
|
|
"public-web"
|
|
]
|
|
},
|
|
{
|
|
"id": "operational-workspace",
|
|
"patterns": [
|
|
"task-entry",
|
|
"resilient-status"
|
|
],
|
|
"purpose": "상태를 이해하며 반복 작업을 완료하고 실패에서 회복한다.",
|
|
"required-states": [
|
|
"default",
|
|
"loading",
|
|
"empty",
|
|
"error",
|
|
"partial",
|
|
"completed"
|
|
],
|
|
"state": "candidate",
|
|
"surfaces": [
|
|
"product-app",
|
|
"developer-platform"
|
|
]
|
|
},
|
|
{
|
|
"id": "interactive-learning-atlas",
|
|
"patterns": [
|
|
"content-discovery",
|
|
"task-entry"
|
|
],
|
|
"purpose": "제품 약속·활성 Deep Dive·학습 방법·신뢰 경계·전체 Atlas 상태를 보여주고 학습 진입을 돕는다.",
|
|
"required-states": [
|
|
"default",
|
|
"loading",
|
|
"empty",
|
|
"error",
|
|
"partial",
|
|
"completed"
|
|
],
|
|
"state": "candidate",
|
|
"surfaces": [
|
|
"interactive-learning"
|
|
]
|
|
},
|
|
{
|
|
"id": "interactive-learning-deep-dive",
|
|
"patterns": [
|
|
"causal-learning-loop",
|
|
"learning-feedback-recovery",
|
|
"resilient-status"
|
|
],
|
|
"purpose": "하나의 공유 시나리오에서 예측·관찰·비교·설명·전이를 수행하고 다음 메커니즘으로 연결한다.",
|
|
"required-states": [
|
|
"default",
|
|
"loading",
|
|
"empty",
|
|
"error",
|
|
"partial",
|
|
"completed"
|
|
],
|
|
"state": "candidate",
|
|
"surfaces": [
|
|
"interactive-learning"
|
|
]
|
|
}
|
|
],
|
|
"patterns": [
|
|
{
|
|
"anti-examples": [
|
|
"cta-before-value",
|
|
"competing-primary-actions"
|
|
],
|
|
"avoid-when": "비교·탐색이 핵심인 다중 선택 화면이다.",
|
|
"components": [
|
|
"button",
|
|
"field"
|
|
],
|
|
"id": "task-entry",
|
|
"state": "stable",
|
|
"surfaces": [
|
|
"public-web",
|
|
"product-app"
|
|
],
|
|
"use-when": "사용자가 한 가지 핵심 작업을 시작한다."
|
|
},
|
|
{
|
|
"anti-examples": [
|
|
"generic-error-toast-only",
|
|
"indefinite-spinner"
|
|
],
|
|
"avoid-when": "즉시 완료되는 로컬 조작이다.",
|
|
"components": [
|
|
"status-panel",
|
|
"button"
|
|
],
|
|
"id": "resilient-status",
|
|
"state": "candidate",
|
|
"surfaces": [
|
|
"product-app",
|
|
"developer-platform"
|
|
],
|
|
"use-when": "비동기 또는 부분 성공 작업의 상태를 설명하고 회복 경로를 제공한다."
|
|
},
|
|
{
|
|
"anti-examples": [
|
|
"single-article-dead-end",
|
|
"topic-list-without-status",
|
|
"decorative-catalog"
|
|
],
|
|
"avoid-when": "단일 작업을 즉시 수행하는 운영 화면이다.",
|
|
"components": [
|
|
"button"
|
|
],
|
|
"id": "content-discovery",
|
|
"state": "candidate",
|
|
"surfaces": [
|
|
"interactive-learning"
|
|
],
|
|
"use-when": "사용자가 전체 학습 지도에서 현재·다음 메커니즘의 관계를 파악하고 진입한다."
|
|
},
|
|
{
|
|
"anti-examples": [
|
|
"stepper-with-unrelated-content",
|
|
"answer-before-prediction",
|
|
"progress-without-evidence"
|
|
],
|
|
"avoid-when": "읽기 전용 참고 문서이거나 단계 간 상태·증거 결속이 없다.",
|
|
"components": [
|
|
"button",
|
|
"status-panel"
|
|
],
|
|
"id": "causal-learning-loop",
|
|
"state": "candidate",
|
|
"surfaces": [
|
|
"interactive-learning"
|
|
],
|
|
"use-when": "Predict→Observe→Compare→Explain→Transfer의 동일 시나리오를 단계별 상태와 함께 진행한다."
|
|
},
|
|
{
|
|
"anti-examples": [
|
|
"wrong-answer-only",
|
|
"spoiler-first-hint",
|
|
"lost-return-state"
|
|
],
|
|
"avoid-when": "단순 성공 알림처럼 복구 행동이 필요 없는 순간이다.",
|
|
"components": [
|
|
"status-panel",
|
|
"button"
|
|
],
|
|
"id": "learning-feedback-recovery",
|
|
"state": "candidate",
|
|
"surfaces": [
|
|
"interactive-learning"
|
|
],
|
|
"use-when": "오답·부분 완료·힌트·복귀 상태에서 다음 학습 행동과 근거를 제시한다."
|
|
}
|
|
],
|
|
"principles": [
|
|
{
|
|
"anti-example": "색·그림자·타이포만 바꾼 채 흐름과 IA 결함을 숨긴다.",
|
|
"id": "task-before-decoration",
|
|
"rule": "핵심 작업과 정보 위계를 먼저 증명하고 장식은 그 이후에 추가한다.",
|
|
"title": "Task before decoration"
|
|
},
|
|
{
|
|
"anti-example": "modern, clean 같은 형용사만으로 시장 적합성을 주장한다.",
|
|
"id": "evidence-before-taste",
|
|
"rule": "표준 관행과 차별화는 named competitive evidence 및 실제 캡처에 연결한다.",
|
|
"title": "Evidence before taste"
|
|
},
|
|
{
|
|
"anti-example": "happy path 스크린샷 하나를 완성된 경험으로 간주한다.",
|
|
"id": "states-are-the-product",
|
|
"rule": "default/loading/empty/error/partial/completed 상태를 기본 화면과 동등하게 설계한다.",
|
|
"title": "States are the product"
|
|
},
|
|
{
|
|
"anti-example": "데스크톱 그리드를 단순 축소해 정보와 액션을 잘라낸다.",
|
|
"id": "responsive-priority",
|
|
"rule": "모바일은 축소판이 아니라 우선순위와 탐색 모델을 재표현한다.",
|
|
"title": "Responsive priority, not shrinkage"
|
|
},
|
|
{
|
|
"anti-example": "최종 검수에서 ARIA만 덧붙인다.",
|
|
"id": "accessible-by-construction",
|
|
"rule": "의미 구조·키보드·포커스·대비·동작 감소를 토큰과 recipe 단계에서 강제한다.",
|
|
"title": "Accessible by construction"
|
|
}
|
|
],
|
|
"source-sha256": {
|
|
"org-os/08-design/components/actions/button.yaml": "1c1f2ee50a36ac759303d958903409c6c82d79b749807b316c2dced18b5df73f",
|
|
"org-os/08-design/components/feedback/status-panel.yaml": "22dbd0bcf7f1dd2166563ce8691cf961ec0e1173bf3d0bb4cbb9cb9a19ec5064",
|
|
"org-os/08-design/components/forms/field.yaml": "e478891c6b999395d78e22f5ceda4acac22d1ff1450accc5be0a68fe35adc5c3",
|
|
"org-os/08-design/components/registry.yaml": "877700537510f7bdd5326338236d3055b84db4d18ccdee1d5367f860bf28c5bd",
|
|
"org-os/08-design/design-engine-adapters.yaml": "ee6a771488e7fe8342498aac96cb957ffc9c0736f9dab5617e5abd6669433542",
|
|
"org-os/08-design/page-archetypes/registry.yaml": "10faf739beb565455f55f69562e300ab17aeb6ab34ca07ac6100f3b992e53bee",
|
|
"org-os/08-design/patterns/registry.yaml": "cccc39f78e3c1bb370e201059b8d548e44255c04e246e46901cccdb741af2b40",
|
|
"org-os/08-design/principles.yaml": "cb00612da40377647cb886da3fa23097deabfa8776173626f1c363639bc0c97b",
|
|
"org-os/08-design/releases/0.1.0.yaml": "53bfaa503e4a1b34af0930c55393e70f982379317ba17dac9966b19b942df504",
|
|
"org-os/08-design/releases/0.2.0.yaml": "f569559cadadb57448f24650c11e8fc1b5431de602338d305a159702eb24e7c9",
|
|
"org-os/08-design/releases/index.yaml": "430a06a0f57c5d8ca938d82e8af26df172097a2d1d252b0fbc9dddf72b7385ad",
|
|
"org-os/08-design/taste-profile.yaml": "cea0ab83541c56911735239ec158ea48c140eddf898194d94d026a8a26759450",
|
|
"org-os/08-design/tokens.yaml": "11601f38cb0b2dba146129f8e1a9177c4376e77d7f93d96811bd9846592be38d"
|
|
},
|
|
"version": 1
|
|
}
|