Claude Design으로 1시간 만에 사주 앱 PoC 만들기

고품질 UI는 30분, 실제 동작은 1시간.
하지만 믿을 수 있는 결과를 만들기 위해서는 검증 구조가 필요했습니다.

이번 실험의 시작은 단순했습니다.
Claude Design이 좋다는 이야기를 듣고, 실제로 어느 정도까지 빠르게 프로토타입을 만들 수 있는지 직접 확인해보고 싶었습니다.

주제는 사주 앱으로 정했습니다.
입력 화면, 로딩 화면, 결과 화면이 명확하고, 사주 원국·오행·대운·세운처럼 시각화할 요소가 많았기 때문입니다. Claude Design의 UI 생성 능력을 테스트하기에 꽤 좋은 소재라고 생각했습니다.

실제 PoC는 아래에서 확인할 수 있습니다.
내 사주 보기 👉 https://cursor-saju.onrender.com/

1. Claude Design으로 30분 만에 고품질 UI 만들기

Claude Design에서 선택한 방향은 명확했습니다.

고품질 UI, 인터랙티브 프로토타입, 디자인 시스템을 염두에 두고 시작했습니다.
프롬프트에는 사주 앱의 주요 화면 구성을 비교적 구체적으로 적었습니다.

입력 화면에는 양력/음력 토글, 생년월일, 출생 시간, 성별, 출생 도시 입력을 넣었습니다.
로딩 화면에는 팔자 8글자가 한 글자씩 등장하는 애니메이션을 요청했습니다.
결과 화면에는 사주 원국, 오행 균형, 격국과 용신, 커리어·재물·연애·건강·대운·세운 흐름까지 포함했습니다.

결과는 생각보다 빠르게 나왔습니다.
단청 컬러바, 별이 깔린 어두운 배경, 금빛과 옥빛 포인트, 시간 입력 UI, 오행 차트, 접고 펼칠 수 있는 결과 섹션까지 한 번에 구성됐습니다.

개인적으로 이전에 v0도 써본 적이 있습니다.
v0 역시 한 번의 프롬프트로 꽤 높은 품질의 UI를 만들어준다는 점에서 인상적이었습니다.

다만 이번에 Claude Design을 써보며 더 크게 느낀 차이는 수정 경험이었습니다.

처음 생성된 화면도 좋았지만, 이후 수정이 더 자연스러웠습니다.
예를 들어 처음에는 12시진을 칩 형태로 선택하는 방식이었는데, 실제 사용성을 생각하면 사용자가 시간을 직접 입력하고 해당 시진이 자동으로 표시되는 방식이 더 좋아 보였습니다.

그래서 “시간을 직접 입력하면 해당 시진으로 자동 변환되게 바꿔달라”고 요청했습니다.
Claude Design은 기존 화면의 톤과 구조를 유지한 채, 시간 입력 UI와 시진 변환 표시를 자연스럽게 반영했습니다.

v0가 “한 번에 좋은 화면을 뽑아주는 도구”처럼 느껴졌다면, Claude Design은 “이미 만든 화면을 옆에서 같이 다듬는 파트너”에 조금 더 가까웠습니다.

2. Cursor로 1시간 안에 실제 동작하는 PoC 만들기

Claude Design이 만든 결과물은 매우 그럴듯했습니다.
하지만 아직은 하드코딩된 데모에 가까웠습니다. 입력값을 바꿔도 실제 사주 결과가 계산되는 구조는 아니었습니다.

그래서 다음 단계에서는 Cursor를 사용했습니다.

Claude Design에서 만든 HTML 기반 결과물을 Cursor 프로젝트로 옮기고, Cursor Agent를 통해 실제 동작하는 구조로 바꿨습니다.
백엔드는 Node.js Express로 구성했고, OpenAI API를 연결했습니다.

사용자가 생년월일, 성별, 출생 시간, 출생 도시를 입력하면 /api/saju로 요청을 보내고, gpt-4o가 JSON 형태의 해석 결과를 반환하도록 했습니다.
프론트에서는 이 JSON 응답을 받아 기존 UI의 사주 원국, 오행, 커리어, 재물, 연애, 건강, 대운, 세운 섹션에 매핑했습니다.

대략적인 구조는 아래와 같았습니다.

cursor-saju/
├── server.js
├── package.json
├── .env
├── saju-app.jsx
├── setup-public.js
├── public/
│   └── index.html
└── Saju-offline.html

여기까지는 약 1시간 정도 걸렸습니다.

Claude Design으로 약 30분 만에 고품질 사주 UI를 만들고, Cursor로 OpenAI API를 연결해 실제 입력값에 반응하는 PoC까지 완성했습니다.

배포는 최종적으로 Render 단독 구조로 정리했습니다.
Express가 프론트엔드와 API를 함께 서빙하도록 구성해, 하나의 URL에서 PoC를 확인할 수 있게 만들었습니다.

물론 여기서 멈췄다면 아주 깔끔한 PoC였습니다.
하지만 문제는 제가 서비스 기획자(PM)라는 점이었습니다.
사주 결과가 정말 잘 맞는지 확인하고 싶어졌고,
그때부터 약 3~4시간짜리 품질 검증과 보정 작업이 시작됐습니다.

3. 그런데 결과가 맞는지는 다른 문제였습니다

처음에는 GPT에게 사주 계산과 해석을 모두 맡겼습니다.
하지만 곧 문제가 드러났습니다.

제 생년월일 기준으로 테스트했을 때, GPT는 아래와 같은 사주 원국을 출력했습니다.

乙丑 · 壬子 · 戊午 · 戊子

하지만 검증해보니 정확한 값은 아래에 가까웠습니다.

乙丑 · 丁亥 · 辛未 · 戊子

문제는 단순한 오타가 아니었습니다.
사주에서 월주는 양력 월 숫자로 단순히 정해지지 않습니다. 절기 기준으로 계산해야 합니다.
또한 일주는 60갑자 순환을 정확히 계산해야 합니다.

즉, LLM이 그럴듯하게 추론해서 맞힐 수 있는 문제가 아니었습니다.
계산이 틀리면 이후의 일간, 오행, 격국, 용신, 대운, 세운 해석이 모두 흔들립니다.

그래서 구조를 바꿨습니다.

만세력 계산은 Python의 sxtwl 라이브러리를 사용해 처리했습니다.
간지 8글자 계산은 코드가 담당하고, GPT는 그 계산 결과를 바탕으로 해석 문장을 생성하도록 역할을 분리했습니다.

이 과정에서 UI와 데이터 매핑 버그도 함께 발견했습니다.

• 인용구 블록이 비어 있음
• “오늘의 한 수”가 중복 출력됨
• 가족운 4궁 설명이 동일하게 반복됨
• 대운 타임라인이 표시되지 않음
• 2026년년 같은 오타 발생
• 응답 구조 변경 후 일부 결과 섹션이 비어버림

PoC라면 사실 여기까지 깊게 들어가지 않아도 됐습니다.
하지만 결과가 틀린 채로 그럴듯하게 보이는 것이 더 위험하게 느껴졌습니다.

4. 계산은 코드로, 해석은 AI로

이번 실험에서 가장 크게 배운 점은 명확했습니다.

AI는 빠르게 만들어주지만, 정확도를 자동으로 보장해주지는 않습니다.

처음에는 GPT에게 사주 계산과 해석을 모두 맡겼습니다.
하지만 만세력 계산에서 오류가 발생했습니다.

• 월주는 단순한 양력 월이 아니라 절기 기준으로 계산해야 합니다.
• 일주는 60갑자 순환이 정확히 맞아야 합니다.
• 자시 처리처럼 해석 기준이 갈리는 부분도 있습니다.

결국 이 영역은 LLM이 그럴듯하게 추론할 문제가 아니었습니다.

그래서 구조를 바꿨습니다.

• 계산: sxtwl 라이브러리 기반 코드가 담당
• 해석: GPT가 계산 결과를 바탕으로 문장 생성
• 검증: 여러 케이스를 테스트하며 오류 확인
• 마무리: PoC 기준으로 면책 문구 추가 후 클로즈

이후에도 격국, 용신, 배우자성, 세운 해석처럼 규칙 기반 판단이 필요한 영역은 프롬프트만으로 안정적으로 제어하기 어렵다는 점을 확인했습니다.
특정 케이스를 고치면 다른 케이스에서 흔들리는 풍선효과도 있었습니다.

이번 실험의 결론은 이렇습니다.

• Claude Design은 고품질 UI를 빠르게 만들고 수정하는 데 강했습니다.
• Cursor는 그 UI를 실제 동작하는 PoC로 연결하는 데 유용했습니다.
• 하지만 실제 제품화 단계에서는 계산·검증·책임 경계를 사람이 설계해야 했습니다.

PoC로는 충분했습니다.
다만 상용 서비스라면 격국, 용신, 배우자성, 세운 해석 같은 영역은 별도 룰 엔진과 전문가 검수가 필요합니다.

결국 AI 시대에 더 중요해지는 일은 단순히 더 빠르게 만드는 것이 아니라, 검증 가능한 구조를 설계하는 일일지도 모르겠습니다.