brunch

[바이브 코딩] 코딩 못하는 PM,점심 랜덤 PICK

반복되는 점심 스트레스를, ‘의사결정 자동화 도구’로서 해결하기

by howwtokk
오늘 점심 뭐 먹을까?

막내들은 점심메뉴를 고르기 위해 친구들의 도움을 받아 입사 전회사 근처 맛집 리스트를 작성해둡니다. 제 얘기 아닙니다. 저는 행복합니다. 오해하지 말아주세요.


매일 반복되는 점심메뉴 회의.
"오늘 뭐 먹을까요?"라는 말 한마디로 회의가 시작되고


말 많은 사람이 없으면 메뉴가 정해지지 않는 그 풍경.

사소해 보이지만, 점심 메뉴 결정은 팀의 리듬과 업무 흐름에 영향을 줍니다.


그래서 이 프로젝트는 그 사소한 지점에서 출발했습니다. 단순한 재미 요소가 아닌, 모두가 납득할 수 있는

의사결정 자동화 도구가 있으면 어떨까?


'누구도 탓하지 않고, 모두가 만족할 수 있는 방식이 필요하겠다!' 라는 기능 설계는 이러한 목표에서 시직하게 되었습니다.


① 고르지 말고, 뽑게 만들자


가장 먼저 UI의 핵심 구조를 ‘선택’이 아닌

‘추첨’으로 잡았습니다.
고민 끝에 선택한 것은 돌림판 방식입니다.

이 방식이 주는 장점은 분명했습니다.


무작위 추첨이라는 책임 분산

팀 분위기를 전환해주는 게임 요소

결정 이후 생길 수 있는 불만을 줄이는 장치


비주얼보다 더 중요했던 건, 돌림판이 만들어내는 ‘합의된 의사결정’의 구조였습니다.

‘선택 피로’를 줄이는 방식, 그게 핵심이었습니다.



② 메뉴를 골랐는가? 모두 같은 주문 화면을 보게 하자

팀 단위 점심 선택에서 종종 발생하는 문제는 ‘정보의 비대칭’입니다.


누군가는 A를 말하고, 누군가는 B를 추천하며, 정작 메뉴나 가격은 각자 다른 창에서 확인하고 있습니다.

이 문제를 해결하기 위해 ‘공동 입력 → 자동 정리 → 단일 출력’ 구조로 기능을 설계하였습니다.


모든 팀원이 하나의 페이지 안에서 자신의 주문 정보를 입력합니다.

브랜드, 메뉴, 추가 반찬, 가격을 입력하고 추가금도 자동 합산됩니다.

마지막에는 브랜드별 총합과 지도, 전화번호까지 자동으로 출력되어 최종 주문자가 무엇을 어디서 어떻게 주문할지가 한 화면에 정리됩니다.


정보를 확인하고 재확인을 하는 과정 자체가 줄어든다는 점, 이는 곧 과정의 생산성 향상으로 이어진다고 판단했습니다.




③ AI를 통해 탐색 비용을 낮추자

어떤 날은 돌림판도, 단체 주문도 귀찮게 느껴집니다.

때로는 외근을 나가면서, 새로운 지역의 맛집 탐색이 필요할 때가 있습니다.


이럴 때 필요한 것은 ‘고르기 위한 정보 탐색’이 아니라 고르지 않아도 되는 추천입니다.

그래서 AI 챗봇을 통한 추천 플로우를 함께 설계하였습니다.

assets%2Ftask_01k33qzrngf9v9gdcsy14wqdq8%2F1755693771_img_0.webp?st=2025-08-20T11%3A34%3A11Z&se=2025-08-26T12%3A34%3A11Z&sks=b&skt=2025-08-20T11%3A34%3A11Z&ske=2025-08-26T12%3A34%3A11Z&sktid=a48cca56-e6da-484e-a814-9c849652bcb3&skoid=8ebb0df1-a278-4e2e-9c20-f2d373479b3a&skv=2019-02-02&sv=2018-11-09&sr=b&sp=r&spr=https%2Chttp&sig=j4nrcPPyUyF3WGDEc90oDNOwNTVBa8pHIp8mAdbutqo%3D&az=oaivgprodscus

사용자는 질문 형태의 프롬프트 중 하나를 클릭하거나, 직접 질문을 입력할 수 있습니다.

복사 버튼을 누르면 자동으로 질문이 클립보드에 저장되어, 사용자는 브라우저에서 빠르게 탐색을 이어갈 수 있습니다.

예를 들어 “비 오는 날 따뜻한 국물 먹고 싶은데?”처럼 자연어로 질문을 입력하면, 바로 아래에서 ChatGPT / 구글 검색 / 네이버 지도로 연결되도록 구성했습니다.


이 구조는 AI가 답을 주는 방식이 아니라, ‘사람이 탐색을 시작하기 쉬운 질문’을 미리 설계한 구조입니다.

추천을 개인화할 수는 없지만, 탐색의 진입장벽을 낮추는 데 집중했습니다.



④ 그래서 직접 만들어봤습니다: 메뉴 결정 → 주문까지

이 가설을 검증해보기 위해, 실제로 점심 메뉴 추천 앱을 만들었습니다.

보통의 순서라면, 기획자는 "기능정의서를 먼저 만들고 디자이너에게 화면을 요청하고,

개발자와 구현 가능성을 검토한 뒤 일정을 따진다”는 순서를 거칩니다.

assets%2Ftask_01k33qnxsteac8n5vr7wh13b8e%2F1755693487_img_1.webp?st=2025-08-20T11%3A27%3A42Z&se=2025-08-26T12%3A27%3A42Z&sks=b&skt=2025-08-20T11%3A27%3A42Z&ske=2025-08-26T12%3A27%3A42Z&sktid=a48cca56-e6da-484e-a814-9c849652bcb3&skoid=8ebb0df1-a278-4e2e-9c20-f2d373479b3a&skv=2019-02-02&sv=2018-11-09&sr=b&sp=r&spr=https%2Chttp&sig=mv%2FoJxqxxOeVL4Ct0jZysf8AYNnZjPm%2BmxApG9BYQt4%3D&az=oaivgprodscus

하지만 이번에는 그 순서를 거꾸로 진행했습니다. 기획자의 손으로 직접 구현하고, 그 안에서 설계를 다듬었습니다. 바이브코딩을 통해 텍스트 명령으로도 버튼을 만들고, 기능을 연결하며 앱을 구성할 수 있었습니다.


전체 프로그램은 ‘회사에서 일하는 팀원들의 점심 고민’을 해결하기 위한 도구,

<점심픽 Lunch Pick> 이라는 이름으로 제작하였습니다.


‘메뉴 선정 → 개인 입력 → 단체 주문 → 대안 탐색’까지
점심시간에 메뉴 결정 → 주문까지 모든 흐름을 하나의 흐름으로 정리한 점이 핵심입니다.


'메뉴 결정 → 주문까지' 기능설계 구조화


⑤ 기능 설계는 이렇게 진행하였습니다: 기능정의서


[점심픽 Lunch Pick 기능 정의서]

1. 오늘의 런치 돌림판 (예시 지역: 강남역 기준)

강남 지역 맛집 72곳의 점심 메뉴 데이터를 사전 등록하여 하단의 '와라라라락!' 버튼 클릭 시 돌림판이 회전됨.


2. 단체 주문 입력

각 팀원이 원하는 메뉴 정보를 입력할 수 있는 기능. 입력항목에 맞게 최신 가격표 기준 금액이 자동 계산됨.


3. 오늘 단체 주문 요약

모든 팀원들이 입력한 주문 내역을 요약하여 볼 수 있음. 오늘의 주문자가 전체 금액 및 수량 확인 후, 해당 매장 전화번호/ 지도/ 영업 정보를 빠르게 판단하여 전화 주문 가능


4. AI 챗봇: 지역 맛집 추천 도우미 (외근 예시 지역: 별내역 기준)

메뉴 선택조차 번거로운 사용자를 위한 AI 챗봇 기능. 클릭 후 사용자 상황에 맞는 검색을 빠르게 유도하는 것이 목적.

⑥ 빠르게 만들고, 빠르게 고쳤습니다


제품의 가치는 기능의 양이 아니라 피드백 속도가 좌우합니다.

사이클 타임을 줄일 수록 성과는 빨라집니다.


예를 들어 이런 일이 있었습니다.

"이 버튼 색 너무 연해요!"
→ 텍스트로 명령해 10초 안에 수정.
"추가 반찬 고르기 너무 불편해요."
→ 드롭다운 대신 자동 필터 구조로 재설계 → 바로 테스트.
"폰트가 잘려요!"
→ 텍스트 길이에 따라 버튼 사이즈 자동 조정.


이 모든 과정은 디자이너, 개발자를 거치지 않았습니다. 기획자인 제가 직접 고치고, 반영하고, 팀원들과 점심시간에 곧장 써봤습니다. 바이브코딩은 이런 실험을 가능하게 했습니다. 단순히 코드를 안 짜도 되는 툴이 아니라, “내 머릿속 기능”과 “실제 작동하는 화면” 사이의 간극을 없애주는 도구였습니다.

assets%2Ftask_01k33qhcr8ee7bp791cxzktee4%2F1755693352_img_0.webp?st=2025-08-20T11%3A30%3A04Z&se=2025-08-26T12%3A30%3A04Z&sks=b&skt=2025-08-20T11%3A30%3A04Z&ske=2025-08-26T12%3A30%3A04Z&sktid=a48cca56-e6da-484e-a814-9c849652bcb3&skoid=8ebb0df1-a278-4e2e-9c20-f2d373479b3a&skv=2019-02-02&sv=2018-11-09&sr=b&sp=r&spr=https%2Chttp&sig=2a5ZS%2FzgIxeQyRN1sQ3t5ZelW9VNcYAumTqOM%2Fh5MDg%3D&az=oaivgprodscus
예측 → 시연 → 발견 → 수정 → 재시연 → 개선

이 사이클 타임이 짧아질수록, 성과는 더 빨라졌고, 기획 의도는 더 명확해졌습니다.

돌아가는 화면을 보며 별도의 티켓을 열 필요도, 슬라이드로 기능 정의서를 작성할 필요도 없었습니다.


필요한 건, 단지 고쳐야겠다는 직감과 바로 수정해볼 수 있는 실행 환경뿐이었습니다. 그리고 그 환경을 스스로 만들 수 있었다는 점에서, 이번 프로젝트는 ‘실행하는 PM’으로서 가장 빠른 학습이자 증명이었습니다.


⑦ 결국, 문제의 본질을 아는 사람이 가장 빨리 증명합니다.


이번 <점심픽 LunchPick> 을 만들면서 가장 크게 느낀 건,

문제를 가장 잘 아는 사람이 가장 빠르게 실행할 수 있다는 점이었습니다.


기획자가 바이브코딩으로 만든 시연 화면을 보여주는 순간, 팀 안에서 회의의 흐름은 달라졌습니다.

“이걸 왜 만들었어요?”에서
“이걸 어떻게 더 잘 만들 수 있을까?”로.


기획자는 의도를 말로 설명하지 않았습니다.
작동하는 시연 화면 하나로 모두가 이해할 수 있었습니다.

assets%2Ftask_01k33qgtyqermt1pq8kbkfyngd%2F1755693288_img_0.webp?st=2025-08-20T11%3A30%3A04Z&se=2025-08-26T12%3A30%3A04Z&sks=b&skt=2025-08-20T11%3A30%3A04Z&ske=2025-08-26T12%3A30%3A04Z&sktid=a48cca56-e6da-484e-a814-9c849652bcb3&skoid=8ebb0df1-a278-4e2e-9c20-f2d373479b3a&skv=2019-02-02&sv=2018-11-09&sr=b&sp=r&spr=https%2Chttp&sig=Pl%2B289Z%2Bu4846ZKnkNvuq%2FUkWqar4t1joBoBwehGVz8%3D&az=oaivgprodscus

디자이너는 어떤 정보에 시각적 우선순위를 줄지 바로 알 수 있었고

개발자는 어떤 조건에서 무슨 동작을 해야 하는지 한눈에 파악했습니다

이 외의 팀원들은 실제 점심 시간에 써보며 바로 불편함을 짚어줄 수 있었습니다


이처럼 동일한 ‘참조 화면’을 기준으로 피드백 → 수정 → 재시연의 루프를 빠르게 돌릴 수 있었기에,

기획 의도와 사용자 경험의 간극을 빠르게 줄일 수 있었습니다.


왜 PM이 바이브코딩을 돌려야 하는가?

assets%2Ftask_01k33qnxsteac8n5vr7wh13b8e%2F1755693487_img_0.webp?st=2025-08-20T11%3A27%3A42Z&se=2025-08-26T12%3A27%3A42Z&sks=b&skt=2025-08-20T11%3A27%3A42Z&ske=2025-08-26T12%3A27%3A42Z&sktid=a48cca56-e6da-484e-a814-9c849652bcb3&skoid=8ebb0df1-a278-4e2e-9c20-f2d373479b3a&skv=2019-02-02&sv=2018-11-09&sr=b&sp=r&spr=https%2Chttp&sig=FoNMSVIGBqNtrhXsRazF9EQ0xQj0r2x2T5VZaT2V%2Bb8%3D&az=oaivgprodscus

PM이 바이브 코딩을 직접 만져야 하는 이유는 분명합니다. 프로덕트의 문제, 가설, 지표를 가장 선명하게 이해하고 있는 사람이기 때문입니다. 무엇이 핵심 경험이고, 무엇이 가설인지 판단하여 그 기준이 흐트러지지 않도록 제품을 끌고 가는 사람이기 때문입니다. 문제의 본질을 가장 잘 아는 사람만이 문제를 가장 빠르게 증명할 수 있기 때문입니다.




✅ 기획자라면 꼭 알아야 할 바이브코딩 & 노코드 실무자료 모음


1) 바이브코딩이란? 개념부터 쉽게 이해하기

비개발자를 위한 입문용 개념 정리 콘텐츠

https://brunch.co.kr/@jaylep/146


2) [서비스 기획 에피소드2] 서비스 기획자가 알아야할 바이브 코딩에 대해서

https://connectorsforme.com/%EC%84%9C%EB%B9%84%EC%8A%A4-%EA%B8%B0%ED%9A%8D-%EC%97%90%ED%94%BC%EC%86%8C%EB%93%9C-2-%EC%84%9C%EB%B9%84%EC%8A%A4-%EA%B8%B0%ED%9A%8D%EC%9E%90%EA%B0%80-%EC%95%8C%EC%95%84%EC%95%BC%ED%95%A0/?utm_source=chatgpt.com


3) 실리콘밸리 개발자처럼 바이브코딩 하는 방법 - 커리어해커 알렉스

https://blog.highoutputclub.com/vibecoding-with-ai-replit-careerhackeralex/?utm_source=chatgpt.com


4) AI로 개발하니까 쉽던데? (feat. 바이브 코딩)

https://letter.wepick.kr/510/4433437/?utm_source=chatgpt.com


keyword
작가의 이전글[신입PM] 와이어프레임보다 어드민 구조화가 먼저입니다