[에이전트 제작기 #5] 화면 붙이기 — 드디어 '앱'이 되다 (MVP v1.0)

#4 데이터 연결까지 오면 기능은 다 됐지만, 아직 나만 터미널에서 쓸 수 있어요. 이번 편에서 화면(UI) 을 붙여, 동료 누구나 쓰는 MVP v1.0 으로 완성합니다. 🎉

🎯 목표: “쓸 수 있는” 앱으로

기능이 있어도 남이 못 쓰면 제품이 아닙니다. 최소한의 화면만 붙입니다.

[ 지표 붙여넣기 / CSV 업로드 ]
            ↓
        [ 요약 생성 ] 버튼
            ↓
   ┌───────────────────────┐
   │  요약 초안 (수정 가능)     │  ← 사람이 검수·편집
   └───────────────────────┘
       [ 복사 ]  [ 다운로드 ]

🛠️ 어떻게 만들었나 — 바이브 코딩

코드를 직접 안 짜고 바이브 코딩으로 화면을 생성했습니다. 프롬프트는 이런 식:

지표를 붙여넣는 텍스트 영역과 'CSV 업로드' 버튼,
'요약 생성' 버튼, 그리고 결과를 보여주고 수정할 수 있는 영역을 가진
간단한 한 페이지 웹앱을 만들어줘. 결과 아래엔 복사/다운로드 버튼.
디자인은 깔끔하고 모바일에서도 보기 좋게.

핵심 UX 원칙 하나: 결과는 반드시 ‘수정 가능’하게. AI 초안을 사람이 검수·보정하는 흐름(문제 정의에서 정한 사람 몫)을 화면에 그대로 녹였습니다.

⏱️ 성과 측정 (before/after)

#1에서 세운 목표를 실제로 재봤습니다.

구간	Before(수작업)	After(MVP v1.0)
데이터 정리·요약 초안	~90분	~10분
검수·다듬기	~40분	~30분
합계	~130분	~40분

목표(150분→60분)를 초과 달성. 남은 시간은 ‘숫자 정리’가 아니라 ‘해석과 의사결정’ 에 쓰게 됐습니다. 이게 이 프로젝트의 진짜 목적이었어요.

🧱 MVP v1.0에 담긴 것 / 아직 없는 것

• ✅ 지표 입력 → 요약 초안 → 검수 → 복사/다운로드
• ✅ 좋은 프롬프트(v3) + 데이터 연결
• ⏳ VOC 자동 분류 (다음)
• ⏳ 대시보드 실시간 연동, 사용자 계정

🔭 다음 단계

• #6: 동료에게 실제로 써보게 하고 피드백 반영 (사용자 테스트)
• 이후 VOC 분류 도구를 붙여 멀티 도구 에이전트로 확장

첫 주 만에 면접·포트폴리오에서 시연 가능한 MVP 하나가 나왔습니다. 완벽하진 않지만, 1인 AI 기업 인사이트에서 배운 대로 “완벽한 하나보다 작동하는 최소한” 을 먼저 만든 게 주효했어요.