Owl-Listener/designer-skills
Designer Skills Collection: agentic skills, commands, and plugins for design — from research to systems, UI, interaction, and delivery.
Owl-Listener / designer-skills – AI 코딩 보조 도구를 위한 디자인 실무 플러그인
무엇인가요
- Claude Code 및 Gemini CLI 와 같은 AI 에이전트에게 273개의 디자인 관련 "스킬"(지식 단위)과 76개의 "명령어"(사전 구축된 워크플로우)를 노출하는 플러그인 모음입니다.
- 리포지토리는 디자인 실무 컬렉션(연구, 전략, UI, 인터랙션, 디자인 시스템, 프로토타이핑, 운영, 툴킷, 시각적 리뷰 포함 9개 플러그인)을 보유하고 있습니다. 보조 컬렉션 4개(인공지능 제품 디자인, UX 프로그램 관리, 디자인 리더십, 포괄적 디자인)는 별도의 리포지토리에 있으며 동일한 방식으로 추가할 수 있습니다.
왜 중요한가요
- 현대의 AI 에이전트는 코드를 실행할 수 있지만, 인간 디자이너가 사용하는 세밀하고 단계적인 디자인 지식은 부족합니다. 이 리포지토리는 이러한 지식을 분리 가능하고 기계가 읽을 수 있는 "스킬"로 정의하고, 에이전트가 직접 호출할 수 있는 명령어로 묶습니다.
- 플러그인을 설치하면 AI 어시스턴트가 사용자가 기초 프롬프트나 스크립트를 작성할 필요 없이 완전한 디자인 워크플로우를 실행할 수 있습니다(예: 사용자 연구 발견 주기 실행, 색상 팔레트 생성, 디자인 시스템 감사, 개발자용 패키지 생성).
시작 방법 (코드 없이 가능)
- Claude Code (Anthropic의 무료 앱)를 설치하고 열어 로그인합니다.
- Claude Code에서 다음을 입력합니다:
– 이 명령어로 리포지토리를 플러그인 소스로 등록합니다./plugin marketplace add Owl-Listener/designer-skills /plugin을 입력하고 Discover 탭을 열어 원하는 컬렉션(예:design-research,ui-design)을 체크한 후 Enter를 누릅니다.- 명령어를 실행합니다. 예시:
– Claude는 제품 설명을 요청한 후, 페르소나, 공감 맵, 여정 맵을 출력합니다./design-research:discover
Gemini CLI 사용 방법
git clone https://github.com/Owl-Listener/designer-skills /tmp/designer-skills
mkdir -p .gemini/extensions
cp -r /tmp/designer-skills/.gemini/extensions/. .gemini/extensions/
이 후 Gemini CLI에서도 동일한 /plugin … 명령어를 사용할 수 있습니다.
주요 플러그인 및 예시 명령어
| 플러그인 | 핵심 초점 | 예시 명령어 |
|---|---|---|
design-research |
사용자 연구 방법 | /design-research:discover – 페르소나, 공감 맵, 여정 맵 실행 |
ux-strategy |
제품 수준 전략 | /ux-strategy:frame-problem – 모호한 디자인 과제 구조화 |
ui-design |
시각적 UI 생성 | /ui-design:color-palette – 완전한 색상 시스템 구축 |
interaction-design |
인터랙션 흐름 | /interaction-design:design-onboarding – 첫 실행 경험 설계 |
design-systems |
시스템 라이브러리 | /design-systems:create-component – 컴포넌트 사양 템플릿 생성 |
design-ops |
배포 및 인수인계 | /design-ops:handoff – 개발자용 패키지 생성 |
designer-toolkit |
보조 자산 | /designer-toolkit:start-here – 다음 유용한 명령어로 안내 |
visual-critique |
시각적 감사 | /visual-critique:critique-screen – 우선순위 정렬된 수정 목록 반환 |
prototyping-testing |
검증 | /prototyping-testing:experiment – A/B 테스트 정의 |
일반적인 사용 흐름
- 신제품 →
design-research:discover→ux-strategy:frame-problem→ui-design:design-screen→interaction-design:design-interaction→design-systems:create-component→design-ops:handoff. - 기존 제품 감사 →
visual-critique:critique-screen→prototyping-testing:evaluate→design-ops:handoff. - 특정 산출물 (예: 색상 팔레트) →
ui-design만 설치하고/ui-design:color-palette실행.
누가 사용해야 하나요
- Claude Code 또는 Gemini CLI를 사용해 반복적인 디자인 작업을 자동화하고 싶은 디자이너.
- AI 보조 디자인 워크플로우를 구축하는 제품 팀.
- 내장된 디자인 지식이 필요한 고수준 에이전트를 개발하는 사람.
기여 및 커뮤니티
- 9개의 플러그인 모두 이 리포지토리에 포함되어 있으며, 스킬 정의나 플러그인 매니페스트 수정은 풀 리퀘스트로 기여 가능합니다.
- 보조 컬렉션은 별도 리포지토리에서 관리되며, 동일한 프로세스로 기여 가능합니다.
- 버그 보고나 새로운 스킬 요청은 Issues를 통해 제안하는 것을 권장합니다.
라이선스
- MIT – 자유롭게 사용, 수정, 재배포 가능.
이 리포지토리는 단순한 컬렉션이나 튜토리얼이 아니라, 실제 작동 가능한 AI 에이전트 대응 디자인 플러그인 세트입니다.
관련
- 프로젝트
- 프로젝트
- 프로젝트
- 프로젝트
- 프로젝트