Daangn Seed Ai

daangn-seed-ai

AI-first snapshot of daangn/seed-design, packaged as a Claude Code plugin.

Claude를 이용해서 앱을 디자인할 때, generic AI-slop을 뱉지 않도록. 당근의 [Seed Design System](https://github.com/daangn/seed-design) 기반의 토큰·컴포넌트·결정 매트릭스를 활용하여 디자인할 수 있도록 안내해요.

*AI-slop: AI가 반복적으로 뱉는 뻔한 UI 패턴*

한눈에 보기

원본 — 직접 작성한 랜딩	daangn-seed-ai 적용 후

같은 Bridge Studio 서비스 리스트예요. 왼쪽은 직접 작성한 랜딩, 오른쪽은 `/daangn-seed-ai:seed 랜딩 페이지를 리디자인해줘` 한 줄로 나온 결과고요.

`ActionButton`·`List`·`Badge` 조합과 브랜드 컬러가 자연스럽게 잡혀요.

왜 필요할까요?

Seed 공식 문서와 공식 `seed-design` 스킬은 훌륭하지만 Claude가 소비하기엔 한계가 있어요. 공식 문서는 여러 페이지를 왔다 갔다 해야 맥락이 잡히고 "언제 쓰지 말아야 하는지"가 잘 안 보여요. 공식 스킬은 `seed-design.io`의 llms.txt를 런타임에 WebFetch로 가져오는 구조라 upstream이 사라지면 동작을 멈추고요.

이 스킬은 Seed를 Claude의 소비 방식에 맞춰 재구조화한 **self-contained 스냅샷**이에요.

**핵심 차별점**

• decision-first — "어느 컴포넌트를 쓸지"가 제일 어려워요. decision-matrices/가 components/보다 먼저 참조되도록 설계했어요.
• self-contained — 모든 토큰·anatomy가 파일로 들어있어서 seed-design.io가 private이 돼도 동작해요.

**품질을 받치는 것들**

• anti-patterns 일급 — "이렇게 쓰지 마세요"가 AI-slop을 더 잘 막아줘요. generic AI가 반복하는 실수 13종을 grep 가능한 형태로 정리했어요.
• structured data > 산문 — slot/variant/state/token을 테이블로 정리했어요. Claude는 테이블을 더 정확히 소비해요.
• 한국어 UX 내장 — maxGraphemeCount, Seed의 한국어 line-height 등 한국어 기준 세팅이 반영돼 있어요.

설치

Claude Code 플러그인으로 배포돼요. `/plugin` 명령을 지원하는 버전이 필요해요.

1) 마켓플레이스 등록 + 플러그인 설치 (권장)

Claude Code에서 아래 두 줄을 실행해 주세요.

/plugin marketplace add byunghun-ben/daangn-seed-ai
/plugin install daangn-seed-ai@daangn-seed-ai

설치 후 `/reload-plugins`를 하거나 Claude Code를 재시작하면 돼요. 스킬은 `/daangn-seed-ai:seed`라는 이름으로 나타나고, description 기반 자동 로드도 같이 동작해요.

2) 로컬 체크아웃으로 테스트

개발·개조용이에요. 레포를