ㅁ 아래 프롬프트를 복사해서 클로드 대화창에 직접 입력해보세요
(원한다면 아래 프롬프트를 큰 틀로 잡고 다른 주제 블로그로도 활용 가능합니다.)
※ 한 번에 다 입력하지 말고 단계별로 입력하세요
(1단계 입력 -> 클로드 응답 -> 2단계 입력 -> 클로드 응답 -> 3단게 입력 -> 클로드 응답 ....)
**1단계**
나 요즘 자동차 추천 앱 같은 거 만들어보고 싶어.
MBTI 테스트처럼 몇 가지 질문에 답하면
"당신한테 맞는 차는 이거예요!" 하고 추천해주는 거야.
근데 그냥 단순하게 말고, 예산이나 가족 수 같은 실용적인 것도 반영하고
실제 가격이랑 리스 금액도 같이 보여주면 좋겠어.
HTML 파일 하나로, React나 Vue 없이 순수 HTML, CSS, JS만 써줘.
화면은 시작 → 질문 → 로딩 → 결과 이렇게 4단계로 넘어가는 흐름이야.
디자인은 카드형으로 깔끔하게, 모바일에서도 잘 보이게,
색상은 블루 계열로 포인트 줘.
일단 전체 뼈대랑 디자인부터 만들어줄 수 있어?
**2단계**
그리고 질문을 넣어보자.
질문은 총 15개, 크게 4개 파트로 나눠줘.
기본 정보: 나이대, 성별, 예산(2000이하/2000~4000/4000~7000/7000이상), 신차vs중고
탑승·차종: 탑승 인원, 세단/SUV/미니밴 선호
구매 고민: 구매 이유, 5년 후 계획, 월 유지비, 결제 방식, 출고 대기 기간
차량 취향: 연료(휘발유/디젤/전기/하이브리드/상관없음), 주 용도
중간에 딜레마 질문 2개 넣어줘.
"같은 돈이면 벤츠 침수차 vs 경차 신차 풀옵션 어느 쪽?" 이런 심리 파악 질문이야.
딜레마는 VS 대결 형식으로 크게 보여줘.
상단에 진행률 바, 이전 질문 돌아가는 뒤로 가기 버튼도 꼭 넣어줘.
3단계
이제 차량 데이터도 필요해.
그냥 아무 차나 넣지 말고, 실제로 한국 사람들이 많이 검색하고
구매 고려하는 차들로 채워줘.
검색해서 2026년 기준 판매량 많은 차 위주로 골라줘.
국산차는 모닝 같은 경차부터 제네시스 G90까지
세단, SUV, 미니밴, 전기차 골고루 100종 목표로 넣어줘.
수입차는 테슬라, 벤츠, BMW, 아우디, 볼보, 렉서스, 토요타처럼
한국에서 실제로 많이 팔리는 브랜드 위주로 100종 넣어줘.
가격은 2026년 실제 출고가 기준으로,
신차가, 중고 시세, 월 리스, 월 렌트 금액 다 넣어줘.
전기차는 경형/소형/중형/대형/수입으로 나눠서 보조금 자동 계산되게 하고,
지역별 차이는 전국 평균으로 계산해줘.
4단계
추천 로직도 만들어야해
사용자 유형은 8가지야.
가성비 실속파, 패밀리파, 럭셔리파, 전기차파, 퍼포먼스파, 아웃도어파, 디자인파, 도심파.
질문 답변마다 각 유형에 점수를 쌓아서 제일 높은 유형이 그 사람 유형이 돼.
차량 필터는 연료는 절대 타협하지 마.
전기차 선택했으면 전기차만 나와야 해.
예산, 탑승 인원, 차종 순으로 필터 걸고
결과가 너무 적으면 예산 조건만 살짝 완화해줘.
딜레마 답변은 추천에 강하게 반영해줘.
수입차 AS 멀어도 타겠다고 하면 수입차 점수 팍 올리고,
국산차로 바꾼다고 하면 국산차를 훨씬 강하게 추천해줘.
그리고 점수 높은 순으로 그냥 자르면 안 돼.
같은 브랜드 최대 2개, 제네시스는 특히 2개 이하로 제한해줘.
럭셔리 브랜드 전체 합쳐서도 2개 이하로 묶어줘.
차종 타입도 같은 타입이 3개 이상 나오지 않게 해줘.
주의할 점이 있어.
점수 계산 함수가 차량 객체에 score를 직접 합쳐서 { ...car, score } 이런 flat 구조로 반환해.
그래서 itehttp://m.car.brand가 아니라 item.brand로 접근해야 해.
itehttp://m.car.brand로 하면 undefined가 돼서 브랜드 제한이 아예 안 걸려.
5단계
결과 화면 다듬고 네가 사용자를 생각했을 때 더 도움이 되게 만들고
전체 검토해줘.
각 추천 차량마다 예산 대비 구매 가능 여부를 배지로 보여줘.
신차 가능하면 초록, 중고만 가능하면 노랑으로 "2024년식 중고 약 얼마",
중고도 초과면 빨강으로 표시해줘.
중고 가격은 1년 75%, 2년 65%, 3년 55% 감가율로 자동 계산해줘.
전기차는 보조금 자동 계산해서 실구매가 보여주고
내 지역 보조금 확인 링크도 달아줘.
결과 아래에 엔카, 케이카, KB차차차, 다나와 링크 넣어줘.
공유 버튼이랑 다시 테스트 버튼도 추가해줘.
그리고 전체 가격 한번 검토해줘.
리스 렌트 월납금이 실제 시장이랑 너무 차이 나면 수정해줘.
예를 들어 테슬라 모델Y 리스가 105만원이면 너무 높아, 실제로는 47~65만원 수준이거든.
이런 식으로 틀린 값 다 잡아서 완성본으로 줘.
6단계
(글에 직접 넣을 사람들은 5단계 까지만 하시면 됩니다
스킨으로 만들고 싶은 분들의 경우 이 명령어까지 넣어주세요)
마지막으로 나는 구글 블로그에 이걸 테마 스킨으로 만들어서 넣고 싶어
구글 블로그 테마에 맞게 코드를 수정해줘
그리고 애드센스 광고도 넣어야 하니까 수동으로 넣을 수 있게 코드 넣는 부분도 만들고
어디에 넣으면 되는지 표시해줘