목록 · 가이드
클로드로 반나절 만에 브랜드와 원페이지 사이트 만들기
여덟 단계 부탁문과 단계별 도구
소상공인과 1인 사업자가 클로드에게 부탁을 여덟 번 하면 가게 브랜드와 손님을 받는 신청 페이지 한 장이 나옵니다. 가상의 1인 꽃집 '보름꽃'으로 실제로 돌려 봤습니다. 아래는 그 대화 전부와 완성 화면, 그리고 단계마다 붙이면 좋은 도구입니다.
- 준비물클로드 하나와 메모 네 줄
- 하는 일한 대화 안에서 부탁 여덟 번
- 얻는 것한 문장 메시지, 색 둘·글꼴 둘, 신청 페이지 한 장
- 사람 몫답을 읽고 고르는 일. 반나절이면 넉넉한 분량으로 보입니다
다음 부탁이 앞 답을 받아 씁니다. 그래서 한 대화 안에서 차례로 하셔야 합니다. 대화를 새로 열면 앞 답을 맨 앞에 붙여 넣으십시오.
누가, 어디에 쓰면 좋은가
이 여덟 단계는 디자이너 없이 혼자 가게나 일을 꾸리는 분께 맞춰 짰습니다. 회사 안에서 쓰는 보고서나 발표 자료가 아니라, 손님이 처음 보는 첫 화면을 만드는 일입니다.
맞지 않는 경우도 있습니다. 이미 브랜드 규정이 있는 회사라면 2단계(메시지)와 7단계(점검)만 쓰십시오. 결제와 회원 가입까지 들어가는 쇼핑몰이나 여러 장짜리 사이트는 이 글이 다루는 범위 밖입니다.
시작 전에 네 줄만 적습니다
여덟 번의 부탁이 모두 이 네 줄에서 출발합니다. 형광 칠한 곳만 내 가게로 바꾸면 됩니다. 가게 이름과 숫자는 예시로 지어낸 것입니다.
클로드 브랜딩 여덟 단계, 실제 대화
한 대화에서 차례로 부탁했고, 받은 답에서 핵심만 옮겼습니다. 부탁문 원문은 끝의 복사용 부탁문에 있습니다.
범위 정하기
오늘 할 것 다섯, 미룰 것 다섯오늘 할 것: 가게 이름과 한 줄 설명, 핵심 메시지, 색 둘과 글꼴 둘, 신청 페이지 한 장, 카카오톡 채널 하나입니다.
미뤄도 되는 것: 정식 로고(글자 로고로 충분), 인스타그램 운영 계획(첫 손님 열 명 뒤), 상품 추가(정기배송 하나로 시작), 자체 결제(첫 달은 계좌이체), 브랜드 영상입니다.
핵심 메시지 한 문장
어디에나 쓸 한 문장"고르지 않아도, 들르지 않아도 보름마다 집에 꽃이 있습니다."
손님의 문제 두 개(고를 줄 모름, 들를 시간 없음)를 그대로 받아 풀었습니다. 가게 이름의 '보름'이 배송 주기를 설명합니다.
색 둘, 글꼴 둘, 로고 하나
가장 작은 비주얼 키트#2F4A3A대비 9.72:1. 글자와 단추에
#D9828A대비 2.80:1. 장식에만
제목은 고운바탕, 본문은 Noto Sans KR 입니다. 로고는 분홍 점 하나 뒤에 이름을 둡니다. 보름꽃
확인했습니다. 대비 수치를 웹 접근성 기준(WCAG) 공식으로 다시 계산해 보니 맞았습니다. 본문 글자는 4.5:1 이상이어야 읽힙니다. 분홍을 글자에 쓰지 말라는 답이 여기서 나왔습니다.
페이지 구조
다섯 칸짜리 설계도- 첫 화면: 메시지 제목, 한 줄 설명, 신청 단추
- 사정 문단: 손님의 문제를 손님의 말로 한 번
- 증거: 시범 배송 결과와 꽃이 오는 세 단계
- 값과 방법: 29,000원, 배송 지역, 멈추는 법, 단추 한 번 더
뺄 것: 꽃 종류 목록(철마다 바뀜), 긴 가게 소개, 메뉴입니다.
증거 문단
지어내지 않은 증거 한 문단가게를 열기 전 두 달 동안 지인 다섯 집에 보름마다 꽃을 보냈습니다. 두 달이 끝났을 때 네 집이 계속 받겠다고 했습니다. 저는 다른 꽃집에서 6년 동안 꽃을 다듬었습니다.
마지막 한 줄이 핵심입니다. "지어내지 마십시오" 가 없으면 그럴듯한 손님 후기가 섞여 나옵니다.
페이지 글과 HTML
그대로 올릴 글 전체와 페이지 파일- 설명: "마포·서대문 1인 가구를 위한 제철 꽃 정기배송입니다. 보름에 한 번, 문 앞에 두고 갑니다."
- 사정 문단 제목: "꽃집이 닫은 뒤에 퇴근하는 분께"
- 과정: 수요일 새벽 꽃시장 · 목요일 손질 · 금요일 저녁 문 앞
- 단추: "첫 꽃 신청하기"
첫 HTML 에서 눈에 띈 두 가지. PC 에서 제목이 "들르지 / 않아도" 로 어색하게 끊겼고, 29,000원이 값 칸 제목과 본문에 두 번 나왔습니다. "제목은 쉼표 뒤에서만 끊고, 값은 한 번만 적어 주십시오" 한 줄로 고쳤습니다.
공개 전 점검
손님이 망설일 곳 셋과 고칠 문장- 집에 없을 때 어떻게 되는지 없습니다. 금요일 저녁 꽃이 주말 내내 문밖에 있을 수 있습니다.→ "집에 안 계시면 알려 주신 곳에 맡깁니다"
- 단추가 카카오톡으로만 이어지는데 적혀 있지 않습니다. PC 에서 누른 사람이 당황합니다.→ 단추 아래 "카카오톡 채널로 이어집니다"
- '마포·서대문' 이 손님 소개로만 읽혀, 배송 지역 제한인 줄 모릅니다.→ 첫 화면에 "배송 지역: 서울 마포구·서대문구"
통과한 것: 메시지가 분명합니다. 색은 두 개만 썼습니다. 사진이 없어 가볍게 열립니다.
2주 동안 볼 신호
다음에 고칠 곳을 알려 줄 숫자 넷- 단추 누른 수 대비 채널 추가 수. 절반 넘게 빠지면 카카오톡으로 넘어가는 길을 고칩니다
- 두 번 이상 나온 질문. 페이지에 없는 정보라 한 줄로 넣습니다. 예상 질문은 "꽃이 며칠 가나요" 입니다
- 배송 지역 밖 신청. 한 동네에서 다섯 건이면 넓힐지 봅니다
- 두 번째 꽃 전에 멈춘 사람. 첫 꽃에서 실망했다는 신호라 이유를 묻습니다
완성한 원페이지 사이트 화면
6단계에서 클로드가 만든 첫 HTML 은 글과 색은 맞았지만 밋밋했습니다. 사진 자리에는 분홍 원 하나만 있었습니다. 그래서 한 단계를 더 밟았습니다. 힉스필드 MCP로 사진 네 장과 페이지 시안을 뽑고, 그 시안대로 페이지를 다시 짰습니다.
요령. HTML 이 밋밋하면 이미지 모델로 시안을 먼저 뽑고, 그 시안을 클로드에게 보여 주며 "이대로 만들어 주십시오" 라고 하십시오. 글은 시안 속 글자가 아니라 6단계에서 정한 글을 넣습니다. 이 글의 사진 다섯 장과 시안 다섯 장에 힉스필드 크레딧 23.75 가 들었습니다.
사진은 모두 AI 로 만든 예시입니다. 실제 가게라면 증거 칸에는 직접 찍은 꽃시장과 포장 사진을 쓰십시오. AI 사진을 증거처럼 쓰면 손님을 속이는 일이 됩니다.
인스타그램에 도는 부탁문과 무엇이 다른가
브랜드를 하루 만에 만든다는 부탁문 묶음은 여러 판이 돕니다. 이 글은 세 곳이 다릅니다.
바쁘시면 이 여덟 줄만
한 대화에 차례로 넣으면 됩니다. 다만 이 여덟 줄은 요약입니다. 답의 품질을 가르는 조건(개수, 대비 기준, 지어내지 말 것)을 다 붙인 원문은 회원에게 열어 드립니다.
- 오늘 공개에 꼭 필요한 것만 다섯 개, 미룰 것은 이유와 함께
- 무엇을, 누구에게, 왜를 한 문장에. 5초 안에 알아듣게
- 색 둘(대비 포함), 한글 글꼴 한 쌍, 15분 글자 로고
- 한 장짜리 페이지의 칸, 넣을 것과 뺄 것
- 가진 것만으로 증거 문단. 지어내지 말 것
- 빈칸 없는 페이지 글 전체, 그다음 HTML
- 손님이 망설일 곳 두세 개와 고칠 문장
- 2주 동안 볼 신호와 고칠 기준
- 조건을 다 붙인 부탁문 원문 8개
- 단계마다 한 번 더 물을 질문 8개
- 네 줄만 바꾸면 내 가게로 그대로 도는 빈칸
복사용 부탁문 여덟 개
형광 칠한 대괄호만 내 가게로 바꾸고 1번부터 차례로 붙여 넣으십시오. 단계마다 한 번 더 물으면 답이 나아지는 질문도 함께 적었습니다.
부탁문 원문은 회원에게 열어 드립니다
대화와 결과, 여덟 줄 요약은 누구나 보실 수 있습니다. 복사 단추가 달린 원문은 로그인하시면 나옵니다. 가입은 무료이고 결제 수단을 받지 않습니다.
- 여덟 단계 부탁문 원문. 누르면 복사됩니다
- 단계마다 한 번 더 물을 질문 여덟 개
- 네 줄만 바꾸면 내 가게로 그대로 도는 빈칸
이미 회원이시면 로그인하십시오. 읽던 자리로 돌아옵니다.
오늘 안에 [가게·서비스]의 브랜드를 공개하려 합니다. 손님은 [손님]이고, 이분들의 [손님의 문제]를 풉니다. 오늘 공개하는 데 꼭 필요한 브랜드 요소만 다섯 개 이내로 골라 주십시오. 있으면 좋지만 지금 없어도 되는 것은 따로 목록으로 적고, 왜 미뤄도 되는지 한 줄씩 붙여 주십시오.
미뤄도 되는 것 가운데 제가 오늘 붙잡고 있을 것 같은 것 하나를 짚어 주십시오.
위에서 정한 범위로, 어디에나 쓸 핵심 메시지를 한 문장으로 만들어 주십시오. 무엇을 하는지, 누구를 위한 것인지, 왜 필요한지가 한 문장에 들어가야 합니다. 처음 보는 사람이 5초 안에 알아듣게, 업계 용어 없이 쓰십시오. 후보 세 개를 주고 하나를 골라 이유를 적어 주십시오.
고른 문장을 [손님] 한 명이 소리 내 읽는다고 치고, 막히는 낱말이 있으면 바꿔 주십시오.
핵심 메시지에 맞는 가장 작은 비주얼 키트를 정해 주십시오. 주색 하나와 강조색 하나를 색 코드로, 구글 폰트에서 제목용과 본문용 한글 글꼴 한 쌍, 그리고 제가 15분 안에 직접 만들 수 있는 글자 로고 하나입니다. 색마다 흰 바탕에서 글자 대비가 몇 대 1인지 적고, 4.5 대 1이 안 되면 어디에만 쓸지 정해 주십시오.
이 키트로 명함 한 장과 인스타그램 프로필 사진을 만든다면 각각 어떻게 둘지 적어 주십시오.
핵심 메시지와 비주얼 키트로 한 장짜리 페이지의 구조를 짜 주십시오. 첫 화면의 제목과 신청 단추, 사정을 설명하는 문단 하나, 증거가 있으면 증거 칸, 값과 방법, 마지막 신청 단추 순서가 기본입니다. 메뉴나 여러 장 구조는 오늘 필요 없습니다. 칸마다 넣을 것과 넣지 않을 것을 적어 주십시오.
휴대폰으로 연 손님이 스크롤 없이 첫 화면에서 보는 것만 따로 적어 주십시오.
[가진 것]만으로 한 장짜리 페이지에 넣을 증거 문단을 하나 써 주십시오. 내세울 경력이 적어도 됩니다. 시범으로 해 본 일, 작업 과정, 막 시작했다는 사실도 증거가 됩니다. 제가 적지 않은 숫자나 후기는 지어내지 마십시오.
이 문단에서 손님이 "정말?" 하고 되물을 만한 문장을 짚고, 사진 한 장으로 보여 줄 수 있는 것을 적어 주십시오.
지금까지 정한 메시지, 증거, 구조로 한 장짜리 페이지의 글 전체를 써 주십시오. 제목, 설명 문단, 증거, 값과 방법, 신청 단추 문구까지입니다. 문장은 짧고 그대로 올릴 수 있어야 합니다. 나중에 채울 빈칸이나 '여기에 입력' 같은 자리 표시는 넣지 마십시오.
이 글과 비주얼 키트로 한 장짜리 HTML 을 만들어 주십시오. 휴대폰에서 먼저 보기 좋게, 색은 키트의 두 개만 쓰십시오.
이 한 장을 오늘 공개해도 되는지 점검해 주십시오. 메시지가 분명한지, 색과 글꼴이 일관되게 쓰였는지, 휴대폰에서 잘 열리는지, 신청 단추와 연락 수단이 제대로 이어지는지 봐 주십시오. 사소한 모양은 넘기고, 처음 보는 손님이 실제로 망설일 곳 두세 개만 짚어 주십시오. 곳마다 고칠 문장도 적어 주십시오.
짚은 곳을 HTML 에 반영해 주십시오. 다른 곳은 건드리지 마십시오.
이 한 장이 공개됐습니다. 앞으로 2주 동안 지켜볼 신호를 정해 주십시오. 방문자가 어디서 멈추는지, 손님이 무엇을 되묻는지, 누가 신청하지 못하는지처럼 다음에 무엇을 고칠지 알려 주는 것으로요. 신호마다 어디서 세는지와, 어느 정도면 고칠지 기준도 적어 주십시오.
2주 동안 모은 숫자를 붙여 넣겠습니다. 무엇부터 고칠지 한 가지만 골라 주십시오.
자주 묻는 질문
소상공인도 클로드로 홈페이지를 만들 수 있나요?
한 장짜리 소개·신청 페이지라면 됩니다. 이 글의 여덟 단계가 그 과정이고, 코드를 몰라도 부탁문만으로 글과 HTML 이 나옵니다. 결제나 회원 관리가 들어가는 쇼핑몰은 따로 쇼핑몰 서비스를 쓰시는 편이 맞습니다.
스마트스토어 상세페이지에도 쓸 수 있나요?
글과 색은 그대로 쓰실 수 있습니다. 2단계의 한 문장을 상세페이지 첫 줄에, 3단계의 색 두 개를 이미지 배경과 강조색에 넣으십시오. 스마트스토어는 HTML 파일을 그대로 올리는 곳이 아니라서, 6단계의 HTML 대신 글을 편집기에 옮겨 넣습니다.
AI 로 만든 가게 이름과 로고를 바로 써도 되나요?
쓰기 전에 같은 이름이 있는지 먼저 찾아보십시오. 특허청 특허정보검색(KIPRIS)에서 상표를, 네이버 지도에서 같은 동네 가게 이름을 확인하시면 됩니다. 이 글의 글자 로고처럼 점 하나와 글꼴로 만든 로고는 겹칠 일이 적지만, 이름이 겹치면 로고도 바꿔야 합니다.
무료 요금제로도 여덟 단계를 다 할 수 있나요?
부탁 자체는 어느 요금제에서나 됩니다. 다만 한 대화가 길어져 무료 요금제는 사용량 한도에 먼저 닿을 수 있습니다. 그때는 앞 답을 복사해 새 대화 맨 앞에 붙여 넣고 이어 가십시오.
챗GPT 나 제미나이에서도 되나요?
부탁문은 한국어 문장이라 어느 모델에서나 됩니다. 단계마다 붙인 스킬과 MCP 는 클로드 앱과 클로드 코드에 붙습니다. 둘의 차이는 스킬·MCP·플러그인 차이에 있습니다.
만든 HTML 은 어디에 올리나요?
가장 빠른 길은 클로드 웹의 아티팩트입니다. 만든 화면을 링크로 보낼 수 있습니다. 내 주소로 올리려면 Vercel 같은 무료 호스팅에 파일 하나를 올리면 되고, 배포 상태는 Vercel MCP로 확인합니다.
가게가 아니라 1인 강의나 외주여도 되나요?
됩니다. 네 줄의 가게와 손님만 바꾸면 여덟 단계가 그대로 돕니다. 달라지는 곳은 5단계 증거입니다. 강의라면 수업 과정, 외주라면 끝낸 작업 한 건이 증거가 됩니다. 하려는 일부터 도구를 고르려면 하려는 일부터 고르는 추천을 보십시오.