안티 슬롭 엔진 — Open Design은 어떻게 즉흥적으로가 아니라 시니어처럼 디자인하는가
Open Design이 천편일률적인 AI 슬롭을 만들어내지 않게 하는 메커니즘을 깊이 들여다본다 — 6단계 품질 방어선(디스커버리 폼, 브랜드 추출, 자기 비평, 체크리스트, 블랙리스트, 정직한 플레이스홀더)과 이미 가지고 있는 에이전트를 어떻게 오케스트레이션하는지. AI Teaches Better의 해설을 기반으로 한다.
대부분의 AI 디자인 도구는 천편일률적이고 이상하게 보라색 그라데이션투성이인 엉망을 뱉어낸다. 이 가이드가 설명하는 것은 Open Design이 그렇게 하지 않도록 만드는 메커니즘 — 에이전트가 즉흥적으로 굴지 않고 시니어 디자이너처럼 행동하도록 강제하는 다층 품질 시스템이다. AI Teaches Better가 그들의 워크스루에서 제시한 해설을 따르되, 현재 릴리스에 맞춰 다시 쓰고 갱신했다. 위의 영상을 보거나, 글로 된 버전을 계속 읽어보라.
플러그인 라이브러리: 레지스트리에서 바로 스킬을 설치하라 — 안티 슬롭 디자인 스킬도 포함된다.
Open Design이란?
Open Design은 Apache-2.0, 로컬 우선 프레임워크다 — 단일 모델에 묶인 폐쇄적이고 클라우드 전용인 디자인 도구에 대한 오픈소스의 답이다. 핵심적인 차이는: 자체 AI 에이전트를 함께 제공하지 않는다는 것. 그것은 능숙한 오케스트레이터로서, 디자인 작업을 이미 가지고 있는 코딩 에이전트 CLI에 위임한다. 부팅하면 로컬 데몬이 기기를 스캔해 CLI를 자동 감지한다 — Claude Code, Codex, Cursor, Gemini, Copilot 등 — 그리고 찾아낸 것을 후보 디자인 엔진으로 바꿔 stdio로 연결한다. 벤더 종속 없음; 클릭 한 번으로 엔진을 교체. CLI가 하나도 설치되어 있지 않은가? OpenAI 호환 프록시 폴백이 있다 — 아무 base URL과 키를 넣기만 하면 된다.
스킬 × 디자인 시스템 = 의도가 담긴 산출물
두 개의 라이브러리가 무거운 일을 도맡는다:
- 조합 가능한 스킬 — 산출물의 구조적 DNA를 에이전트에게 알려주는 폴더들: SaaS 랜딩 페이지, 데이터 대시보드, PM 사양서, 멀티스크린 모바일 앱. 스킬을 하나 고르면, 그것이 어떻게 만들어져야 하는지 이미 알고 있다.
- 브랜드급 디자인 시스템 — 톱 브랜드(Linear, Stripe, Vercel, Apple, Notion)에서 끌어낸 결정론적 디자인 규칙. 구조 × 스타일이 곱해져, 능력과 외형의 조합으로 이루어진 거대한 공간으로 펼쳐진다. 모두 당신의 기기에서 네이티브로 실행된다.
특정 브랜드가 떠오르지 않는가? 엄선된 비주얼 방향성(Editorial Monocle, Modern Minimal, Tech Utility, Brutalist, Soft Warm)으로 폴백하여 결정론적인 OKLCH 팔레트와 폰트 스택을 고정한다 — AI가 분위기를 즉흥적으로 정할 능력을 제거하는 것이다.
플러그인 허브: 레지스트리를 둘러보고, 플러그인을 가져오며, 팀을 위해 준비하라.
안티 슬롭 엔진(여섯 개의 층)
이것이 핵심이다. 당신이 어떤 산출물을 보기 전에, Open Design은 AI Teaches Better가 명확하게 제시하는 6단계 방어선을 실행한다:
- 디스커버리 폼 — 단 한 픽셀을 그리기 전에, 톤·청중·브랜드에 대해 물어 방향을 고정한다.
- 브랜드 추출 — URL을 주면, 브랜드 사양을 체계적으로 추출한다.
- 조용한 자기 비평 — 산출물을 드러내기 전에, 자신의 작업에 대해 5차원 비평을 실행한다.
- P0–P2 체크리스트 — 산출물은 엄격한 우선순위 체크리스트를 통과해야 한다.
- 하드코딩된 블랙리스트 — 천편일률적인 그라데이션과 그 이상한 왼쪽 테두리 둥근 카드는 말 그대로 금지되어 있다.
- 정직한 플레이스홀더 — 지어낸 “10배 더 빠름” 같은 가짜 지표 대신 회색 블록을 쓴다.
그 본질을 포착하는 표현은 이렇다: “그것은 무언가를 디자인하려는 AI가 아니다 — 그것은 시니어 디자이너처럼 행동하도록 훈련된 AI다.” 프롬프트 스택에 더해진 깊은 파일시스템 통합이야말로 산출물을 끌어올리고, 모두가 질려버린 그 AI 냄새 나는 슬롭을 막아준다.
슬라이드 덱 모드: 덱 카테고리를 고르고 예시를 fork하여 출발점으로 삼으라.
UI를 넘어서: 로컬 크리에이티브 스튜디오
같은 채팅 화면이 풍부한 미디어도 구동한다 — 이미지 생성(GPT Image), 짧은 영화적 텍스트-투-비디오, hyperframes를 통한 모션 그래픽, 심지어 오디오까지 — 그리고 바로 복제할 수 있는 미디어 프롬프트 템플릿이 있어 빈 캔버스를 마주할 일이 결코 없다.
시작하기(세 단계)
git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable && pnpm install
pnpm tools-dev run web로컬 데몬이 부팅되어 당신의 CLI 에이전트를 자동 감지하고, SQLite 저장소를 자동으로 설정한다 — 복잡한 구성은 전혀 없다. 출력되는 로컬 URL을 열거나(포트는 동적이다 — 하드코딩하지 말 것), open-design.ai/download에서 데스크톱 앱을 받으라. 그 로컬 저장소 덕분에, 노트북을 닫아도 탭과 생성된 파일은 떠났을 때 그대로 정확히 남아 있다. Claude Design 내보내기 ZIP을 끌어다 넣고 로컬에서 계속 편집할 수도 있으며, 클릭하여 댓글을 다는 HTML 미리보기로 외과적 수정을 하거나, 클릭 한 번으로 Vercel에 배포할 수 있다.
팁: 반복 작업 중 API 속도 제한에 부딪혔는가? Open Design은 표준 환경 변수를 사용하므로, base URL을 OpenAI 호환 프록시로 향하게 하면 계속 진행할 수 있다.
팁
- 디스커버리 폼을 0단계로 여기라 — 그것은 안티 슬롭 엔진의 첫 번째 층이다.
- 실제 디자인 시스템에서 시작하라(또는 엄선된 방향성에서), 그래야 에이전트가 외형을 즉흥적으로 정하지 않는다.
- 자기 비평과 체크리스트가 돌게 하라 — 바로 그것이 당신이 보기 전에 슬롭을 잡아낸다.
- 작업별로 엔진을 교체하라 — 외형에는 강력한 모델을, 기능에는 다른 모델을; 클릭 한 번으로.
- 속도 제한에 부딪히면 프록시 base URL을 사용하라.
자주 묻는 질문
산출물이 AI가 만든 것처럼 보이는 것을 실제로 막는 것은 무엇인가? 6단계 엔진이다: 디스커버리 폼, 브랜드 추출, 5차원 자기 비평, P0–P2 체크리스트, 슬롭 패턴의 하드코딩된 블랙리스트, 그리고 가짜 지표 대신 정직한 플레이스홀더.
Open Design은 자체 모델을 포함하는가? 아니다 — 당신의 기기에 이미 있는 코딩 에이전트 CLI(또는 OpenAI 호환 프록시)를 오케스트레이션한다. 당신은 엔진을 가져오고, 그것은 디자인의 규율을 가져온다.
스킬과 디자인 시스템을 커스터마이즈할 수 있는가? 그렇다 — 둘 다 파일이다. 당신만의 스킬 폴더나 디자인 시스템을 추가하면 그것이 인식된다.
무료인가? 앱은 Apache-2.0 하에 오픈소스이며 로컬에서 실행하는 것은 무료다. 당신은 연결한 에이전트와 제공업체의 모델 및 미디어 사용분에 대해서만 지불한다.
이 글로 된 가이드는 AI Teaches Better의 해설을 기반으로 한다. 위의 전체 영상을 보고, 더 많은 AI 아키텍처 분석을 위해 AI Teaches Better를 구독하라.