디자이너가 아니어도 시안이 필요할 때가 있습니다. 한 장짜리 소개 자료, 랜딩 페이지 초안, 앱 화면 흐름 같은 것들입니다.
클로드 디자인(Claude Design)은 대화로 이런 시각 작업을 만드는 기능입니다. 말로 설명하면 옆 캔버스에 실제로 작동하는 디자인이 만들어집니다. 공식 안내를 기준으로 정리했습니다.

누가 쓸 수 있나
Pro, Max, 팀, 엔터프라이즈에서 베타로 제공됩니다. Pro, Max, 팀은 기본으로 켜져 있고, 엔터프라이즈는 소유자가 조직 설정의 Artifacts에서 켜야 합니다.
무엇을 만들 수 있나
- 디자인 시안과 목업
- 클릭해 볼 수 있는 인터랙티브 프로토타입
- 한 장짜리 소개 자료
- 랜딩 페이지
- 대시보드, 입력 폼, 내부 업무 도구 화면
시작하는 곳
| 어디서 | 어떻게 |
|---|---|
| 대화 | “이 제안서로 한 장짜리 자료 만들어 줘” 또는 Output → Design |
| Artifacts 탭 | Design 템플릿 선택 |
| 클로드 코드 | /design으로 만들기·수정·동기화 |
| 모바일 앱 | 요청과 보기만 가능(편집은 웹·데스크톱) |
| claude.ai/design | 기존 단독 화면도 계속 사용 가능 |
진행 흐름
- 대화, Artifacts 탭, claude.ai/design 중 한 곳에서 시작합니다
- 쓸 디자인 시스템을 첨부하거나 가져옵니다
- 스크린샷이나 코드처럼 참고할 맥락을 더합니다
- 만들고 싶은 것을 설명합니다
- 캔버스에 나온 결과를 확인합니다
- 대화, 댓글, 직접 편집으로 다듬습니다
- 만족하면 내보내거나 공유합니다
디자인 시스템부터 챙기기
조직의 디자인 시스템이 설정돼 있으면 새 프로젝트가 브랜드 색, 글꼴, 컴포넌트를 자동으로 물려받습니다. 따로 브랜드 자료를 올릴 필요가 없습니다.
깃허브 저장소, 디자인 파일, 직접 올린 자료, 로컬 코드에서 가져올 수 있습니다. 클로드는 실제 컴포넌트로 만들고, 결과를 디자인 시스템과 대조해 스스로 고친 뒤 보여 줍니다. 다만 공식 안내 표현대로 가져온 원본 품질만큼만 나옵니다. 정리 안 된 코드나 빠진 파일은 결과에 그대로 드러납니다.
요청 잘 쓰는 법
좋은 요청에는 네 가지가 들어갑니다. 목표(무엇을), 배치(어떻게 놓을지), 내용(무엇을 보여 줄지), 대상(누가 쓸지)입니다.
- “지역과 제품군으로 거를 수 있는 월간 매출 대시보드를 만들어 줘”
- “핵심 기능을 소개하는 4화면짜리 모바일 앱 온보딩을 디자인해 줘”
- “히어로 섹션, 코드 예시, 가격표가 있는 API 제품 랜딩 페이지를 만들어 줘”
- “분류에 따라 질문이 바뀌는 고객 의견 수집 폼을 만들어 줘”
대화, 댓글, 직접 편집 — 언제 무엇을
| 방법 | 맞는 경우 | 예 |
|---|---|---|
| 대화 | 전체 구조를 바꿀 때 | “색감을 어둡고 간결하게”, “배치 대안 2~3개 보여 줘” |
| 인라인 댓글 | 특정 부분만 고칠 때 | “이 버튼 여백 키워 줘”, “라디오 버튼 말고 드롭다운으로” |
| 직접 편집 | 빠른 시각 조정 | 끌기, 크기 조절, 정렬 |
댓글은 캔버스의 해당 위치를 눌러 남기므로, 대화로 위치를 설명하는 것보다 빠릅니다. 클로드에게 설계 이유를 설명하게 하거나, 접근성과 대비, 정보 위계를 검토해 달라고 할 수도 있습니다.
다른 방향도 시험해 보려면
지금 작업을 잃지 않고 새로운 방향을 보고 싶다면 “지금 것 저장하고 완전히 다른 방식으로 해 봐”라고 말하면 됩니다. 클로드가 현재 프로젝트를 저장하고 위치를 알려 줍니다. 공식 버전 기록 기능은 아직 없어서 이 방법이 사실상의 백업입니다.
내보내기와 공유
- zip, PDF, PPTX, 단독 HTML로 내보내기
- 구글 슬라이드 내보내기(claude.ai/design에서만)
- 캔바, 감마, 허브스팟, 미로, 넷리파이, 버셀, 윅스 등 다른 도구로 보내기
- 클로드 코드로 넘겨 실제 개발 이어가기
디자인은 기본적으로 나만 볼 수 있습니다. 공유 버튼으로 보기, 댓글, 편집 권한을 골라 공유합니다.
사용량
디자인 작업도 클로드 코드를 포함한 같은 사용량 한도에서 차감됩니다. 예전에는 디자인만의 주간 한도가 따로 있었지만 지금은 통합됐습니다. 코드가 큰 프로젝트나 수정을 많이 반복하면 더 많이 씁니다.
베타 단계의 한계
- 버전 기록이 아직 없습니다
- 여러 명이 동시에 편집하는 것은 아직 기본 수준이라 불안정할 수 있습니다
- 인라인 댓글이 가끔 화면에 안 보일 수 있습니다 — 댓글 보기에서 확인하거나 대화에 붙여 넣으세요
- “chat upstream error”가 나면 같은 프로젝트에서 새 대화 탭을 여세요
- 아주 큰 저장소는 클로드 코드에서 연결하는 편이 안정적입니다
잘 쓰는 요령
- 단순하게 시작해 층을 쌓기 – 기본 배치부터, 인터랙션과 예외 처리는 나중에
- 구체적으로 피드백 – “이상해” 대신 “입력칸 사이 간격 8px로”
- 반응형을 초반에 – 모바일·태블릿·데스크톱 중 무엇에 맞출지 먼저 말하기
- 대안 요청 – 방향이 애매하면 2~3개를 비교

정리
클로드 디자인은 대화로 시안과 프로토타입을 만드는 도구입니다. 목표·배치·내용·대상을 담아 요청하고, 큰 변화는 대화로, 세부는 댓글로, 미세 조정은 직접 편집으로 다듬으면 됩니다. 버전 기록이 없으니 방향을 바꿀 때는 먼저 저장을 요청하시기 바랍니다.
함께 보면 좋은 글
· 클로드 아티팩트 사용법, 문서·슬라이드·앱까지 만들기
· 클로드 독스(Claude Docs) 사용법, AI와 같이 쓰는 문서
· AI 로고 만들기 사이트 추천, 무료로 시안 뽑기
· 블로그 썸네일 AI로 만드는 법, 캔바로 5분 만에
※ 이 글은 2026년 9월 기준 Anthropic(클로드) 고객센터 공식 안내를 참고했습니다. 메뉴 이름과 한도는 바뀔 수 있으니 최신 내용은 공식 페이지에서 확인하시기 바랍니다.