본문 바로가기
AI 생성 글 정리/tech_github

Open Design — 로컬 코드 에이전트를 디자인 엔진으로 바꾸는 오픈소스 Design Agent Workbench

by Honbul 2026. 5. 21.


그림: Open Design의 핵심 포지셔닝. 사용자가 이미 설치한 로컬 코드 에이전트를 디자인 생성 엔진으로 사용한다는 점을 강조한다.

 

Open Design은 “자체 모델을 내장한 디자인 SaaS”라기보다, 브라우저 UI + 로컬 데몬 + 기존 코드 에이전트 CLI + 디자인 스킬/디자인 시스템 라이브러리를 결합한 에이전트 네이티브 디자인 워크벤치다. 사용자는 브리프를 입력하고, Open Design은 질문 폼과 방향 선택으로 요구사항을 정제한 뒤, 로컬 CLI 에이전트가 .od/projects/<id> 작업공간에서 HTML, React 프로토타입, 덱, 모바일 화면, 이미지/영상 프롬프트 등을 생성하도록 오케스트레이션한다.

 

분석 기준은 GitHub main 브랜치의 README, QUICKSTART.md, docs/architecture.md, docs/skills-protocol.md, docs/agent-adapters.md, 주요 소스 모듈, 공식 사이트, 릴리스 페이지, Discussion이다. 저장소의 숫자 표기는 문서별로 차이가 있다. 예를 들어 README 상단은 0.8.0-preview와 16개 CLI, 31개 Skills, 72개 Design Systems를 말하지만, 일부 표와 공식 사이트는 더 큰 카탈로그 수를 제시한다. 따라서 본문에서는 “main README 기준”, “공식 사이트 기준”, “릴리스 기준”을 분리해서 해석한다.

Quick Links

구분 링크 메모
GitHub Repository https://github.com/nexu-io/open-design 소스 코드와 README, Issues, Discussions
공식 사이트 https://open-design.ai/ 제품 소개, 데스크톱 다운로드, 기능 요약
Latest Release https://github.com/nexu-io/open-design/releases/latest 최신 안정 릴리스는 open-design-v0.7.0로 확인됨
0.8.0-preview Discussion https://github.com/nexu-io/open-design/discussions/1727 main에서 진행 중인 preview 방향: plugin-first, headless-first
Quickstart https://github.com/nexu-io/open-design/blob/main/QUICKSTART.md Docker 및 source run 커맨드
Architecture Docs https://github.com/nexu-io/open-design/blob/main/docs/architecture.md 로컬/웹/직접 API 배포 구조와 데이터 흐름
Skills Protocol https://github.com/nexu-io/open-design/blob/main/docs/skills-protocol.md SKILL.md, DESIGN.md, od frontmatter 확장 규칙
Agent Adapters https://github.com/nexu-io/open-design/blob/main/docs/agent-adapters.md 기존 CLI 에이전트를 Open Design 런타임에 연결하는 방식
논문 확인된 공식 논문 없음 README와 공식 문서 기준으로는 별도 academic paper 링크가 확인되지 않음

프로젝트 한 줄 요약

Open Design은 Claude Code, Codex, Cursor Agent, Gemini CLI, OpenCode, Qwen 등 사용자의 로컬 코드 에이전트를 감지하고, 디자인 스킬과 디자인 시스템 컨텍스트를 주입해 웹/모바일 프로토타입, 덱, 이미지/영상 산출물을 생성·미리보기·내보내기까지 연결하는 local-first AI design workbench다.

Key Features

1. 기존 코드 에이전트 CLI를 디자인 엔진으로 재사용

Open Design의 가장 중요한 설계 선택은 “새로운 agent loop를 직접 구현하지 않는다”는 점이다. 데몬은 사용자의 PATH와 설정 파일을 탐색해 Claude Code, Codex, Cursor Agent, Gemini CLI, OpenCode, Qwen 등 여러 CLI 런타임을 감지하고, 선택된 에이전트에 브리프·스킬·디자인 시스템·작업 디렉터리를 넘긴다. CLI가 없는 경우에는 OpenAI-compatible BYOK 프록시로 비슷한 루프를 구성한다.


그림: 시작 화면은 사용자가 만들 산출물 유형, 적용할 디자인 시스템, 생성 브리프를 한 흐름에서 선택하도록 구성되어 있다.

 

이 구조는 모델 공급자 종속을 줄이고, 사용자가 이미 보유한 에이전트·API 키·로컬 개발 환경을 디자인 생성 루프에 재사용하게 만든다. 즉 Open Design은 “디자인 모델”이라기보다 에이전트용 디자인 작업대에 가깝다.

2. 질문 폼으로 첫 프롬프트의 모호성을 줄임

생성형 UI 도구의 실패 패턴 중 하나는 첫 턴에서 요구사항이 너무 느슨해 결과물이 흔들리는 것이다. Open Design은 브리프 이후 질문 폼을 통해 대상 사용자, 화면 목적, 톤, 인터랙션 수준, 브랜드 감각 같은 결정을 구조화한다.


그림: 질문 폼은 사용자가 원하는 화면의 목적과 제약을 명시하게 만들어 에이전트가 바로 구현에 들어가기 전 요구사항을 안정화한다.

 

이 방식은 의료, 금융, B2B SaaS처럼 도메인 제약이 강한 UI에서 특히 의미가 있다. 에이전트가 “멋진 화면”을 추측하는 대신, 검증 가능한 제품 조건을 먼저 수집하게 만들 수 있기 때문이다.

3. 디자인 방향 선택으로 탐색과 수렴을 분리

Open Design은 하나의 결과를 즉시 고정하지 않고, 여러 visual direction을 제안한 뒤 사용자가 방향을 선택하게 한다. 이는 에이전트가 코드를 쓰기 전에 콘셉트 수준에서 탐색 공간을 좁히는 절차다.


그림: 방향 선택 단계는 “어떤 미감으로 갈 것인가”를 먼저 고정해 이후 구현 단계의 스타일 drift를 줄인다.

 

이 기능은 디자인 시스템과 결합될 때 더 강해진다. 사용자는 Neutral Modern, Warm Editorial, 브랜드형 시스템 등 특정

DESIGN.md를 선택하고, 에이전트는 해당 토큰·컴포넌트·톤 규칙을 기준으로 산출물을 만든다.

4. 실시간 Todo와 이벤트 스트림으로 에이전트 진행 상태를 노출

에이전트가 긴 작업을 수행할 때 사용자는 보통 “멈춘 것인지, 생각 중인지, 파일을 만들고 있는지” 알기 어렵다. Open Design은 실시간 Todo 진행 상태와 이벤트 스트림을 UI에 노출해 생성 흐름을 관찰 가능하게 만든다.


그림: 에이전트가 수행 중인 작업 단위가 Todo 형태로 표시되어 사용자는 생성 단계와 남은 작업을 추적할 수 있다.

 

기술적으로는 로컬 데몬이 에이전트 CLI를 프로젝트 작업 디렉터리에서 실행하고, stdout/stderr, tool event, file write를 파싱해 웹 UI에 전달하는 구조다. 사용자는 결과물이 완성되기 전에도 방향 오류를 발견하고 중단·수정할 수 있다.

5. 샌드박스 iframe 미리보기와 산출물 export

생성된 HTML/React 산출물은 브라우저에서 바로 확인된다. 문서 기준 preview renderer는 sandboxed iframe과 srcdoc 기반 렌더링을 사용하며, JSX가 필요한 경우 React+Babel 경로로 렌더링한다.


그림: 생성된 산출물은 채팅 옆의 샌드박스 미리보기 영역에서 즉시 확인된다. 디자인 생성과 검토가 한 화면 안에서 이어진다.

 

공식 사이트와 문서에서는 HTML, PDF, PPTX, ZIP, Markdown export 흐름을 강조한다. 프로토타입뿐 아니라 프레젠테이션 덱이나 보고서형 산출물까지 포괄하려는 방향이다.

6. DESIGN.md 기반 디자인 시스템 라이브러리

Open Design의 디자인 시스템은 단순 테마 프리셋이 아니라 DESIGN.md 파일과 관련 자산으로 구성된다. 데몬의 design-system registry는 /design-systems/* 아래의 manifest 또는 legacy DESIGN.md를 스캔하고, 제목·카테고리·요약·색상 swatch·토큰·컴포넌트 참조를 추출한다.


그림: 디자인 시스템 라이브러리는 브랜드형 스타일, 토큰, 컴포넌트 규칙을 선택 가능한 컨텍스트로 제공한다.

 

이 접근은 “디자인 시스템을 코드 에이전트가 읽을 수 있는 Markdown 계약”으로 바꾼다는 점에서 흥미롭다. Figma 라이브러리와 달리, 에이전트가 직접 읽고 프롬프트 컨텍스트에 삽입할 수 있다.

7. SKILL.md 기반 산출물별 생성 능력

Skills는 특정 산출물 유형을 생성하기 위한 capability bundle이다. 각 skill 폴더는 SKILL.md, assets/, references/를 가질 수 있고, Open Design은 od frontmatter 확장으로 mode, preview, required design system section, inputs, outputs, capabilities를 해석한다.


그림: deck skill 예시는 프레젠테이션·매거진형 산출물을 생성하는 방향을 보여준다.


그림: mobile prototype 예시는 모바일 화면 생성과 기기 프레임 기반 프리뷰가 Open Design의 주요 사용 사례임을 보여준다.

 

docs/skills-protocol.md 기준 skill type은 prototype, deck, template, design-system 등으로 구분된다. README에는 이미지, 비디오, 오디오, HyperFrames까지 확장되는 prompt stack도 언급된다. 0.8.0-preview Discussion에서는 “everything is a plugin” 방향으로 전환한다고 설명하므로, 안정 버전의 skill-first 구조가 preview 브랜치에서는 plugin registry 중심으로 재편되는 중으로 볼 수 있다.

8. 다양한 디자인 스킬 쇼케이스

README의 skill showcase는 Open Design이 단일 landing page 생성기가 아니라, 여러 산출물 표면을 다루려는 프로젝트임을 보여준다.


그림: Dating web 예시는 소비자 앱 랜딩/서비스 화면을 생성하는 스킬의 시각적 결과를 보여준다.


그림: Digital e-guide 예시는 문서형·가이드형 콘텐츠를 시각적으로 구조화하는 스킬을 보여준다.


그림: Email marketing 예시는 마케팅 캠페인용 이메일 레이아웃 생성 가능성을 보여준다.


그림: Gamified app 예시는 게임화된 모바일/웹 앱 인터페이스 생성 방향을 보여준다.


그림: Mobile onboarding 예시는 신규 사용자 여정을 단계별 화면으로 설계하는 데 활용될 수 있다.


그림: Motion frames 예시는 영상·애니메이션 산출물을 만들기 위한 프레임 기반 기획을 보여준다.


그림: Social carousel 예시는 소셜 미디어 게시물 묶음을 일정한 시각 시스템으로 생성하는 흐름을 보여준다.


그림: Sprite animation 예시는 정적 화면을 넘어 애니메이션 자산 설계까지 확장되는 사용 사례를 보여준다.

Tech Stack

영역 확인된 기술
Monorepo pnpm-workspace.yaml 기준 apps/*, packages/*, tools/*, e2e
Runtime Node.js ~24, pnpm 10.33.x 계열
Language TypeScript 5.9.3 중심
Web App Next.js 16.2.6, React 18.3.1, ReactDOM 18.3.1, TailwindCSS 4.3.0, PostCSS 8.5.14, lucide-react, PostHog JS
Daemon Express 4.22.1, better-sqlite3 12.10.0, chokidar, multer, jszip, tar, undici, prom-client, OpenTelemetry API
AI Provider SDK OpenAI SDK 6.38.0, Anthropic SDK 0.32.1
Agent Layer Claude Code, Codex, Cursor Agent, Gemini CLI, OpenCode, Qwen 등 CLI adapter 방식
Storage .od/app.sqlite, .od/projects/<id>/, .od/artifacts/
Deployment Docker Compose, Vercel-compatible web layer, local daemon, desktop shell
License Apache-2.0

 

주목할 점은 Web과 Daemon의 역할 분리다. Web은 사용자 경험과 preview를 담당하고, Daemon은 로컬 파일 시스템 접근, 에이전트 실행, registry scan, SQLite persistence, BYOK proxy를 담당한다. 이 분리 덕분에 “웹 배포 + 로컬 데몬”이라는 하이브리드 토폴로지도 가능하다.

Architecture


그림: README와 docs/architecture.md, agent/skill/design-system 소스 모듈을 바탕으로 재구성한 Open Design 실행 구조. 저장소의 ASCII 다이어그램을 설명용 PNG로 재작성했다.

 

Open Design의 아키텍처는 크게 여섯 층으로 볼 수 있다.

1. Browser / Next.js Web UI

apps/web는 사용자의 브리프 입력, 질문 폼, 디자인 시스템 선택, artifact tree, chat stream, preview iframe을 담당한다. 사용자는 브라우저에서 작업하지만, 실제 파일 쓰기와 에이전트 실행은 로컬 데몬 경계를 넘어간 뒤 수행된다.

2. Local Daemon

apps/daemon은 Open Design의 핵심 실행 계층이다. Express 기반 API routes를 제공하고, SQLite에 프로젝트·대화·메시지·탭 상태를 저장하며, 에이전트 감지, skill registry, design-system registry, import/export, BYOK proxy를 담당한다. 주요 API 흐름은 /api/agents, /api/skills, /api/design-systems, /api/chat, /api/projects, /api/proxy/... 형태로 해석된다.

3. Agent Adapter Layer

docs/agent-adapters.md의 핵심은 Open Design이 자체 agent loop를 새로 만들지 않고 기존 CLI에게 루프를 위임한다는 점이다. Adapter는 에이전트를 감지하고, prompt stack과 작업 디렉터리를 넘기며, 출력과 tool event를 정규화해 UI에 전달한다. 이 방식은 빠른 확장성을 주지만, 각 CLI의 출력 형식·권한 모델·업데이트 변화에 민감하다는 단점도 있다.

4. Prompt Asset Layer: Skills, Design Systems, Craft

Skills는 “무엇을 만들 것인가”를 정의하고, Design Systems는 “어떤 미감과 규칙으로 만들 것인가”를 정의한다. Craft 문서와 prompt templates는 산출물의 품질 기준과 반복 패턴을 보강한다. 이 레이어가 존재하기 때문에 Open Design은 일반 코드 에이전트를 디자인 특화 에이전트처럼 행동하게 만들 수 있다.

5. Local Workspace and Persistence

Quickstart 문서 기준 런타임 데이터는 .od/ 아래에 생성된다. 주요 구성은 다음과 같다.

.od/
├── app.sqlite            # projects / conversations / messages / tabs
├── artifacts/            # Save to disk 산출물
└── projects/<id>/        # 프로젝트별 에이전트 cwd 및 생성 파일

 

에이전트는 프로젝트별 작업 디렉터리에서 파일을 만들고, Web UI는 이 파일을 preview/export 대상으로 삼는다. local-first 구조는 민감 데이터가 포함될 수 있는 작업에서 장점이지만, 실제 운영 환경에서는 접근 제어, 로그 정책, provider 호출 정책을 별도로 설계해야 한다.

6. Preview and Export

Preview renderer는 sandboxed iframe으로 HTML을 보여주며, React/JSX 산출물은 문서 기준 React+Babel 경로를 사용한다. Export는 HTML, PDF, PPTX, ZIP, Markdown 등으로 확장된다. 즉 Open Design은 “생성 결과를 보는 화면”뿐 아니라 “산출물을 외부 워크플로로 넘기는 통로”까지 포함한다.

Source Code Structure

저장소 구조는 Open Design이 단순 프론트엔드 프로젝트가 아니라, 에이전트 런타임과 디자인 자산 카탈로그를 포함한 대형 monorepo임을 보여준다.

open-design/
├── apps/
│   ├── web/              # Next.js + React 클라이언트
│   ├── daemon/           # Express daemon, agent routes, registry, storage, proxy
│   ├── desktop/          # desktop shell 관련 코드
│   ├── packaged/         # 패키징된 앱 흐름
│   ├── landing-page/     # 공식 사이트/랜딩 관련 코드
│   └── telemetry-worker/ # telemetry worker
├── packages/
│   ├── contracts/        # API/런타임 계약 타입
│   ├── platform/         # 플랫폼 공통 계층
│   ├── plugin-runtime/   # preview/plugin 방향 런타임
│   ├── registry-protocol/# registry protocol
│   └── sidecar*/         # sidecar protocol/runtime
├── skills/               # SKILL.md 기반 capability bundles
├── design-systems/       # DESIGN.md 기반 디자인 시스템 카탈로그
├── craft/                # 산출물 품질 규칙과 craft references
├── prompt-templates/     # 이미지/영상/HyperFrames 등 prompt template
├── docs/                 # architecture, protocol, reference docs
├── deploy/               # Docker/deployment assets
└── tools/                # tools-dev, packing, serving 등 개발 도구

 

소스 관점에서 특히 중요한 파일은 apps/daemon/src/skills.ts, apps/daemon/src/design-systems.ts, apps/daemon/src/chat-routes.ts, apps/daemon/src/agents.ts다. 이 파일들이 각각 skill discovery, design-system discovery, chat/proxy route, agent runtime registry를 담당한다.

Usage & Setup

Requirements

Node.js 24.x
pnpm 10.33.x
macOS / Linux / Windows
선택 사항: Claude Code, Codex, Cursor Agent, Gemini CLI, OpenCode 등 로컬 agent CLI

Docker로 실행

git clone https://github.com/nexu-io/open-design.git
cd open-design/deploy
docker compose up -d
# 브라우저에서 http://localhost:7456 접속

로그 확인과 종료는 다음처럼 수행한다.

docker compose logs -f
docker compose down

Source Run

git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable
corepack pnpm --version   # 10.33.x 확인
pnpm install
pnpm tools-dev run web    # daemon + web foreground 실행

Desktop shell과 관리형 sidecar를 함께 실행하려면 다음 커맨드를 사용한다.

pnpm tools-dev

0.8.0-preview Discussion에서는 preview 빌드 테스트 흐름으로 pnpm tools-dev를 권장한다. 안정 릴리스 사용자라면 GitHub Release 또는 공식 사이트의 데스크톱 패키지를 사용하는 편이 더 단순하다.

First Run에서 일어나는 일

  1. Open Design이 .od/ 런타임 폴더를 생성한다.
  2. 사용 가능한 agent CLI를 감지한다.
  3. 내장 skills와 design systems를 스캔한다.
  4. 사용자가 브리프를 입력하면 질문 폼과 방향 선택을 통해 컨텍스트를 확정한다.
  5. 데몬이 선택된 agent CLI를 프로젝트 cwd에서 실행한다.
  6. 생성 파일이 preview iframe과 export pipeline으로 연결된다.

본 리포트 작성 환경에서는 컨테이너 DNS 제한으로 전체 저장소 clone/build 실행은 수행하지 못했다. 대신 공개 GitHub 문서, raw 문서, 주요 소스 모듈, README 스크린샷 자산, Discussion, 릴리스 정보를 기준으로 정적 분석을 수행했다.

Discussion / Wiki / Release 관찰

  • Wiki: GitHub Wiki URL은 별도 문서 목록으로 이어지지 않고 저장소 메인 화면으로 돌아가는 형태라, 독립 Wiki 자료는 확인되지 않았다.
  • Discussion: 0.8.0-preview Discussion은 Open Design이 stable skill-first 구조에서 plugin-first/headless-first 구조로 이동 중임을 보여준다. 특히 “everything is a plugin”, “headless by default”라는 표현은 Open Design이 단순 앱에서 agent/design runtime 플랫폼으로 확장하려는 의도를 시사한다.
  • Release: 최신 안정 릴리스는 open-design-v0.7.0으로 확인된다. README main은 이미 0.8.0-preview 메시지를 앞세우므로, 실제 사용자는 release tag와 main branch 사이의 차이를 인식해야 한다.

Technical Assessment

강점

  1. Local-first 실행 구조: 에이전트 CLI와 파일 작업이 로컬에서 일어나므로, 사용자가 이미 구성한 개발 환경과 권한 모델을 재사용할 수 있다.
  2. 모델 비종속성: 특정 모델 API가 아니라 agent adapter와 BYOK proxy로 확장한다.
  3. 에이전트가 읽기 쉬운 디자인 자산: SKILL.md, DESIGN.md, craft 문서는 사람이 읽고 에이전트도 읽을 수 있는 계약이다.
  4. 프리뷰와 export의 즉시성: 생성된 산출물을 바로 확인하고 PDF/PPTX/ZIP 등으로 내보낼 수 있다.
  5. 확장 가능한 카탈로그 구조: design systems, skills, templates, prompt assets를 repo 단위로 추가할 수 있다.

위험 요소와 개선 여지

  1. 문서 수치의 불일치: Skills/Design Systems 수가 README, Quickstart, 공식 사이트, 배너 이미지 사이에서 다르게 보인다. 카탈로그 자동 집계 또는 badge 자동화를 도입하면 신뢰도가 올라간다.
  2. CLI adapter drift: 외부 CLI 출력 형식이나 권한 모델이 바뀌면 adapter가 깨질 수 있다.
  3. Skill 보안: Skill이 파일·reference·prompt를 포함하는 구조라면, 외부 skill import 시 서명, provenance, allowlist, sandbox가 필요하다.
  4. 민감 데이터 처리: local-first가 곧 compliance를 의미하지 않는다. 의료/금융 워크플로에서는 감사 로그, 접근 제어, 비식별화, provider 호출 차단 정책이 필요하다.
  5. 생성물 검증: preview는 시각 검토에는 좋지만, 접근성, 보안, 성능, 브라우저 호환성 검증은 별도 자동화가 필요하다.

Personal Insights

1. 의료 AI 관점

Open Design의 local-first 구조는 의료 AI 프로토타이핑에서 매력적이다. 예를 들어 임상의용 대시보드, 환자 교육 자료, triage workflow 화면, clinical trial recruitment UI를 빠르게 만들 수 있다. 특히 디자인 시스템을 병원 브랜드·접근성 기준·의료 용어 가이드와 결합하면, 일반 UI 생성 도구보다 도메인 일관성을 확보하기 쉽다.

다만 의료 데이터가 포함되는 순간 Open Design 자체만으로는 충분하지 않다. 실제 병원 환경에서는 다음이 추가로 필요하다.

  • PHI/PII 비식별화 및 민감 데이터 redaction
  • 외부 provider 호출 차단 또는 allowlist
  • audit logging과 role-based access control
  • 생성 화면의 medical claim 검증
  • WCAG 접근성 검증
  • 임상 의사결정 지원 도구로 쓰일 경우 규제 검토

즉 Open Design은 “의료 AI 앱을 바로 배포하는 도구”라기보다, 의료 도메인 UI와 워크플로를 빠르게 시각화하고 검증하는 local-first prototyping layer로 보는 것이 적절하다.

2. Bioinformatics 관점

Bioinformatics에서는 분석 결과를 연구자·임상의·데이터 엔지니어가 이해할 수 있는 형태로 바꾸는 일이 중요하다. Open Design의 skill/design-system 구조는 다음 사용 사례에 잘 맞는다.

  • RNA-seq QC 결과 대시보드 프로토타입
  • single-cell analysis workflow 설명용 인터랙티브 리포트
  • variant annotation 결과를 임상의가 읽기 쉬운 카드 UI로 변환
  • Nextflow/Snakemake pipeline run summary 생성
  • 실험실 내부 SOP, 데이터 lineage, runbook을 deck 또는 웹 문서로 생성

핵심은 과학적 결론을 에이전트가 대신 내리게 하는 것이 아니라, 이미 검증된 분석 결과를 가독성 높은 인터페이스와 보고서로 번역하게 하는 것이다. 이를 위해서는 산출물에 dataset ID, pipeline version, reference genome, parameter hash, validation status를 명시하는 bioinformatics 전용 skill이 필요하다.

3. Autonomous Agent 개발 관점

Open Design은 autonomous agent 제품을 설계하는 데 좋은 참고 사례다. 이유는 모델보다 주변 런타임이 더 중요하다는 점을 잘 보여주기 때문이다.

  • Agent adapter는 모델/CLI 실행을 추상화한다.
  • Skill registry는 task capability를 파일 기반으로 표현한다.
  • Design-system registry는 domain style/context를 계약화한다.
  • Local daemon은 권한 있는 파일 작업과 상태 저장을 담당한다.
  • Web UI는 사람이 개입할 수 있는 steering surface를 제공한다.

이 구조는 “에이전트가 알아서 다 한다”는 접근보다 현실적이다. 사람은 브리프, 질문 폼, 방향 선택, preview 검토, export 단계에서 계속 steering한다. Autonomous Agent 개발 관점에서는 Open Design이 full autonomy보다 controllable autonomy에 가까운 설계를 보여준다고 볼 수 있다.

 

0.8.0-preview의 plugin-first/headless-first 방향은 장기적으로 더 중요하다. Open Design이 UI 앱을 넘어 agent runtime으로 확장되려면 plugin signing, version pinning, permission manifest, registry governance, reproducible runs가 핵심 과제가 될 것이다.

결론

Open Design은 “오픈소스 Figma 대체제”라는 표현만으로는 부족하다. 더 정확히는 로컬 코드 에이전트를 디자인 산출물 생성기로 전환하는 agent-native orchestration layer다. Next.js UI, Express/SQLite daemon, CLI adapter, SKILL.md, DESIGN.md, sandbox preview, export pipeline이 결합되어 사용자의 로컬 개발 환경을 디자인 생성 환경으로 바꾼다.

 

프로젝트는 빠르게 움직이고 있어 main branch와 stable release 사이의 차이가 크다. 실사용자는 open-design-v0.7.0 안정 릴리스와 0.8.0-preview의 plugin-first 방향을 구분해 접근해야 한다. 기술적으로는 매우 유망하지만, 민감 데이터 도메인에 적용하려면 보안·검증·감사·권한 모델을 별도로 보강해야 한다.

참고한 공개 자료