@3xhaust/oh-my-design 0.16.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 3x-haust
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.ko.md

@@ -0,0 +1,282 @@
+# Oh My Design
+
+비주얼 스타일이 아니라, 코딩 에이전트를 위한 디자인 프로세스입니다. OMD는 모델이 모든 결정을 근거로 얻어내게 만듭니다. 브리프를 캐묻고, 근거를 모으고, 실제 카피를 쓰고, 타이포그래피를 증명하고, 의도적으로 구성하고, 한 번 구현하고, 렌더를 살핀 뒤 다시 정의합니다.
+
+[English](README.md)
+
+## OMD로 만든 결과 — 원샷 프롬프트
+
+[![OMD가 생성한 랜딩 페이지](docs/omd-landing.png)](https://3x-haust.github.io/oh-my-design/)
+
+위 랜딩 페이지는 OMD가 단일 원샷 프롬프트로 직접 생성한 결과물입니다 — 시각 출력은 손으로 다듬지 않았습니다. **[3x-haust.github.io/oh-my-design](https://3x-haust.github.io/oh-my-design/)** 에 배포되어 있으며, 소스는 [`example/`](example/) 에 있습니다.
+
+## OMD란
+
+여기서 ‘사람처럼 디자인한다’는 것은 특정한 결과 스타일이 아니라 근거를 남기는 판단을 뜻합니다. 목표는 반복 가능한 프로세스이며, 결과는 차분할 수도 과감할 수도 익숙하거나 낯설 수도 있습니다. 일관되는 것은 결과의 생김새가 아니라 그 뒤에 남은 결정의 흐름입니다.
+
+Oh My Design(OMD)은 코딩 에이전트가 요청을 받자마자 완성 화면으로 뛰어드는 흐름을 막습니다. 어떤 문제를 푸는지 먼저 묻고, 근거를 기록하고, 글과 레이아웃을 분리하고, 익명 구조를 비교하고, 구현자의 의도를 모르는 리뷰어가 실제 렌더를 비평합니다.
+
+전체 흐름은 다음과 같습니다.
+
+```text
+brief → evidence → copy → typography proof → composition contract → isolated structure → one production build
+      → rendered critique and interaction evidence → reframe
+```
+
+OMD는 **Codex**와 **Claude Code** 안에서 동작합니다. 여섯 개의 사용자용 스킬, 아홉 개의 내부 파이프라인 에이전트, 로컬 `omd` CLI, 디자인 이론·레시피 팩, 그리고 `.omd/` 아래의 내구 프로젝트 기록을 제공합니다.
+
+## 요구 사항
+
+- **Node.js 22.18 이상** (CLI가 TypeScript 진입점을 직접 실행합니다)
+- **Claude Code, Codex, 또는 둘 다** — 호스트 설정 디렉터리가 이미 존재해야 합니다
+- 렌더·프로브·타이포그래피 증명을 위한 **Playwright Chromium** (아래에서 별도 설치)
+
+## 설치
+
+> **npm에 없습니다.** npmjs.com의 `oh-my-design` 이름은 무관한 다른 프로젝트(`O-Pencil/skills`)의 것입니다. `npm install -g oh-my-design` 을 실행하지 말고, 이 저장소에서 설치하세요.
+
+### Claude Code — 플러그인 마켓플레이스
+
+```text
+/plugin marketplace add 3x-haust/oh-my-design
+/plugin install oh-my-design@omd
+```
+
+이후 세션을 열고 `/ultradesign` 을 실행합니다.
+
+### 소스에서 설치 — Claude Code와 Codex (회귀 테스트 대상 경로)
+
+```bash
+git clone https://github.com/3x-haust/oh-my-design
+cd oh-my-design
+npm install
+
+node bin/omd-install.ts install    # 감지된 모든 호스트에 스킬+에이전트를 복사하고 설정을 패치
+node bin/omd-install.ts doctor      # 호스트 설치 검증
+node bin/omd.ts doctor              # 런타임, Chromium, 프로젝트 쓰기 권한, 이론 팩 검증
+```
+
+짧은 `omd`·`oh-my-design` 명령을 PATH에 올리고 싶으면 `npm link` 를 실행합니다. 그렇지 않으면 `node bin/omd.ts …`, `node bin/omd-install.ts …` 로 호출합니다.
+
+`--host claude` 또는 `--host codex` 로 명령을 한 호스트로 한정할 수 있습니다.
+
+```bash
+node bin/omd-install.ts install --host codex
+node bin/omd-install.ts doctor --host codex
+node bin/omd-install.ts uninstall --host codex
+```
+
+`uninstall` 은 `install` 이 한 일을 정확히 되돌리며, `.omd/` 디렉터리는 절대 건드리지 않습니다.
+
+### Chromium
+
+설치 프로그램은 Chromium을 설치하지 않습니다. `omd doctor` 가 Playwright 부재나 Chromium 실행 파일 누락을 보고하면, 보고된 항목을 설치한 뒤 다시 확인합니다.
+
+```bash
+npm install -g playwright
+npx playwright install chromium
+node bin/omd.ts doctor
+```
+
+## 휴먼 디자인 루프
+
+`omd-ultradesign` 이 다음 순서를 조율합니다.
+
+1. **프리플라이트** — 프로젝트 디렉터리를 고정하고, `omd doctor` 를 실행하고, 저장소를 점검하고, Figma 브리프는 `omd-figma` 로 라우팅합니다.
+2. **프레임** — 브리프를 캐물어 문제, 리프레임 가설, 주요 과업, 잦은 동작, 가장 비싼 오류를 근거와 함께 기록합니다.
+3. **컨셉** — 생성자, 시각 레지스터, 타이포그래피 방향, 의도한 기억에 남을 순간을 정합니다.
+4. **리서치** — 도메인, 경쟁자, 사용자 언어, 컴포넌트, 타이포그래피, 관련 모션에 걸쳐 측정된 레퍼런스를 모읍니다.
+5. **카피 작성** — 전담 writer가 레이아웃 전에 사실 추적 가능한 카피 덱을 만듭니다.
+6. **블라인드 카피 리뷰** — 새 리뷰어는 브리프·카피·사실 원장·보이스 근거만 보고, 렌더·코드·레이아웃·근거·작성자는 보지 못합니다.
+7. **블라인드 타이포그래피 증명** — typesetter가 실제 카피 시편을 1280×900, 390×844에서 레이아웃 중립으로 렌더하고, 새 eye가 페이지 구조나 근거 없이 검토한 뒤 typesetter가 수정·재렌더합니다.
+8. **의도적 구성** — 새 composer가 경험의 축, 하나의 지배적 초점, 매스·리듬, 합당한 메커니즘 캐리어 또는 명시적 대안, 반응형 재구성, 후보 축을 정의합니다. `omd composition --check` 가 입력 신선도를 검증합니다.
+9. **구조적 발산** — 격리된 에이전트들이 동일한 컴포지션 계약을 받아 각 후보에 대해 고정 데스크톱/모바일과 보조 전체 페이지 연속성 증거를 렌더합니다.
+10. **블라인드 선택** — 새 selector가 고정된 여덟 개 0–4 차원을 채점하고, 계약 위반이나 2 미만인 차원을 거부하며, 폴드 위의 폼을 CTA 도달과 동일시하지 않습니다.
+11. **한 번 구현** — 선택된 하나의 구조가 프로덕션 구현이 됩니다. builder는 또 다른 후보 집합을 만들지 않습니다.
+12. **구현 중 성찰** — builder가 시맨틱 체크포인트를 기록하고, 선택된 데스크톱/모바일 컨테이너에서 타입을 다시 증명한 뒤, 선택적 모션 전에 비주얼 체크포인트를 기록합니다.
+13. **결과 확인** — 데스크톱·모바일 렌더, 스퀸트 뷰, 해당되는 필름스트립, 결정적 검사, 선언된 로컬 프로브가 리뷰 근거를 제공합니다.
+14. **소스 후보 분류** — 프로덕션 소스가 생긴 뒤 읽기 전용 스캔이 좁은 후보를 제안합니다. 코디네이터가 렌더 맥락으로 각각을 해소하며, 후보의 존재만으로는 실패가 아닙니다.
+15. **비평·수리·리프레임** — 스퀸트 전용 glance가 위계를 먼저 보고하고, 별도의 날카로운 리뷰어가 크래프트와 정제된 후보를 판단한 뒤, 수리 결과를 렌더·검사·재스캔합니다.
+16. **출하** — 프로젝트 테스트, 빌드 검사, 해당 디자인 게이트, 미해소 항목을 각각의 근거와 함께 보고합니다.
+
+Figma 파일과 명시적 시각 타깃은 이미 구조적 결정을 제공하므로, 해당 경로에서는 구조적 발산을 건너뛸 수 있지만 그 이유를 기록합니다.
+
+## 스킬
+
+여섯 개의 사용자용 스킬입니다. 정본 이름은 `omd-` 접두사를 쓰며, Codex는 `(omd) <스킬>` 로 표시하고, Claude 마켓플레이스 플레이버는 `oh-my-design:<스킬>` 로 참조합니다.
+
+| 스킬 | 용도 |
+| --- | --- |
+| `omd-ultradesign` | 페이지, 앱, 대시보드, 블로그, 랜딩 페이지, 리디자인을 위한 전체 휴먼 디자인 루프를 실행합니다. |
+| `omd-figma` | Figma 파일을 가져와 시스템을 합성하고, 프레임을 구현하고, 반응형 쌍을 비교하고, 측정된 충실도를 보고합니다. |
+| `omd-scout` | 디자인·구현 없이 독립적인 측정 레퍼런스 보드를 만듭니다. 할당량을 채우는 대신 결정적 커버리지 공백을 메우고 불확실성을 보고합니다. |
+| `omd-critique` | 기존 디자인을 바꾸지 않고 검토합니다. 결정적 발견을 근본 원인별로 묶고 렌더된 크래프트를 판단합니다. |
+| `omd-humanize` | 사실을 보존하면서 건전한 담화를 국소적으로 수리하거나, 검증된 사실·보이스·표면 동작으로부터 뒤틀린 메시지를 재구성합니다. |
+| `omd-coach` | 누적된 검사 이력을 읽고 반복되는 문제와 추세를 찾아 다음에 연습할 것을 제안합니다. taste 기록은 읽지 않습니다. |
+
+## 내부 파이프라인 에이전트
+
+아홉 개의 에이전트는 루프의 구현 세부이며 공개 명령이 아닙니다. 구체적 모델을 고정하지 않고, 각자 세션에 선택된 모델을 상속합니다.
+
+| 에이전트 | 책임 | 쓰기 경계 |
+| --- | --- | --- |
+| `omd-framer` | 브리프를 캐묻고 근거 기반 프레임을 기록합니다. | 읽기 전용. frame CLI로 기록. |
+| `omd-scout` | 파이프라인 커버리지를 위한 측정 근거를 리서치합니다. | 읽기 전용. reference CLI로 기록. |
+| `omd-writer` | 카피 덱과 사실 원장을 쓰거나 수리합니다. | `.omd/copy-deck.md` 만. |
+| `omd-typesetter` | 구조 이전의 실제 카피 타이포그래피 증명을 만들고 수정합니다. | `.omd/type-proof.md` 와 `.omd/.cache/type-proof/`. |
+| `omd-composer` | 정제된 근거를 발산 전 신선한 컴포지션 계약으로 변환합니다. | `.omd/composition.md` 만. |
+| `omd-sketch` | 실제 카피가 담긴 격리된 그레이스케일 구조 후보 하나를 만듭니다. | 자신의 캐시 후보 디렉터리만. |
+| `omd-hand` | 선택된 구조를 구현하고 두 개의 크래프트 체크포인트를 기록합니다. | 프로덕션 저장소와 선언된 OMD 기록. |
+| `omd-glance` | 스퀸트 렌더만으로 위계를 보고합니다. | 쓰기 없음. |
+| `omd-eye` | 익명 구조를 선택하거나, 카피·타이포 증명을 블라인드로 검토하거나, 날카로운 렌더를 비평합니다. | 쓰기 없음. |
+
+Claude Code는 에이전트 메타데이터에 선언된 거부 도구를 강제할 수 있습니다. Codex 에이전트 파일에는 이에 해당하는 도구 제한 필드가 없어, 그곳의 읽기 전용 한계는 하드 샌드박스가 아니라 프롬프트 계약입니다. OMD는 이 계약을 파일시스템 격리라고 표현하지 않습니다.
+
+## 근거 경계와 산출물
+
+| 단계 | 내구 산출물 | 경계 |
+| --- | --- | --- |
+| Frame | `.omd/frame.md` | 주장은 사용자 문장, 리서치 라인, 데이터, 또는 명명된 관찰이 필요합니다. 내부 OMD 지시는 근거가 아닙니다. |
+| Research | `.omd/refs/*.json` | builder는 모방할 스크린샷이 아니라 측정값과 원칙을 받습니다. 스카우팅은 보편적 캡처 수나 갤러리 할당량이 아니라 결정/컴포넌트 커버리지, 독립성, 출처 신뢰로 멈춥니다. |
+| Copy | `.omd/copy-deck.md` | 출하되는 각 사실 주장은 `verified` 사실 ID를 가리킵니다. `fixture` 사실은 밀도만 테스트하고, `open` 사실은 출하 주장을 뒷받침할 수 없습니다. |
+| 블라인드 카피 리뷰 | 리뷰 핸드오프 | 리뷰어는 렌더·소스·레이아웃·프레임·결정·작성자를 볼 수 없고 덱을 편집하지 않습니다. writer가 리뷰를 반영한 뒤 `omd copy --check` 를 다시 실행합니다. |
+| 타이포그래피 증명 | `.omd/type-proof.md`; 시편은 `.omd/.cache/type-proof/` | 실제 대상 언어 카피가 역할, 출처/라이선스, 글리프 커버리지, 요청/계산된 패밀리·굵기, 축, 폴백/로딩, 줄바꿈/잘림, 거부된 대안을 두 뷰포트에서 증명합니다. 브라우저 증거는 각 글리프에 쓰인 물리적 폰트를 식별하지 못합니다. |
+| 컴포지션 계약 | `.omd/composition.md` | 클린룸 composer가 정제된 근거를 받아 초점, CTA 경로, 메커니즘 캐리어/대안, 반응형 관계를 정의하며 폴드 위의 사진이나 폼을 요구하지 않습니다. 정확한 해시가 오래된 입력을 실패시킵니다. |
+| 구조 스케치 | `.omd/.cache/sketches/<id>/` | 각 후보는 고정 1280×900, 390×844 수용 렌더와 전체 페이지 데스크톱/모바일 연속성 증거를 제공합니다. 전체 페이지 캡처는 의존성/리듬만 알려줍니다. |
+| 블라인드 선택 | `.omd/taste/preferences.jsonl` | selector는 익명 렌더와 정제된 과업 맥락만 보고, 후보 근거나 작성자는 보지 못합니다. `omd choose` 가 선택된 후보와 이유를 에이전트 선택으로 저장합니다. |
+| 프로덕션 빌드 | 저장소 소스 | 하나의 builder가 선택된 하나의 구조를 구현하고 카피 덱을 보존합니다. 구현 이유는 `.omd/decisions.md` 의 `omd decision` 항목으로 별도 기록됩니다. |
+| 프로덕션 근거 | `.omd/attribution.md` | builder가 출하된 토큰·모션·컴포지션·그래픽의 출처를 기록합니다. |
+| 크래프트 체크포인트 | `.omd/craft.jsonl` | 하나의 시맨틱과 하나의 비주얼 체크포인트가 각각 관찰과 그로 인한 구체적 변경을 기록합니다. |
+| 소스 후보 분류 | 원시 JSON은 `.omd/.cache/`; 근거는 `.omd/decisions.md` | `omd slop scan` 이 소스 발췌 없이 통제된 신호를 노출합니다. `needs-render` 는 과도기이며, 최종 미분류·needs-render 수는 모두 0입니다. |
+| 렌더 리뷰 | 캐시 렌더, 필름스트립, 프로브 출력 | 스퀸트 리뷰어는 스퀸트 렌더만 봅니다. 날카로운 리뷰어는 정제된 과업 맥락과 측정 출력을 받되, builder의 근거는 받지 않습니다. |
+| Reframe | `.omd/frame.md` 개정 | `omd frame reframe` 는 원래 프레이밍을 지우지 않고 렌더가 드러낸 것을 덧붙입니다. |
+| 최종 소스 씰 | `.omd/source-seal.json` | `omd source --seal` 은 최종 카피/타입/컴포지션과 정렬된 프로덕션 소스 해시를 기록합니다. `--check` 는 시맨틱 충실도가 아니라 바이트 신선도만 증명합니다. |
+
+사람 승인 체크포인트는 크래프트 체크포인트와 별개입니다. 프로젝트는 기본 `checkpoint: none` 이며, `.omd/config.json` 에서 concept·structure·둘 다를 켤 수 있습니다.
+
+## 스택 라우팅
+
+모든 builder는 동일한 우선순위를 따릅니다.
+
+```text
+명시적 사용자 요청
+  > 기존 저장소 스택과 툴체인
+  > 완전한 빈 그린필드에는 React + Vite + TypeScript
+```
+
+기존 바닐라 HTML은 기존 스택입니다. 인식되지 않는 패키지나 툴체인은 조사·보존되며 빈 저장소로 취급되지 않습니다. 새 그린필드에 순수 HTML은 사용자가 명시적으로 요청할 때만 씁니다. 그린필드 스캐폴드 의존성은 허용되지만, 기존 프로젝트에는 불필요한 의존성을 추가하지 않습니다.
+
+## 검증 스택
+
+OMD는 결정적 검사와 렌더 리뷰를 결합합니다.
+
+| 레이어 | 명령과 근거 |
+| --- | --- |
+| 계약 | `omd copy --check` 는 덱 구조와 사실 참조를 검증합니다. `omd composition --check` 는 컴포지션 섹션과 입력 신선도를 검증합니다. `omd source --seal/--check` 는 시맨틱 충실도 주장 없이 최종 승인 입력/소스 바이트를 검증합니다. `omd design --check` 는 디자인 계약 커버리지를 검증합니다. |
+| 타이포그래피 증명 | 레이아웃 중립 데스크톱/모바일 시편이 스케치 전에 실행되고, 선택 컨테이너 재증명이 시맨틱 구조 이후·비주얼 체크포인트 이전에 실행됩니다. 카피, 폰트/파일, 굵기/축, 컨테이너 폭 변경이 증명을 무효화합니다. |
+| 렌더 근거 | `omd render` 는 기본으로 정확한 뷰포트를 캡처합니다. `--full-page` 는 보조 연속성 근거, `--squint` 는 그레이스케일·블러로 위계를 분리, `--filmstrip` 은 로드 시점 프레임을 캡처합니다. |
+| 인터랙션 | `omd probe` 는 선언된 안전한 로컬 계획만 실행하고 기대·탭 순서 실패를 보고합니다. |
+| 소스 후보 | `omd slop scan [root] [--json]` 은 지원되는 프로덕션 소스를 쓰지 않고 읽습니다. 후보는 맥락적 분류가 필요하며 `omd check` 경고·점수·작성자 주장이 아닙니다. |
+| 디자인 린트 | `omd check` 는 `system`, `a11y`, `slop`, `motion`, `ux` 조건을 평가합니다. 대비·터치 영역 규칙은 오류이고, slop과 기타 품질 하한 규칙은 그렇게 작성된 경우 경고입니다. 어떤 발견이든 1로 종료하므로 CI에서 쓸 수 있습니다. |
+| 사이트 일관성 | `omd check --site <dir>` 또는 다중 페이지 위치 인자 검사가 페이지 간 래더·토큰 드리프트를 보고합니다. |
+| 레퍼런스 거리 | `omd ref distance <page>` 가 측정 불변량을 저장된 레퍼런스와 비교해 지나치게 가까운 결과를 잡는 데 돕습니다. |
+| Figma 충실도 | `omd figma pull`, `system`, `diff` 가 Figma 스냅샷을 측정된 구현 보고와 연결합니다. `export FIGMA_TOKEN=…` 이 필요하며, `omd doctor` 는 토큰 부재를 선택 사항으로 처리합니다. |
+| 시각 타깃 | `omd target set <이미지-경로-또는-URL> --as <name>` 과 `omd target diff` 가 등록된 PNG 타깃에 대해 경계 있는 이미지 비교를 실행합니다. URL은 직접 HTTP(S) 이미지 URL이어야 합니다. |
+
+slop 발견은 품질 하한이자 경고이며, 디자인이 AI로 생성되었음을 증명하지 않습니다. 서면 오버룰은 의도를 기록하지만 발견을 억제하거나 명령 상태를 바꾸지 않습니다. 렌더 비평은 여전히 필요합니다 — 규칙 엔진은 광학적 균형, 컴포지션 리듬, 타이포그래피 크래프트, 또는 기억에 남을 순간이 컨셉의 것인지를 안전하게 판단할 수 없습니다.
+
+## 인터랙션 적용성
+
+카피 덱은 정확히 하나의 인터랙션 범위를 선언합니다.
+
+| 범위 | 필요한 근거 |
+| --- | --- |
+| `stateful` | 주요·복구 카피, `.omd/probes/primary.json`, `.omd/probes/recovery.json`. 두 프로브 모두 실행됩니다. |
+| `navigation-only` | 주요 카피와 주요 프로브. 복구 카피·프로브는 구체적 이유와 함께 `N/A`. |
+| `static` | 주요 카피. 복구 카피와 두 프로브 모두 구체적 이유와 함께 `N/A`. |
+
+로딩·빈·오류·성공·비활성·오프라인·복구 상태는 표면이 실제로 도달할 수 있을 때만 설계합니다 — 하네스는 체크리스트를 채우려고 가짜 상태를 더하지 않습니다. 프로브 계획은 명시적 기대가 있는 선언된 클릭·입력·키 단계를 쓰고, 로컬 파일과 localhost/loopback URL로 제한되며, 인증·원격·파괴적·미선언 동작을 거부합니다. OMD는 컨트롤을 스스로 찾아 자동으로 클릭하지 않습니다.
+
+## 프로젝트 상태
+
+내구적이고 검토 가능한 기록은 `.omd/` 바로 아래에 있습니다.
+
+- `frame.md`, `copy-deck.md`, `type-proof.md`, `composition.md`, `source-seal.json`, `design.md`, `decisions.md`
+- `attribution.md`, `motion-spec.md`, `craft.jsonl`, `config.json`
+- `refs/*.json`, 선언된 `probes/*.json`, `taste/preferences.jsonl`, `history.jsonl`
+
+생성된 IR, 렌더, 필름스트립, 스케치 후보, 프로브 결과, 스크래치 출력은 `.omd/.cache/` 아래에 있으며, 캐시를 지워도 디자인 의도가 사라지면 안 됩니다. `oh-my-design uninstall` 은 설치된 OMD 파일과 설정 변경을 제거하되 프로젝트의 `.omd/` 디렉터리는 보존합니다.
+
+## CLI 레퍼런스
+
+`node bin/omd.ts --help` 의 압축 지도입니다.
+
+```text
+omd ir <page> [-o file]
+omd render <page> -o shot.png [--viewport WxH] [--full-page] [--squint] [--filmstrip]
+omd probe <page> [--plan path] [--json] [--out path]
+omd check [<page>|--ir file] [--json] [--category slop] [--no-log]
+omd check --site <dir>
+omd check <page1> <page2> ...
+omd slop scan [root] [--json]
+omd coach
+omd composition --check [--json]
+omd source --seal [root]  |  omd source --check [root] [--json]
+
+omd frame show
+omd frame set --problem P --reframe R --why EVIDENCE [--task T --frequent-action A --costliest-error E]
+omd frame reframe --to "..." --because "..."
+omd frame generator --set "metaphor"
+omd choose c1 c2 --chose c2 --why "..."
+omd decision "what" --why "why"
+omd taste record "subject" --kind selection|praise|rejection|overrule --evidence "verbatim" --from-user
+omd taste profile [--all]
+omd config set checkpoint none|concept|structure|both  |  omd config show
+omd craft checkpoint semantic|visual --render path --observed "..." --changed "..."
+omd craft status [--json]
+
+omd ref add <url|file> --as <component> [--selector "css"] [--image] [--blueprint]
+omd ref list  |  omd ref distance <page>
+omd ref principles <source> --as <component> --add "..."
+omd ref show <source> --as <component>
+
+omd design  |  omd design --check
+omd copy --check [--json]
+omd pack dir | list | <relpath>
+omd doctor
+
+omd figma pull <file-url>  |  omd figma system  |  omd figma diff <frame-id> <page-or-url>
+omd target set <image-path-or-url> --as <name>  |  omd target list  |  omd target diff <page> [--target <name>] [--viewport WxH] [--threshold N] [--json]
+```
+
+## 아키텍처와 기여
+
+프롬프트 원본:
+
+- `src/agents/*.agent.yaml`
+- `src/skills/omd-*/SKILL.md`
+
+생성 산출물 — **직접 편집하지 마세요.** `npm run build` 가 직접 호스트와 플러그인 패키징용으로 재생성합니다:
+
+- `agents/`, `skills/`, `dist/`
+
+직접 편집하는 경로: `core/`, `bin/`, `adapters/`, `test/`, `evals/`, `scripts/`, `README.md`, `README.ko.md`, 그리고 `core/` 아래 이론·레시피 팩.
+
+변경을 제출하기 전에:
+
+```bash
+npm test
+npx tsc --noEmit
+npm run build
+```
+
+새 린터 규칙은 좁게 유지하고, 양성·음성 테스트를 포함하며, 항상 경고 심각도를 사용합니다.
+
+## 한계와 신뢰
+
+- 프롬프트는 절제된 워크플로를 정의하지만, 실제 프로젝트 근거·쓸 만한 카피·렌더 검사·프로젝트별 검증 없이는 강한 디자인을 보장하지 않습니다.
+- 프로브는 로컬·비인증·비파괴 경로를 위한 것이며, 범용 브라우저 자동화 계층이 아닙니다.
+- 레퍼런스 거리, 린트, 이미지 diff는 측정값입니다. 판단을 대체하지 않고 정보를 줍니다.
+- 플러그인/마켓플레이스 매니페스트는 배포되는 산출물이며, install→doctor 회귀 테스트가 다루는 경로는 소스 기반 직접 설치입니다.
+
+[MIT License](LICENSE) 로 배포됩니다.

package/README.md

@@ -0,0 +1,282 @@
+# Oh My Design
+
+A design process for coding agents — not a visual style. OMD makes the model earn each decision: question the brief, gather evidence, write real copy, prove typography, compose deliberately, build once, inspect the render, and reframe.
+
+[한국어](README.ko.md)
+
+## Built with OMD — in one shot
+
+[![The OMD landing page, generated by OMD](docs/omd-landing.png)](https://3x-haust.github.io/oh-my-design/)
+
+The landing page above was generated by OMD itself from a single one-shot prompt — the visual output was not hand-tuned. It is live at **[3x-haust.github.io/oh-my-design](https://3x-haust.github.io/oh-my-design/)**, and its source is in [`example/`](example/).
+
+## What it is
+
+Here, “design like a human” means accountable judgment, not a signature look. The goal is a repeatable process; the result can be quiet, expressive, conventional, or strange. What stays constant is the chain of decisions behind it.
+
+Oh My Design (OMD) keeps a coding agent from jumping straight from a request to polished UI. It asks what problem is being solved, records evidence, separates writing from layout, compares anonymous structures, and critiques the rendered output without exposing the reviewer to the builder’s rationale.
+
+The durable loop is:
+
+```text
+brief → evidence → copy → typography proof → composition contract → isolated structure → one production build
+      → rendered critique and interaction evidence → reframe
+```
+
+OMD runs inside **Codex** and **Claude Code**. It ships six user-facing skills, nine internal pipeline agents, a local `omd` CLI, design theory and recipe packs, and a durable project record under `.omd/`.
+
+## Requirements
+
+- **Node.js 22.18 or newer** (the CLI runs the TypeScript entrypoints directly)
+- **Claude Code, Codex, or both**, with the host config directory already present
+- **Chromium via Playwright** for rendering, probing, and typography proofs (installed separately — see below)
+
+## Install
+
+> **Not on npm.** The `oh-my-design` name on npmjs.com belongs to an unrelated project (`O-Pencil/skills`). Do not `npm install -g oh-my-design` — install from this repository instead.
+
+### Claude Code — plugin marketplace
+
+```text
+/plugin marketplace add 3x-haust/oh-my-design
+/plugin install oh-my-design@omd
+```
+
+Then open a session and run `/ultradesign`.
+
+### From source — Claude Code and Codex (regression-tested)
+
+```bash
+git clone https://github.com/3x-haust/oh-my-design
+cd oh-my-design
+npm install
+
+node bin/omd-install.ts install    # copy skills + agents into every detected host and patch its config
+node bin/omd-install.ts doctor     # verify the host install
+node bin/omd.ts doctor             # verify the runtime, Chromium, project write access, and the theory pack
+```
+
+Run `npm link` if you want the short `omd` and `oh-my-design` commands on your PATH; otherwise call them as `node bin/omd.ts …` and `node bin/omd-install.ts …`.
+
+Scope any command to a single host with `--host claude` or `--host codex`:
+
+```bash
+node bin/omd-install.ts install --host codex
+node bin/omd-install.ts doctor --host codex
+node bin/omd-install.ts uninstall --host codex
+```
+
+`uninstall` reverses exactly what `install` did and never touches your `.omd/` directory.
+
+### Chromium
+
+The installer does not install Chromium. If `omd doctor` reports Playwright unavailable or its Chromium executable missing, install what the report names, then re-check:
+
+```bash
+npm install -g playwright
+npx playwright install chromium
+node bin/omd.ts doctor
+```
+
+## The human design loop
+
+`omd-ultradesign` coordinates this order:
+
+1. **Preflight** — pin the project directory, run `omd doctor`, inspect the repository, and route Figma briefs to `omd-figma`.
+2. **Frame** — interrogate the brief and record the problem, reframe hypothesis, primary task, frequent action, and costliest error with cited evidence.
+3. **Concept** — choose a generator, visual register, typography direction, and the intended memorable moment.
+4. **Research** — collect measured references across the domain, competitors, audience language, components, typography, and relevant motion.
+5. **Write copy** — a dedicated writer creates a fact-traceable copy deck before layout begins.
+6. **Review copy blind** — a fresh reviewer sees the brief, copy, fact ledger, and voice evidence, but no render, code, layout, rationale, or authorship.
+7. **Prove typography blind** — a typesetter renders layout-neutral actual-copy specimens at 1280×900 and 390×844; a fresh eye reviews them without page structure or rationale, then the typesetter revises and rerenders.
+8. **Compose deliberately** — a fresh composer defines the experience spine, one dominant focal anchor, mass/rhythm, a lawful mechanism carrier or explicit alternate, responsive recomposition, and candidate axes. `omd composition --check` verifies input freshness.
+9. **Diverge structurally** — isolated agents receive the same composition contract and render fixed desktop/mobile plus supplemental full-page continuity proofs for each candidate.
+10. **Choose blind** — a fresh selector scores eight frozen 0–4 dimensions, rejects contract violations or any dimension below 2, and never equates a form above the fold with CTA reach.
+11. **Build once** — one selected structure becomes the production implementation. The builder does not generate another candidate set.
+12. **Reflect while building** — the builder records a semantic checkpoint, re-proves type in the selected desktop/mobile containers, then records the visual checkpoint before optional motion.
+13. **See the result** — desktop and mobile renders, squint views, applicable filmstrips, deterministic checks, and declared local probes supply the review evidence.
+14. **Triage source candidates** — after production source exists, a read-only scan proposes narrow candidates. The coordinator resolves each through rendered context; candidate presence alone is not a failure.
+15. **Critique, repair, and reframe** — a squint-only glance reports hierarchy first; a separate sharp reviewer judges craft and sanitized candidates, then repairs are rendered, checked, and rescanned.
+16. **Ship** — project tests, build checks, applicable design gates, and unresolved findings are reported with their evidence.
+
+Figma files and explicit visual targets already supply structural decisions, so the loop may skip structural divergence in those routes — but it records why.
+
+## Skills
+
+Six user-facing skills. Canonical names use the `omd-` prefix; Codex shows them as `(omd) <skill>`, and the Claude marketplace flavor references them as `oh-my-design:<skill>`.
+
+| Skill | Use it for |
+| --- | --- |
+| `omd-ultradesign` | Run the complete human design loop for a page, app, dashboard, blog, landing page, or redesign. |
+| `omd-figma` | Pull a Figma file, synthesize its system, implement frames, compare responsive pairs, and report measured fidelity. |
+| `omd-scout` | Build a standalone measured reference board without designing or implementing. It closes consequential coverage gaps and reports uncertainty instead of filling quotas. |
+| `omd-critique` | Review an existing design without changing it; group deterministic findings by root cause and judge rendered craft. |
+| `omd-humanize` | Preserve facts while locally repairing sound discourse or reconstructing a misshapen message from verified facts, voice, and surface action. |
+| `omd-coach` | Read accumulated check history, identify recurring problems and trends, and suggest what to practise next. It does not read taste records. |
+
+## Internal pipeline agents
+
+Nine agents are implementation details of the loop, not public commands. They do not pin a concrete model — each inherits the model selected for the session.
+
+| Agent | Responsibility | Write boundary |
+| --- | --- | --- |
+| `omd-framer` | Questions the brief and records an evidence-backed frame. | Read-only; records through the frame CLI. |
+| `omd-scout` | Researches measured evidence for pipeline coverage. | Read-only; records through reference CLI commands. |
+| `omd-writer` | Writes or repairs the copy deck and fact ledger. | Only `.omd/copy-deck.md`. |
+| `omd-typesetter` | Builds and revises the pre-structure actual-copy typography proof. | `.omd/type-proof.md` and `.omd/.cache/type-proof/`. |
+| `omd-composer` | Converts sanitized evidence into the fresh composition contract before divergence. | Only `.omd/composition.md`. |
+| `omd-sketch` | Produces one isolated grayscale structural candidate with real copy. | Only its cache candidate directory. |
+| `omd-hand` | Builds the selected structure and records two craft checkpoints. | Production repository and declared OMD records. |
+| `omd-glance` | Reports hierarchy from squint renders only. | No writes. |
+| `omd-eye` | Selects anonymous structures, reviews copy or typography proof blind, or critiques sharp renders. | No writes. |
+
+Claude Code can enforce declared denied tools in agent metadata. Codex agent files have no equivalent tool-restriction field, so read-only limits there are prompt contracts rather than a hard sandbox. OMD does not describe those contracts as filesystem isolation.
+
+## Evidence boundaries and artifacts
+
+| Stage | Durable output | Boundary |
+| --- | --- | --- |
+| Frame | `.omd/frame.md` | Claims need a user sentence, research line, datum, or named observation. Internal OMD instructions are not evidence. |
+| Research | `.omd/refs/*.json` | Builders receive measurements and principles, not screenshots to imitate. Scouting stops on decision/component coverage, independence, and source trust — not a universal capture count or gallery quota. |
+| Copy | `.omd/copy-deck.md` | Each shipped factual claim points to a `verified` fact ID. `fixture` facts test density only; `open` facts cannot support shipped claims. |
+| Blind copy review | review handoff | The reviewer cannot inspect renders, source, layout, frame, decisions, or authorship and does not edit the deck. The writer applies the review, then `omd copy --check` runs again. |
+| Typography proof | `.omd/type-proof.md`; specimens in `.omd/.cache/type-proof/` | Actual target-language copy proves roles, source/licence, glyph coverage, requested/computed family and weight, axes, fallback/loading, wraps/clips, and rejected alternatives at both viewports. Browser evidence does not identify the physical font used for each glyph. |
+| Composition contract | `.omd/composition.md` | A clean-room composer receives sanitized evidence and defines a focal anchor, CTA path, mechanism carrier/alternate, and responsive relationships without requiring a photo or form above the fold. Exact hashes make stale inputs fail. |
+| Structural sketches | `.omd/.cache/sketches/<id>/` | Each candidate supplies fixed 1280×900 and 390×844 acceptance renders plus full-page desktop/mobile continuity evidence. Full-page captures inform dependency/rhythm only. |
+| Blind choice | `.omd/taste/preferences.jsonl` | The selector sees anonymous renders and sanitized task context, not candidate rationale or authorship. `omd choose` stores the selected candidate and its reason as an agent choice. |
+| Production build | repository source | One builder implements one selected structure and preserves the copy deck. Separate `omd decision` entries record implementation reasons in `.omd/decisions.md`. |
+| Production evidence | `.omd/attribution.md` | The builder records the sources behind shipped tokens, motion, composition, and graphics. |
+| Craft checkpoints | `.omd/craft.jsonl` | One semantic and one visual checkpoint each record an observation and the concrete change it caused. |
+| Source-candidate triage | raw JSON in `.omd/.cache/`; reasoning in `.omd/decisions.md` | `omd slop scan` exposes controlled signals without source excerpts. `needs-render` is transitional; final untriaged and needs-render counts are both zero. |
+| Rendered review | cache renders, filmstrip, probe output | The squint reviewer sees only squint renders. The sharp reviewer receives sanitized task context plus measured outputs, never the builder’s rationale. |
+| Reframe | `.omd/frame.md` revision | `omd frame reframe` appends what the render revealed instead of erasing the original framing. |
+| Final source seal | `.omd/source-seal.json` | `omd source --seal` records final copy/type/composition and sorted production-source hashes; `--check` proves byte freshness only, not semantic fidelity. |
+
+Human approval checkpoints are separate from craft checkpoints. Projects default to `checkpoint: none`; concept, structure, or both can be enabled in `.omd/config.json`.
+
+## Stack routing
+
+Every builder follows the same precedence:
+
+```text
+explicit user request
+  > existing repository stack and toolchain
+  > React + Vite + TypeScript for a truly blank greenfield
+```
+
+Existing vanilla HTML is an existing stack. An unrecognized package or toolchain is investigated and preserved, not treated as an empty repository. Plain HTML for a new greenfield project is used only when the user explicitly asks for it. Greenfield scaffold dependencies are allowed; existing projects should not receive unnecessary ones.
+
+## Verification stack
+
+OMD combines deterministic checks with rendered review.
+
+| Layer | Commands and evidence |
+| --- | --- |
+| Contracts | `omd copy --check` validates deck structure and fact references. `omd composition --check` validates composition sections and input freshness. `omd source --seal/--check` validates final approved-input/source bytes without claiming semantic fidelity. `omd design --check` validates design-contract coverage. |
+| Typography proof | Layout-neutral desktop/mobile specimens run before sketches; selected-container reproof runs after semantic structure and before the visual checkpoint. Copy, font/file, weight/axis, or container-width changes invalidate the proof. |
+| Render evidence | `omd render` captures the exact viewport by default; `--full-page` is supplementary continuity evidence, `--squint` isolates hierarchy with grayscale and blur, `--filmstrip` captures load-time frames. |
+| Interaction | `omd probe` executes only a declared, safe local plan and reports expectation or tab-order failures. |
+| Source candidates | `omd slop scan [root] [--json]` reads supported production source without writing it. Candidates require contextual triage; they are not `omd check` warnings, scores, or authorship claims. |
+| Design lint | `omd check` evaluates `system`, `a11y`, `slop`, `motion`, and `ux` conditions. Contrast and hit-area rules are errors; slop and other quality-floor rules are warnings where authored that way. Any finding exits 1, so it is usable in CI. |
+| Site consistency | `omd check --site <dir>` or multi-page positional checks report cross-page ladder and token drift. |
+| Reference distance | `omd ref distance <page>` compares measured invariants against saved references and helps catch overly close results. |
+| Figma fidelity | `omd figma pull`, `system`, and `diff` connect a Figma snapshot to a measured implementation report. Requires `export FIGMA_TOKEN=…`; `omd doctor` treats a missing token as optional. |
+| Visual target | `omd target set <image-path-or-url> --as <name>` and `omd target diff` run a bounded image comparison against a registered PNG target. A URL must be a direct HTTP(S) image URL. |
+
+Slop findings are a quality floor and warnings; they do not prove a design was generated by AI. A written overrule records intent but does not suppress a finding or change command status. Rendered critique remains necessary — a rule engine cannot safely judge optical balance, composition rhythm, typography craft, or whether the memorable moment belongs to the concept.
+
+## Interaction applicability
+
+The copy deck declares exactly one interaction scope.
+
+| Scope | Required evidence |
+| --- | --- |
+| `stateful` | Primary and recovery copy, `.omd/probes/primary.json`, and `.omd/probes/recovery.json`. Both probes run. |
+| `navigation-only` | Primary copy and the primary probe. Recovery copy and recovery probe are `N/A` with concrete reasons. |
+| `static` | Primary copy. Recovery copy and both probes are `N/A` with concrete reasons. |
+
+Loading, empty, error, success, disabled, offline, and recovery states are designed only when the surface can reach them — the harness does not add fake states to satisfy a checklist. Probe plans use declared click, fill, and keypress steps with explicit expectations, are limited to local files and localhost/loopback URLs, and reject authenticated, remote, destructive, or undeclared actions. OMD never discovers controls and clicks them automatically.
+
+## Project state
+
+Durable, reviewable records live directly under `.omd/`:
+
+- `frame.md`, `copy-deck.md`, `type-proof.md`, `composition.md`, `source-seal.json`, `design.md`, `decisions.md`
+- `attribution.md`, `motion-spec.md`, `craft.jsonl`, `config.json`
+- `refs/*.json`, declared `probes/*.json`, `taste/preferences.jsonl`, and `history.jsonl`
+
+Generated IR, renders, filmstrips, sketch candidates, probe results, and scratch output live under `.omd/.cache/`; deleting the cache should not erase design intent. `oh-my-design uninstall` removes installed OMD files and config changes while preserving the project’s `.omd/` directory.
+
+## CLI reference
+
+A compact map of `node bin/omd.ts --help`:
+
+```text
+omd ir <page> [-o file]
+omd render <page> -o shot.png [--viewport WxH] [--full-page] [--squint] [--filmstrip]
+omd probe <page> [--plan path] [--json] [--out path]
+omd check [<page>|--ir file] [--json] [--category slop] [--no-log]
+omd check --site <dir>
+omd check <page1> <page2> ...
+omd slop scan [root] [--json]
+omd coach
+omd composition --check [--json]
+omd source --seal [root]  |  omd source --check [root] [--json]
+
+omd frame show
+omd frame set --problem P --reframe R --why EVIDENCE [--task T --frequent-action A --costliest-error E]
+omd frame reframe --to "..." --because "..."
+omd frame generator --set "metaphor"
+omd choose c1 c2 --chose c2 --why "..."
+omd decision "what" --why "why"
+omd taste record "subject" --kind selection|praise|rejection|overrule --evidence "verbatim" --from-user
+omd taste profile [--all]
+omd config set checkpoint none|concept|structure|both  |  omd config show
+omd craft checkpoint semantic|visual --render path --observed "..." --changed "..."
+omd craft status [--json]
+
+omd ref add <url|file> --as <component> [--selector "css"] [--image] [--blueprint]
+omd ref list  |  omd ref distance <page>
+omd ref principles <source> --as <component> --add "..."
+omd ref show <source> --as <component>
+
+omd design  |  omd design --check
+omd copy --check [--json]
+omd pack dir | list | <relpath>
+omd doctor
+
+omd figma pull <file-url>  |  omd figma system  |  omd figma diff <frame-id> <page-or-url>
+omd target set <image-path-or-url> --as <name>  |  omd target list  |  omd target diff <page> [--target <name>] [--viewport WxH] [--threshold N] [--json]
+```
+
+## Architecture and contributing
+
+Prompt source of truth:
+
+- `src/agents/*.agent.yaml`
+- `src/skills/omd-*/SKILL.md`
+
+Generated outputs — **do not edit directly**; `npm run build` regenerates them for direct hosts and plugin packaging:
+
+- `agents/`, `skills/`, `dist/`
+
+Edited directly: `core/`, `bin/`, `adapters/`, `test/`, `evals/`, `scripts/`, `README.md`, `README.ko.md`, and the theory and recipe packs under `core/`.
+
+Before submitting a change:
+
+```bash
+npm test
+npx tsc --noEmit
+npm run build
+```
+
+New linter rules must remain narrow, include positive and negative tests, and always use warning severity.
+
+## Limits and trust
+
+- The prompts define a disciplined workflow; they do not guarantee strong design without real project evidence, usable copy, rendered inspection, and project-specific validation.
+- Probes are for local, non-authenticated, non-destructive paths — not a general browser automation layer.
+- Reference distance, lint, and image diff are measurements. They inform judgment rather than replace it.
+- Plugin/marketplace manifests are shipped artifacts; the from-source direct installer is the path covered by install-to-doctor regression tests.
+
+Licensed under the [MIT License](LICENSE).