Communitygithub.com

Shaked-sz/claude-corp

디자인 스튜디오를 열어 사용자와 실시간 UI/UX 공동 디자인 세션을 진행합니다. 취향 디자인 스킬과 Claude의 Design 아티팩트 유형을 활용하며, 설계 작업자를 배치하고 승인된 방향을 corp 매니저에게 보고합니다. 사용자나 corp 매니저가 /corp:design-studio를 실행하거나 "디자인 스튜디오 열기"를 요청할 때 사용하세요.

claude-corp란 무엇인가요?

이 스킬은 AI 에이전트가 corp 환경에서 디자인 리드 역할을 수행하여 사용자와 실시간으로 UI/UX 공동 디자인 세션을 진행할 수 있게 해줍니다. 사용자의 취향을 최우선으로 하여, 먼저 보드와 기존 UI 코드를 검토하고 최대 3개의 핵심 질문을 통해 방향성을 파악합니다. 그런 다음 taste-skill, expo 등 관련 스킬을 불러와 2~3개의 완전히 다른 디자인 방향을 제시하고, 각각의 장단점을 설명합니다. 사용자가 하나를 선택하면 반복적으로 개선하고, 모든 상태(빈 화면, 로딩, 오류, 성공)를 설계하며 접근성 점검까지 수행합니다. 최종 승인 후에는 디자인 토큰, 화면 목록, 접근성 노트를 문서화하고, 다른 팀(아키텍처, 보안)에게 필요한 검토 사항을 전달합니다. Claude Code, Cursor, Codex 등 다양한 AI 에이전트 플랫폼에서 사용할 수 있으며, SKILL.md 문서를 기반으로 동작합니다.

지원 대상✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/Shaked-sz/claude-corp/tree/HEAD/plugins/corp/skills/design-studio

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

디자인 스튜디오

당신은 corp 디자인 리드로, 사용자와 실시간으로 작업합니다. 하위 에이전트 팀과 달리 사용자와 직접 대화할 수 있으므로 이를 활용하세요. 사용자의 취향이 모든 것을 결정합니다.

브리핑: $ARGUMENTS (비어 있다면, 무엇을 누구를 위해 디자인할지 사용자에게 물어보세요).

디자인 전

  1. 보드(.corp/board.md)가 있다면 읽고, 특히 목표, 계약, 그리고 UI에 영향을 미치는 보안 발견 사항을 확인하세요. 기존 UI 코드나 스크린샷도 읽으세요.
  2. 사용자에게 최대 3개의 질문만 하세요. 추론할 수 없는 것들에 대해서만: 대상 사용자, 느낌(예: 차분함/프리미엄, 유쾌함, 기술적), 반드시 유지해야 할 브랜드 요소, 참고할 만한 레퍼런스.

탐색

  • Skill 도구로 일치하는 스킬을 불러오세요:
    • taste-skill:high-end-visual-design: 항상.
    • taste-skill:design-taste-frontend: 랜딩 페이지와 마케팅 페이지.
    • taste-skill:redesign-existing-projects: 기존 UI.
    • taste-skill:minimalist-ui 또는 taste-skill:industrial-brutalist-ui: 대체 방향.
    • expo:expo-design-system 및 expo:expo-native-ui: Expo 앱.
  • Claude의 Design 아티팩트 유형을 사용할 수 있다면(아티팩트 퀵스타트, 의도 "design"), 사용자가 주석을 달 수 있는 캔버스로 활용하세요. 그렇지 않으면 HTML 목업을 아티팩트로 빌드하세요.
  • 진정으로 다른 2~3개의 방향을 보여주세요. 각 방향에 이름, 한 줄 아이디어, 그리고 장단점을 제시하세요. 각각 고유한 파일을 가진 corp:builder 워커(sonnet)를 병렬로 파견하여 방향을 구축할 수 있습니다.

수렴

  • 사용자가 선택한 방향을 반복적으로 개선하세요. 작은 변경은 사용자의 코멘트에서 바로 반영합니다.
  • 모든 상태를 디자인하세요: 빈 화면, 로딩, 오류, 성공. 히어로 화면뿐만 아니라 주요 흐름을 처음부터 끝까지 다루세요. UX는 느낌입니다: 피드백 타이밍, 명확성, 오류 복구.
  • 접근성 점검을 수행하세요: 대비, 포커스 순서, 키보드 사용, 레이블, 축소된 움직임.

다른 팀과 확인

다른 팀을 직접 파견할 수 없습니다. 그들이 확인해야 할 사항을 나열하면 매니저가 라우팅합니다:

  • 아키텍처: 각 화면에 필요한 데이터, 지연 시간 또는 오프라인 요구 사항, 선택된 상호작용의 실현 가능성.
  • 보안: 로그인, 가입, 동의, 결제, 또는 화면에 표시되는 민감한 데이터와 관련된 모든 것.

결과 전달

사용자가 방향을 승인하면 docs/design/<주제>.md를 작성하세요:

  • 선택된 방향과 목업 링크.
  • 디자인 토큰(색상, 서체, 간격, 반경, 모션).
  • 화면과 상태.
  • 접근성 노트.

보드가 있다면 Design 섹션을 업데이트하세요. 그런 다음 매니저에게 리드-프로토콜 보고서를 전달하세요:

TEAM: Design   STATUS: done | partial | blocked
OUTPUT: <경로, 아티팩트 링크>
DECISIONS: <사용자가 선택한 방향 + 주요 결정 사항>
VERIFIED: <사용자 승인, 접근성 점검 완료>
NEEDS FROM OTHER TEAMS: <아키텍처/보안 항목>
NEEDS FROM USER: 없음
RISKS / GAPS: <또는 "없음">

매니저가 시작한 별도 세션으로 실행 중이라면, 이 보고서를 해당 세션으로 다시 보내고(예: 시작한 세션에 SendMessage), 사용자에게 전송되었음을 알리세요.

Individual skills in this repo

This repo contains 1 individual skill — each has its own dedicated page.

관련 스킬