← 모든 프로젝트
AI 서비스 기획 · MVP · 2026.03 — 현재

상품 URL과 신체 정보로 맞는 의류 사이즈를 추천하는 서비스를 만들었다

온라인 쇼핑 사이즈 불안을 줄이는 AI 추천 MVP

AI 서비스MVP2인 협업UX 기획사이즈 추천이커머스서비스 설계Next.jsSupabaseGemini
서비스 사용해보기 ↗
AI 사이즈 추천 제작 산출물

문제

살미달라를 운영하며 사이즈 문의와 교환 요청을 반복적으로 겪었다.

역할

공동 개발 (2인 팀) · 서비스 기획 · 풀스택 구현

결과

신체 정보 + 상품 URL → 추천 → 근거 확인으로 이어지는 4단계 플로우를 실서비스(pullsize.kr)로 구현·운영 중입니다.

산출물

01 · Results

제작 성과

신체 정보 + 상품 URL → 추천 → 근거 확인으로 이어지는 4단계 플로우를 실서비스(pullsize.kr)로 구현·운영 중입니다.

검증 단계

'추천 근거 제시가 구매 판단 속도를 높인다'는 가설을 사용자 피드백으로 검증하는 단계입니다.

기술 구현

Next.js 16 · React 19 · TypeScript · Supabase · Gemini로 인호와 2인이 함께 구현했고, cheerio로 상품 페이지 실측 치수를 파싱했습니다.

검증 지표

추천 실행 수 · 제휴 링크 클릭 · 정확도 피드백을 GA 이벤트로 계측 설계 완료했습니다. 사용자 수·전환율 등 절대 지표는 추가 검증이 필요합니다.

02 · Problem

살미달라를 운영하며 사이즈 문의와 교환 요청을 반복적으로 겪었다. 온라인 의류 구매자는 브랜드마다 다른 실측 기준과 착용감 때문에 사이즈 선택을 확신하기 어렵다. 상품 상세페이지의 치수표만으로는 내 체형에 맞는 사이즈와 여유도를 판단하기 어렵고, 이는 구매 망설임과 교환·반품으로 이어질 수 있다.

03 · Approach

  1. 01

    입력 흐름 설계

    상품 URL과 키·몸무게·평소 착용 사이즈 등 최소 입력만으로 추천을 시작하는 폼 구성

  2. 02

    상품 정보 해석

    상품 페이지의 실측 치수와 사용자의 신체 정보를 비교할 수 있도록 데이터 구조 정의

  3. 03

    추천 기준 설계

    사이즈 후보별 적합도와 여유도를 계산하고 추천 이유까지 보여주는 기준 설계

  4. 04

    결과 UI 구현

    추천 사이즈, 여유도, 신체 부위별 핏 정보를 한 화면에서 이해할 수 있도록 시각화

  5. 05

    MVP 검증

    실제 쇼핑 상황에서 사용자가 입력 → 추천 → 판단까지 이어질 수 있는 최소 기능 제품으로 구현

서비스 플로우

사이즈명이 아니라 판단 근거까지 주는 4단계 추천 흐름.

  1. 01

    정보 입력

    키·몸무게·평소 사이즈 등 신체 정보와 상품 URL을 최소 입력으로 받는다.

  2. 02

    데이터 추출

    cheerio로 상품 페이지의 실측 치수를 파싱하고 비교 가능한 기준으로 정규화한다.

  3. 03

    AI 추천

    신체 정보와 상품 치수를 매칭해 사이즈 후보별 적합도·여유도를 산출한다.

  4. 04

    근거 제시

    추천 사이즈와 부위별 핏·여유도, 추천 이유를 한 화면에서 보여준다.

04 · Key Insight

01

사이즈표는 있는데, 내 치수와 연결할 길이 없었다

대부분의 쇼핑몰이 사이즈표를 제공하지만, 내 치수와 상품 치수를 연결하는 방법은 부족했다. 사용자는 숫자를 보고도 여전히 불확실함을 느꼈다.

02

'왜 M인지'를 보여줘야 추천을 믿을 수 있었다

"그냥 M 추천"보다 "어깨 너비 기준으로 M을 추천하는 이유"가 있을 때 판단이 빨라졌다. 추천값보다 설명 가능한 근거 구조가 더 중요했다.

03

AI 추천은 검증 기준이 있어야 안정됐다

AI가 빠르게 결과를 만들더라도, 무엇이 맞는지 판단하는 기준은 사람이 세워야 했다. 한 번은 파서가 국제 사이즈 환산표를 실제 치수로 착각해 어깨 44, 가슴 5 같은 값을 추천으로 내보냈고, 이후 검증 장치를 붙여 같은 오류가 반복되지 않게 했다.

04

배포는 끝이 아니라 계측의 시작이다

배포 직후 가장 먼저 한 일은 기능 추가가 아니라 GA 이벤트 설계였다. 추천 실행(recommend_submit/success)과 제휴 클릭(cta_click)을 이벤트로 심어, 어느 단계에서 사용자가 이탈하는지 보이는 상태를 먼저 만들었다.

서비스 구조

Claude Code로 프론트·백엔드를 2인이 공동 구현하고 Vercel에 배포한 풀스택 구조.

빌드 · 배포
Claude Code 기반 2인 공동 구현GitHub Actions CI/CDVercel
프론트엔드
Next.js 16 / React 19추천블로그어드민
API
Vercel Functions추천이미지 기반 추천피드백제휴 리다이렉트블로그어드민
데이터 · AI
SupabaseGemini 사이즈 추천cheerio 치수 파싱
측정 · 전환
제휴 → 구매 전환GA 분석
성장 루프 인스타(@pullsize.official) → 블로그 유입 → AI 사이즈 추천 → 구매 전환 → 콘텐츠 재생산

05 · Contribution

Role
공동 개발 (2인 팀) · 서비스 기획 · 풀스택 구현
Scope
문제 정의·사용자 입력 플로우·추천 결과 UX·MVP 화면 설계부터 프론트엔드·백엔드·배포까지 인호와 2인이 풀스택으로 공동 구현 (Claude Code 활용)
Output
2인 공동 개발 · 실서비스 배포 (pullsize.kr), AI 추천 결과 화면, 메인 입력 화면

다음 프로젝트

AI 콘텐츠 생성 자동화