Claude Code를 활용한 디자인 | 배워두면 좋은 3가지 워크플로우

영상 흐름

1. 0100:00

   미리보기: 디자인 작업과 관련 업무

   Claude Code는 디자인 작업과 관련 업무를 모두 지원합니다. 세 가지 실용적인 워크플로는 페르소나 기반 피드백, 디자인 다양성, 접근성 핸드오프에 중점을 둡니다.

2. 0200:18

   재사용 가능한 페르소나 검토 스킬 만들기

   페르소나 문서와 여정 지도를 자료로 삼아, 페르소나의 목표, 지식, 행동, 제약에 따라 UX 흐름을 점검하고 근거에 기반해 개선 사항의 우선순위를 정하며 사용자 테스트를 했다고 주장하지 않고 가정을 표시하는 스킬을 만들 수 있습니다. Claude Code는 로컬에서 실행 중인 프로토타입을 탐색하고 스킬을 적용해 우선순위가 정해진 감사를 생성할 수 있습니다. 이 피드백은 사용자를 쉽게 만날 수 없을 때 문제를 드러내기 위한 것이며, 사용자 피드백을 대체하지 않습니다.

   Claude CodePersona review skillPersona documentsJourney map
3. 0303:14

   서로 다른 위젯 콘셉트를 요청한 뒤 검토하기

   전체 너비의 순자산 위젯을 위해 서로 다른 스타일과 데이터 형식으로 고품질 변형안 7~8개를 요청하는 프롬프트를 사용하면 계좌 표, 목표 진행률, 자산 배분 지도 등 각기 다른 구성이 나옵니다. Claude Code의 디자인 스킬이 위젯을 생성합니다. 콘셉트를 페이지로 확장하거나 근거, 장점, 한계, 절충안을 더 상세히 주석으로 작성한 뒤 페르소나 스킬로 검토할 수 있습니다. 변형 프롬프트는 데이터 구조가 같은 디자인만 반복되는 것을 방지하고, 페르소나 감사는 우선순위가 정해진 검토를 제공합니다.

   Claude CodeDesign skillPersona review skillClaude
4. 0406:51

   접근성 핸드오프 보고서 만들기

   접근성 검토 스킬은 우선순위가 지정된 문제와 요소 이름 같은 세부 정보를 포함해 개발자용 탭 순서 및 읽기 순서 보고서를 생성합니다. 복잡한 대시보드는 세심한 QA가 필요할 수 있으며, 이 예시에는 15분이 걸렸습니다. 보고서는 Claude Code 대시보드에 이미 설정된 순서를 바탕으로 작성하거나, 순서가 정해지지 않은 디자인에 대해 새로 제시할 수 있습니다. 접근성 스킬은 이 결과물을 만드는 데 도움을 줄 수 있지만, 리서치 종합과 UX 카피에는 각각 별도의 디자인 프로세스와 판단이 필요합니다.

   Accessibility review skillClaude CodeClaude design plugin