클로드(Claude) 어떻게 쓰는지 모르겠다구요?
클로드는 코딩부터 배포까지, 비개발자분들도 손쉽게 AI 서비스를 만들 수 있도록 도와줍니다. 복잡한 코딩 없이 원하는 기능을 구현 하고 싶으신가요?
이 모임에서는 원하는 서비스를 직접 만들고 자동화 및 워크플로우 까지 상세하게 배우고 싶으신 분들을 모집해요. AI 개발자가 클로드가 무엇이고 어떻게 사용해야하는지 있는 무료로 알려 드릴 예정입니다.
AI 시대를 함께 준비하고 싶은 분들의 많은 참여 부탁드립니다!
서울시
교육/자기계발
Claude Design 사용 가이드 | 당근 카페
교연
인증 8회 · 1일 전
Claude Design 사용 가이드
Claude Design은 Anthropic이 2026년 4월에 출시한 실험적 도구로, 텍스트로 설명하면 프로토타입, 랜딩 페이지, 피치덱 등 시각 결과물을 만들어줍니다. Pro/Max/Team/Enterprise 구독에 포함되어 있고, claude.ai/design 에서 바로 접근할 수 있어요.
Step 1. 처음 시작할 때 — 디자인 시스템 세팅
처음 열면 온보딩 화면이 나옵니다. 여기서 GitHub 레포, Figma 파일, 로고, 폰트 폴더를 연결할 수 있어요. 연결하면 Claude가 읽어서 자동으로 디자인 시스템을 만들고, 이후 모든 프로젝트에 자동 적용됩니다.
아직 이런 파일이 없어도 괜찮습니다. 그냥 텍스트로 넣어줘도 됩니다.
Step 2. 프로젝트 시작하는 4가지 방법
Claude Design 프로젝트를 시작하는 방법은 네 가지예요:
1. 텍스트 프롬프트로 원하는 걸 설명하기
2. 레퍼런스 이미지나 스케치 업로드하기
3. DOCX, PPTX, XLSX 문서를 업로드해서 시각적 결과물로 변환하기
4. 웹 캡처 도구로 실제 운영 중인 사이트의 요소를 그대로 가져오기
특히 4번 웹 캡처 기능이 꿀기능인데, 경쟁사나 참고하고 싶은 사이트 URL만 넣으면 그 디자인 요소를 그대로 불러와서 프로토타입 만들 때 활용해줘요.
Step 3. 프롬프트 잘 쓰는 법
그냥 "랜딩 페이지 만들어줘" 라고만 하면
브랜드 정보 없이 요청하면 세련되고 모던하지만, 인터넷에 넘쳐나는 평범한 페이지가 나와요. 브랜드 색상, 타이포그래피, 톤 앤 매너, 타겟 고객 정보가 없으면 Claude Design이 학습 데이터의 평균값으로 결과물을 만들기 때문이에요.
아래처럼 첫 prompt에 브랜드 정보를 넣어주세요:
우리 브랜드 정보입니다. 이번 세션의 모든 디자인 결정(색상, 타이포, 스페이싱, 컴포넌트, 어투)의 기준으로 써주세요.
- 브랜드명: OOO
- 주요 색상: #2563eb (메인), #f59e0b (포인트)
- 폰트: 제목 Pretendard Bold, 본문 Pretendard Regular
- 버튼 스타일: 모서리 둥글게 (rounded-full)
- 톤: 전문적이지만 친근하게, 느낌표 최소화
- 타겟: 비개발자 스타트업 창업자
- 하지 말 것: 스톡 이미지, 과도한 그라데이션
위 기준에 어긋나는 요청이 오면 먼저 물어봐주세요.
마지막 줄이 중요합니다. 이 한 줄이 Claude를 단순 실행기가 아니라 브랜드 가이드 역할로 바꿔줍니다.
Step 4. 대화하듯 수정하기
첫 버전이 나오면 이렇게 자연스럽게 말로 수정 요청을 해요:
- "히어로 섹션이 너무 강한 느낌이야, 그라데이션 좀 줄여줘"
- "후기 섹션 빼고 로고 월로 바꿔줘"
- "버튼이 rounded-md인데 가이드라인대로 rounded-full로 수정해줘"
- "이 헤드라인은 우리 타겟한테 안 맞아, 다시 써줘"
인라인 코멘트로 특정 요소를 직접 지목해서 메모를 달 수도 있고, 텍스트는 클릭해서 바로 수정할 수 있습니다. 스페이싱이나 색상을 건드리고 싶으면 Claude가 만들어주는 슬라이더 컨트롤로 조정하면 됩니다.
Step 5. 완성 후 내보내기
완성된 디자인은 ZIP, PDF, PPTX로 내보내거나 Canva로 직접 보낼 수 있어요. 코드로 구현하고 싶다면 Claude Code 핸드오프 기능으로 한 번에 넘길 수도 있어요.
팀 협업도 되는데, 조직 내부 링크로 공유하면서 열람 전용 / 편집 권한을 따로 줄 수 있고, 팀원이 동시에 접속해서 Claude와 함께 그룹 대화로 수정하는 것도 가능합니다.
한계
Figma를 대체하지는 않습니다. 디자인 토큰을 팀 차원에서 관리하거나 픽셀 단위 컨트롤이 필요한 전문 디자이너용 툴은 아니에요. 3D, 음성 인터페이스 같은 프론티어 기능은 존재하지만 아직 초기입니다. 그리고 프롬프트 품질이 결과물에 그대로 반영됩니다. 구체적으로 쓸수록 좋아집니다.
디자이너 없이 빠르게 아이디어를 시각화해야 하는 상황, 그리고 Figma를 열 일이 애초에 없었던 분들에게 실질적으로 도움이 되는 도구입니다.
