
AI가 디자인을 '만들기' 시작했다 — Open Design 아키텍처 심층 분석
Anthropic의 Claude Design이 보여준 '아티팩트-퍼스트' 워크플로우를 11일 만에 38,000개 별로 따라잡은 오픈소스 프로젝트 Open Design을 분해한다. 데몬-에이전트 아키텍처, 파일 기반 스킬, 프롬프트 스택, anti-AI-slop 머신까지 — '왜 이런 모양일 수밖에 없는가'를 처음부터 끝까지 따라가는 특집.

Anthropic의 Claude Design이 보여준 '아티팩트-퍼스트' 워크플로우를 11일 만에 38,000개 별로 따라잡은 오픈소스 프로젝트 Open Design을 분해한다. 데몬-에이전트 아키텍처, 파일 기반 스킬, 프롬프트 스택, anti-AI-slop 머신까지 — '왜 이런 모양일 수밖에 없는가'를 처음부터 끝까지 따라가는 특집.
make me a magazine-style pitch deck for our seed round.
이 한 줄을 친 직후 어떤 일이 일어나야 '잘 만든 AI 디자인 도구'인지를 두고 2026년 봄, 업계가 한 차례 합의를 봤다. Anthropic이 4월 17일에 Claude Design(Opus 4.7 기반)을 공개했고, 트위터는 일주일을 그 데모로 채웠다. 모델이 글을 쓰는 게 아니라 HTML 아티팩트를 뱉어 냈다는 것이 충격이었다. 마치 잡지사 인턴이 아니라 시니어 디자이너가 옆에 앉은 것 같았다.
문제는 '클로즈드, 유료, 클라우드 전용'이었다는 것. 자기 모델 못 쓰고, 자기 스킬 못 넣고, Vercel에 못 올리고, 회사 내부망에 띄울 수 없었다. 11일 뒤인 4월 28일, nexu-io/open-design 저장소가 첫 커밋을 올린 이유다. 같은 루프, 같은 아티팩트-퍼스트 멘탈 모델, 동일한 시니어 디자이너 디시플린 — 그러나 에이전트는 당신 노트북에 이미 깔린 CLI를 쓴다. 그게 핵심 차이고, 그 한 줄을 위해 만들어진 아키텍처가 이 글의 주제다.
5월 12일 현재 별 38,092개, 포크 4,329개, 컨트리뷰터 수십 명. 이 글에선 코드를 한 번도 읽지 않은 독자가 끝까지 따라가게 만드는 게 목표다. 왜 이런 모양일 수밖에 없는지, 그리고 2026년에 이게 왜 의미 있는지를 차근차근 풀어 본다.

Open Design은 갑자기 나온 게 아니다. LLM이 텍스트 대신 산출물(artifact)을 만든다는 발상은 짧지 않은 계보를 갖는다. 핵심 마일스톤만 골라 보면 이렇다.
SKILL.md 한 장과 assets/, references/만 있으면 에이전트의 능력이 된다.이 흐름을 한 문장으로 요약하면 이렇다. "LLM은 산문에서 도구 호출로, 도구 호출에서 파일 산출물로, 파일 산출물에서 디자인 아티팩트로 옮겨 갔다." Open Design은 그 마지막 단계를 누구의 노트북에서든 굴릴 수 있게 만든 어셈블리다.
말로 설명하면 길어진다. 그래서 저장소 README가 가장 먼저 보여 주는 시퀀스를 그대로 재구성해 본다.
<question-form id="discovery">가 채팅에 뜬다. 5개 라디오: 표면(surface) · 오디언스 · 톤 · 브랜드 컨텍스트 유무 · 스케일. 30초 안에 클릭으로 답한다.TodoWrite가 라이브 카드로 스트리밍. "1. 시드 템플릿 읽기 — in_progress → completed", "2. 브랜드 스펙 작성", "3. 1차 슬라이드 작성", "4. 5차원 크리틱"이 차례로 체크된다..od/projects/<id>/ 폴더를 만들고, 그곳을 cwd로 잡은 채 claude 또는 codex를 spawn. 에이전트는 진짜 Read/Write/Bash/WebFetch 권한으로 스킬의 assets/template.html을 읽고, 팔레트 hex를 grep하고, brand-spec.md를 쓴다.<artifact> 하나가 srcdoc 샌드박스 iframe에 뜬다. 옆엔 HTML/PDF/PPTX/ZIP/MD 다운로드 칩.이 시퀀스 전체가 6–60초다. 더 중요한 건 그 사이에 사용자가 한 일이 "프롬프트 한 줄 + 라디오 두 번"이라는 점이다. 30초의 라디오 클릭이 30분의 잘못된 방향 수정을 막는다 — 이게 Open Design이 자기 입으로 가장 자주 쓰는 표현이다.
전통적 AI 어시스턴트는 디자인을 설명한다. "왼쪽 컬럼에 12px 사이드바를 두고, 그 위에 KPI 카드 3개를…" Claude Design이 바꾼 건 출력의 형태다. 모델이 마침내 **.html, .pptx, .mp4**를 직접 만들어 준다.
이 차이는 작아 보이지만, 워크플로우 전반을 뒤집는다.
| 기준 | 산문(prose) 모드 | 산출물(artifact) 모드 |
|---|---|---|
| 출력 | "이렇게 만드세요" | 다운로드 가능한 파일 |
| 다음 행동 | 사용자가 코딩 | 사용자가 검토 |
| 피드백 단위 | 대화의 다음 메시지 | 아티팩트 위의 클릭/댓글 |
| 실패 모드 | 장황한 설명 | 잘못된 결과물이지만 어쨌든 파일 |
| 검증 가능성 | 주관적 | 린트·자동 크리틱 가능 |
"검증 가능성"이 산출물 모드의 진짜 무기다. POST /api/artifacts/lint 라는 데몬 엔드포인트는 생성된 아티팩트의 구조적 결함(깨진 <artifact> 프레이밍, 누락된 사이드 파일, 스테일된 팔레트 토큰)을 찾아 다시 에이전트한테 돌려준다. 5차원 셀프 크리틱은 이 린트 결과를 근거로 점수를 매긴다. "감"이 아니라 "증거"가 된다.
저장소가 직접 "six load-bearing ideas"라고 부르는 6개 원칙이 있다. 하나씩 풀어 본다.
데몬은 부팅 시 PATH를 스캔해 16개의 코딩 에이전트 CLI를 자동 감지한다. Claude Code, Codex CLI, Devin for Terminal, Cursor Agent, Gemini CLI, OpenCode, Qwen, Qoder, GitHub Copilot CLI, Hermes(ACP), Kimi(ACP), Pi(RPC), Kiro(ACP), Kilo(ACP), Mistral Vibe(ACP), DeepSeek TUI. 발견된 것들이 곧 "디자인 엔진 후보". 모델 피커에서 한 번의 클릭으로 스왑할 수 있다.
이 발상의 출처는 multica-ai/multica와 farion1231/cc-switch다. Open Design은 "에이전트는 동료(teammate), 우리는 동료를 다시 만들지 않는다"라는 그 워드뷰를 그대로 가져왔다.
CLI가 하나도 없다면? POST /api/proxy/{anthropic,openai,azure,google}/stream BYOK 프록시가 동일한 파이프라인을 spawn 없이 굴린다. Ollama·LM Studio 같은 로컬 LLM도 loopback이면 통과, 비-loopback의 내부망·CGNAT·multicast는 SSRF 방지로 차단된다.
이게 가장 우아한 발명일지 모른다. 하나의 스킬 = 하나의 폴더.
skills/saas-landing/
├── SKILL.md ← 프론트매터 + 가이드
├── assets/
│ └── template.html ← 시드
└── references/
├── themes.md
├── layouts.md
├── components.md
└── checklist.md ← P0/P1/P2 게이트
Anthropic의 Claude Code Skills 컨벤션을 그대로 따르되, Open Design은 od: 확장 프론트매터(mode, platform, scenario, preview.type, design_system.requires, featured, fidelity, speaker_notes, animations, example_prompt)를 추가했다. 데몬은 이를 그대로 파싱한다(apps/daemon/src/skills.ts).
기본 31개:
| 모드 · prototype (27) | 모드 · deck (4) |
|---|---|
| web-prototype · saas-landing · dashboard · pricing-page · docs-page · blog-post | guizang-ppt (default) |
| mobile-app · mobile-onboarding · gamified-app | simple-deck |
| email-marketing · social-carousel · magazine-poster | replit-deck |
| motion-frames · sprite-animation · digital-eguide · dating-web | weekly-update |
| wireframe-sketch · critique · tweaks | |
| pm-spec · team-okrs · meeting-notes · kanban-board · eng-runbook · finance-report · invoice · hr-onboarding |
스킬 하나를 더하고 싶다면 폴더 하나를 만들고, 데몬을 재시작하면 끝. 픽커에 자동으로 뜬다. 마켓플레이스 SDK가 필요 없는 것이다.

전통적인 디자인 토큰(Style Dictionary, Tokens Studio, Theo)은 JSON으로 토큰을 표현한다. 정확하긴 하지만 읽히지 않는다. LLM이 다루기에도 어색하다.
Open Design은 VoltAgent/awesome-design-md에서 가져온 9-섹션 DESIGN.md 스키마를 채택했다 — color · typography · spacing · layout · components · motion · voice · brand · anti-patterns. 사람이 PR에서 리뷰할 수 있고, 모델은 그대로 읽어 토큰을 추출한다.
기본 129개 시스템. Linear, Stripe, Vercel, Airbnb, Tesla, Notion, Anthropic, Apple, Cursor, Supabase, Figma, ClickHouse, Spotify, Webflow, Sanity, PostHog, Sentry, MongoDB, Cal, Replicate, Xiaohongshu, BMW, Ferrari, Mastercard… 픽커에서 시스템을 바꾸는 순간, 다음 렌더가 그 토큰으로 다시 그려진다.
OD 프롬프트 스택의 RULE 1: 모든 새 디자인 브리핑은 코드가 아니라 <question-form>으로 시작한다.
이건 alchaincyf/huashu-design에서 가져온 Junior-Designer 모드의 핵심이다. 질문을 앞으로 모으고, 일찌감치 회색 블록이라도 보여 주고, 잘못된 방향이면 채팅 한 라운드만 손해 보게 만든다. 5번째 슬라이드에서 "사실 색깔이 마음에 안 들어요"를 듣는 것보다 천 배 낫다.
브랜드 스펙이 있다면 5단계 프로토콜이 작동한다 — locate (스크린샷·URL 찾기) → download → grep hex (실제 색상 추출) → codify brand-spec.md → vocalise ("우리는 코발트 #1E3A8A를 강조에 쓴다"). 기억에서 브랜드 색을 추측하지 않는다 — 이게 anti-AI-slop의 P0다.
데몬은 child_process.spawn으로 CLI를 띄울 때 cwd를 .od/projects/<id>/로 잡는다. 그 결과 에이전트는 진짜 파일시스템 위에서 일한다. 스킬의 assets/template.html을 Read하고, 사용자 CSS를 grep하고, brand-spec.md를 Write하고, .pptx·.zip·.pdf를 Bash로 만들어낸다.
세션·프로젝트·메시지·열린 탭·저장된 템플릿은 모두 SQLite(.od/app.sqlite)에 영속화된다. 내일 다시 열어도 todo 카드가 그 자리에 있다.
매 전송 시점에 모델이 받는 건 단순한 "system + user"가 아니라, 6개 레이어를 합성한 결과물이다.
모든 레이어는 편집 가능한 파일이다. apps/daemon/src/prompts/system.ts, apps/daemon/src/prompts/discovery.ts, apps/daemon/src/prompts/directions.ts — 세 개의 파일에 제품 전체의 인격이 들어 있다. 포크해서 자기 회사 톤에 맞추면 그게 곧 자기 회사용 Open Design이 된다.
여기서부터 진짜다. Open Design은 같은 웹 번들을 3개의 모양으로 굴린다. 어떤 게 가능하고 어떤 게 떨어져 나가는지를 보면 디자인 결정이 다 보인다.
세 토폴로지는 같은 웹 번들을 쓴다. 차이는 어떤 transport가 활성화되는가뿐. 이게 가능한 이유: 웹 앱이 자기가 어디에 있는지를 모른다. /api/*만 알면 된다. 그걸 누가 받든 — Next.js의 rewrites가 받든, Vercel의 serverless가 받든, 데몬이 받든 — 결과는 같다.

이제 깊게 들어간다. 위의 그림 안에 박힌 부품들이 각각 어떤 책임을 가지는지 보자.
App Router 기반. 굳이 Vite SPA가 아니라 Next.js를 쓴 이유는 (1) 마케팅 랜딩의 SSR, (2) Topology C용 서버리스 라우트, (3) Vercel 일급 시민으로 배포할 수 있어서다. SPA였다면 이 셋 다를 따로 세팅했어야 했다.
apps/web/src/의 핵심 폴더:
components/ — 채팅, 컴포저, 픽커, 프리뷰, 스케치prompts/ — 위에서 본 6-레이어 합성기 (system.ts, discovery.ts, directions.ts)artifacts/ — 스트리밍 <artifact> 파서 + 매니페스트runtime/ — iframe srcdoc, 마크다운, export 헬퍼providers/ — 데몬 SSE + BYOK API 트랜스포트state/ — config + projects (localStorage + 데몬 backed)유일한 권한 있는 프로세스. 책임은 정확히 7가지.
http://localhost:7456 기본 바인딩. SQLite 테이블은 projects, conversations, messages, tabs, templates 다섯 개. WAL 모드.
.od/ 폴더 구조:
.od/
├── app.sqlite ← projects · conversations · messages · open tabs · templates
├── artifacts/ ← Save to disk한 일회성 렌더
└── projects/<id>/ ← 프로젝트별 작업 폴더 (= 에이전트의 cwd)
진짜 재밌어지는 곳이다. CLI마다 stdout 포맷이 다르다. Open Design은 이걸 7가지 스트림 포맷 파서로 정리했다.
| 스트림 포맷 | 사용 CLI | 특징 |
|---|---|---|
claude-stream-json | Claude Code | 타입드 이벤트 |
qoder-stream-json | Qoder CLI | 타입드 이벤트 |
copilot-stream-json | GitHub Copilot CLI | 타입드 이벤트 |
json-event-stream | Codex · Gemini · OpenCode · Cursor Agent | per-CLI eventParser |
acp-json-rpc | Devin · Hermes · Kimi · Kiro · Kilo · Mistral Vibe | Agent Client Protocol |
pi-rpc | Pi | stdio JSON-RPC |
plain | Qwen · DeepSeek TUI | raw stdout chunk |
새 CLI를 더하고 싶다면 apps/daemon/src/agents.ts의 AGENT_DEFS에 항목 하나, 그리고 위 7개 중 하나를 고르거나 (필요시) 새 파서. 그게 전부다.
Windows에서 매우 긴 합성 프롬프트를 받으면 CreateProcess의 ~32KB argv 제한에 막힌다. 그래서 Codex/Gemini/OpenCode/Cursor Agent/Qwen/Qoder/Pi는 stdin으로 프롬프트를 흘리고, Claude Code와 Copilot은 -p 플래그를 쓰되 그것마저 넘치면 temp 프롬프트 파일로 폴백한다. 이런 디테일이 "데몬은 부품이 아니라 외교관"이라는 인상을 준다.
세 곳을 스캔해 머지한다.
| 소스 | 우선순위 | 용도 |
|---|---|---|
./.claude/skills/ | 최고 | 프로젝트 비공개 스킬 |
./skills/ | 중간 | 프로젝트 선언 스킬 |
~/.claude/skills/ | 최저 | 유저 전역 스킬 |
충돌 시 우선순위로 결정. dev 모드에서는 파일 변경을 watch한다. 이걸 Claude Code 컨벤션과 호환되게 둔 의미가 크다 — 누가 Claude Code 스킬을 만들면 그게 Open Design에서도 곧장 돌고, 반대도 성립한다. 마켓플레이스가 만들어지면 자동으로 양쪽이 풍요로워진다.
./DESIGN.md → ./design-system/DESIGN.md → 사용자 설정 경로 순으로 찾아 9-섹션 포맷 파싱. 시스템 메시지 앞단에 prepend되며, 스킬은 템플릿 변수 {{ design_system }}으로도 참조 가능. dev에서 hot-reload.
이제 위 부품들을 묶어 본다. 사용자가 "프로토타입 만들어" 한 줄을 보낸 직후의 시간 순.
POST /api/chat with { sessionId, prompt, modeHint: "prototype" }.od/projects/<id>/ 슬러그 폴더 materializetool_call (write/edit/read) · text_delta · thinking → SSE로 웹에 리레이srcdoc으로 primary 파일 로드history.jsonl에 append-only 로그. SQLite에 메시지·탭 영속화. 댓글 모드로 사용자가 element 클릭하면 데몬이 surgical edit 명령으로 재호출핵심 제약 셋: (1) 아티팩트 코드를 호스트와 격리, (2) 에이전트의 라이브 쓰기에 hot-reload, (3) static HTML과 JSX 둘 다 지원.
설계:
<iframe sandbox="allow-scripts">, allow-same-origin은 절대 안 줌. window, cookie, parent DOM 접근 차단.srcdoc으로 그대로 로드.srcdoc replace. React state loss는 이 스코프에선 OK.| 포맷 | 방식 |
|---|---|
| HTML (self-contained) | 모든 CSS 인라인, 자산 URL을 data: URI로 재작성 |
puppeteer → page.pdf() on rendered HTML (deck-aware) | |
| PPTX | deck-skill이 slides.json 출력 → pptxgenjs로 .pptx 생성 |
| ZIP | archiver over artifacts/<id>/ |
| Markdown | 아티팩트가 .md면 그대로, 아니면 스킬 정의 렌더 |
POST /api/proxy/{anthropic,openai,azure,google}/stream. 사용자가 baseUrl, apiKey, model을 붙이면 데몬이 provider별 업스트림을 빌드, SSE 청크를 delta/end/error로 정규화해 다시 보낸다.
여기 보안 결정이 흥미롭다.
http://10.0.0.1/admin, http://169.254.169.254/ AWS 메타데이터)을 대신 때려 줄 수 있다.Open Design은 stdio MCP 서버도 함께 ships한다. Claude Code, Codex, Cursor, VS Code, Antigravity, Zed, Windsurf 어떤 MCP-호환 클라이언트에 꽂아도 다른 레포의 에이전트가 내 Open Design 프로젝트 파일을 직접 읽을 수 있다.
ZIP을 export → attach하는 루프 자체를 없앤 것. search_files, get_file, get_artifact를 프로젝트 인자 없이 호출하면 지금 Open Design에서 열어 둔 프로젝트가 디폴트가 된다. 그래서 다른 에이전트한테 "이 스타일에 맞춰서 우리 앱에 붙여 줘"라고 말하면 그냥 작동한다.
보안 모델은 단단하다 — 읽기 전용. 파일 메타데이터·콘텐츠·검색만 노출, 디스크 쓰기·외부 호출 일절 없음. 데몬은 기본적으로 127.0.0.1만 바인딩하며, LAN 노출은 명시적 OD_BIND_HOST 옵트인이 있어야 한다.
옵션 Electron 셸이 있다. 데몬·웹·데스크탑은 타입드 5필드 스탬프(app · mode · namespace · ipc · source)로 자기를 식별하고, /tmp/open-design/ipc/<namespace>/<app>.sock에서 JSON-RPC IPC를 노출한다.
채널: STATUS · EVAL · SCREENSHOT · CONSOLE · CLICK · SHUTDOWN. 그래서 tools-dev inspect desktop screenshot --path /tmp/foo.png 한 줄로 진짜 Electron 셸 위 E2E 테스트가 굴러간다. 베스포크 하네스 없이.
데스크탑이 데몬을 trust할 때는 HMAC 핸드셰이크가 작동한다. main 프로세스가 startup에서 32바이트 비밀을 만들고, IPC로 데몬에 등록. 폴더 import 시 nonce + 만료 + HMAC-SHA256 시그너처를 토큰으로 보내고, 데몬은 60초 TTL + 단일 사용 + replay 방지로 검증한다. 데스크탑 렌더러가 임의 로컬 경로를 shell.openPath로 열도록 유도하는 공격을 막기 위함이다.
여기까지 와도 "그래서 결과물의 품질은?"이라는 물음이 남는다. Claude Design이 바이럴 됐던 진짜 이유는 모델이 시니어 디자이너처럼 자기 검증을 했기 때문이다. Open Design은 이 디시플린을 통째로 베껴 와 프롬프트 스택에 강제했다.
아티팩트를 emit하기 직전, 모델은 자기 결과물에 1–5점을 매긴다.
3.0 미만이 하나라도 있으면 회귀로 간주, 자체 수정 → 재채점. 2회 패스가 평균. 채점의 근거가 되는 artifact lint API(POST /api/artifacts/lint)가 별도로 작동하므로 "감"으로 점수를 줄 수 없다.
프롬프트에 명시적으로 금지되는 것들:
| 금지 | 대체 |
|---|---|
| 공격적 보라 그라데이션 | 차분한 단색 + 미세한 텍스처 |
| 일반 이모지 아이콘 | 스킬 정의 아이콘 또는 SVG 미니멀 |
| 좌측 보더 액센트 + 둥근 모서리 카드 | 섹션 헤더와 여백으로 표현 |
| 손그린 SVG 인물 | 실사진 또는 추상 도형 |
| Inter를 디스플레이 폰트로 | 스킬·DS 정의 디스플레이 페이스 |
| 지어낸 메트릭("10× faster") | — 또는 회색 라벨드 블록 |
마지막 항목이 가장 중요하다. 모르는 숫자는 회색 플레이스홀더로 쓴다. AI가 가장 자주 거짓말하는 지점이 "그럴듯한 KPI 만들기"이기 때문이다.

모든 스킬은 references/checklist.md를 ships한다. P0(반드시 통과), P1(통과 권장), P2(있으면 좋음). 에이전트는 P0를 통과하지 못한 채로 <artifact>를 emit할 수 없다. 이 문화는 op7418/guizang-ppt-skill에서 가져왔다.
추상화를 거두고 실제 시나리오 6개.

스킬 guizang-ppt (deck 모드 기본). WebGL 히어로 배경, magazine-style 가로 스와이프, P0/P1/P2 체크리스트 강제. 출력은 단일 HTML + PDF. 처음 글에 인용한 시나리오가 정확히 이거다.
스킬 mobile-onboarding + assets/frames/iphone-15-pro.html. 픽셀 정확한 다이내믹 아일랜드, 상태 바 SVG, 홈 인디케이터. 멀티-스크린이라 폰을 다시 그리지 않고 공유 /frames/만 가져다 쓴다. 에이전트는 화면 컨텐츠에만 집중한다.
이게 가장 놀라운 부분이다. heygen-com/hyperframes는 HeyGen의 오픈소스 HTML→MP4 모션 그래픽 프레임워크. 에이전트가 HTML+CSS+GSAP를 작성하면, HyperFrames가 headless Chrome + FFmpeg으로 결정론적 MP4를 만든다.
Open Design은 hyperframes-html을 일급 비디오 모델로 묶어 두고, 데몬이 npx hyperframes render를 dispatch한다(이걸 직접 호출 안 하는 이유: macOS sandbox-exec과 Puppeteer가 같이 hang하는 알려진 이슈를 피하려고). 결과 .mp4만 프로젝트 칩으로 떨어진다.
11개의 ready-to-replicate 템플릿: 5초 미니멀 프로덕트 reveal, 30초 SaaS promo, 9:16 TikTok karaoke talking-head, 4초 시네마틱 로고 outro, 0→10K 머니 카운터, 3-phone 앱 쇼케이스, 비트 싱크 brand sizzle reel, NYT 스타일 bar chart race…
스킬 pm-spec. TOC + decision log가 들어간 단일 페이지 문서. 매거진 같지만 마크다운 친화적이라 회사 위키에 그대로 paste 가능. 운영 시나리오에는 이 외에 team-okrs, meeting-notes, kanban-board, eng-runbook, finance-report, invoice, hr-onboarding이 있다.
웰컴 다이얼로그에 Anthropic export ZIP을 드래그하면 POST /api/import/claude-design이 그걸 풀어 진짜 .od/projects/<id>/로 옮긴다. entry 파일은 탭으로 자동 오픈, "여기서부터 이어 작업" 프롬프트가 스테이징된다. Anthropic이 멈춘 자리에서 그대로 계속. 클로즈드 클라우드 → 오픈 로컬로 가는 실용적인 이주 도구다.
내 SaaS 코드베이스에서 Cursor를 띄우고 "이 데시보드를 우리 Open Design 프로젝트의 디자인 시스템에 맞춰 줘"라고 하면, Cursor가 Open Design의 MCP를 통해 라이브 DESIGN.md·brand-spec.md·entry HTML을 직접 읽는다. ZIP export 없음. 항상 최신.
여기서 잠시 더 큰 그림.
2024–2025 사이 'AI 어시스턴트'는 의미가 두 갈래로 갈라졌다. 한쪽은 챗봇으로서의 AI — 묻고 답하는 모양. 다른 쪽은 공동 작업자로서의 AI — 자기 파일을 만들고, 자기 도구를 호출하고, 자기 작업물을 검증한다. Open Design은 두 번째 갈래의 모범 사례를 디자인 도메인에 박았다.
핵심은 "에이전트가 진짜 컴퓨터를 쓴다"는 환상이 환상이 아니라는 것. 데몬이 cwd를 잡아 주고 SQLite로 영속화하면, 에이전트는 "이 프로젝트의 brand-spec.md"를 진짜로 갖는다. 다음 턴에 다시 읽고 수정할 수 있다. 이게 챗봇과 동료의 차이다.
5년 전엔 SaaS 모델 락인이 표준이었다. 2026년 현재, 진지한 도구는 BYOK가 기본이 되어 가고 있다. Open Design은 16개 CLI를 자동 감지하고, 추가로 4개 provider proxy를 지원한다. 이 trend의 의미는 단순하다 — 고객이 모델·가격·법적 위치를 스스로 선택한다. 한국 기업이 데이터 거버넌스 때문에 Anthropic 클라우드를 못 쓰는 경우에도, 같은 워크플로우를 사내 vLLM에 올린 Llama 4-90B로 동일하게 굴릴 수 있다.
App Store 모델은 검토·배포·인증의 비용을 운영자에게 몰아 줬다. Skills 모델은 **git clone**이다. 폴더 하나가 능력 하나. 누군가 자기 회사 톤에 맞춘 email-marketing 스킬을 GitHub에 올리면 다른 회사가 fork해서 그대로 쓴다. Open Design의 로드맵 중 od skills install <github-repo>가 들어 있다 — 마켓플레이스 SDK 없이 GitHub 자체가 마켓플레이스가 된다.
이 부분이 제일 자주 묻는 질문이다. Open Design을 쓰면 "디자이너가 필요 없어지나?"
정반대다. 시니어 디자이너의 일이 더 중요해진다.
DESIGN.md + brand-spec.md + references/checklist.md가 곧 그 디자이너의 증폭 장치가 된다.설치는 진짜로 3줄이다.
git clone https://github.com/nexu-io/open-design.git
cd open-design && pnpm install
pnpm tools-dev run web
또는 Docker:
git clone https://github.com/nexu-io/open-design.git
cd open-design/deploy && docker compose up -d
# http://localhost:7456
또는 데스크탑 앱(빌드 없이): open-design.ai — macOS Apple Silicon, Windows x64 빌드 제공.
첫 부팅 시 데몬이 자동으로:
PATH에서 16개 CLI 중 발견된 것을 잡고.od/ 폴더 생성 (SQLite + projects + artifacts)프롬프트 한 줄, Send, 질문 폼 등장, todo 카드 스트림, 아티팩트 렌더. 끝.
2026년 봄, Open Design이 보여 준 건 두 가지다.
첫째, 닫힌 제품이 보여 준 패턴은 11일이면 오픈으로 재구성된다. 단, 그 패턴이 단단했을 때만. Claude Design은 단단했다 — "산문이 아니라 산출물", "디시플린을 프롬프트로 박는다", "샌드박스 iframe", "스킬 = 파일". 이 네 가지가 분명해서 Open Design은 11일에 38k 별을 모았다.
둘째, 2026년의 좋은 AI 제품은 더 이상 모델을 가두지 않는다. 그 자리에 데몬·스킬·디자인 시스템 같은 '스킬화 가능한 디시플린 레이어'가 들어선다. 모델은 갈아 끼울 수 있는 부품이고, 진짜 IP는 그 위에 얹은 검증 가능한 디시플린이다.
핵심 질문 하나로 마무리. 당신의 시니어 디자이너가 머릿속으로만 들고 있는 그 체크리스트가, 만약 한 줄짜리 마크다운 파일이 된다면 — 그 사람은 회사에서 몇 배의 영향력을 갖게 될까? 그 답이 이 카테고리의 미래다.
nexu-io/open-design — 본문에서 다룬 저장소. 5월 12일 기준 38,092 stars · 4,329 forksSKILL.md 원본 사양alchaincyf/huashu-design — Junior-Designer 워크플로우, 5단계 브랜드 프로토콜, 5차원 셀프 크리틱, anti-AI-slop의 원전op7418/guizang-ppt-skill — magazine-style deck의 P0/P1/P2 체크리스트 문화OpenCoworkAI/open-codesign — Open Design의 가장 가까운 동료. 스트리밍 아티팩트 루프, 샌드박스 iframe 프리뷰 패턴VoltAgent/awesome-design-md — 9-섹션 DESIGN.md 스키마multica-ai/multica — 데몬+어댑터 아키텍처, PATH-스캔 에이전트 감지heygen-com/hyperframes — HTML→MP4 모션 그래픽 프레임워크