본문 바로가기
카테고리 없음

AI 바이브코딩으로 출산휴가 계산기 만들기: PRD, 디자인, 첫 제작 시행착오

by 블루버드인서울 2026. 3. 20.

AI 바이브코딩 시작, 어디서부터 손대야 할지 막막했던 첫 제작

이번 페이지를 만들기 시작했을 때 가장 먼저 든 감정은 기대보다 막막함이었습니다. 출산휴가 계산기라는 결과물은 머릿속에 비교적 분명하게 있었지만, 그걸 어떤 순서로 만들고 무엇부터 정리해야 하는지는 전혀 감이 오지 않았습니다. 특히 저는 처음 해보는 바이브코딩이었기 때문에 개발자들이 익숙하게 쓰는 용어부터 낯설게 느껴졌습니다. PRD, 스택, 라우팅, 배포 같은 단어들이 대화 속에서는 자연스럽게 오가는데, 저는 그 말을 들을 때마다 일단 멈추고 의미부터 다시 확인해야 했습니다. 저는 그냥 필요한 기능을 말하면 알아서 화면이 나올 줄 알았는데, 실제로는 무엇을 만들고 왜 그렇게 만들어야 하는지 훨씬 더 세밀하게 설명해야 했습니다.

이 과정에서 가장 크게 느낀 건 AI와 대화한다고 해서 모든 준비 과정이 사라지는 것은 아니라는 점이었습니다. 오히려 처음에는 무엇을 요청해야 하는지도 잘 몰라서, 말 한마디를 정리하는 것조차 쉽지 않았습니다. 저는 계산기라는 단순한 기능을 떠올렸지만, AI는 그 기능을 서비스로 만들기 위해 더 많은 구조를 요구했습니다. 페이지 목적, 타깃 사용자, 핵심 기능, 예외 처리까지 하나씩 정리하다 보니, 처음 생각했던 것보다 훨씬 많은 결정을 내려야 했습니다. 그때 저는 내가 만들고 싶은 건 분명한데, 그것을 만드는 언어로 바꾸는 일은 전혀 다른 문제라는 걸 처음 체감했습니다. 지금 돌아보면 이 시작 단계에서 가장 어려웠던 건 기술이 아니라, 생각을 구조로 바꾸는 일이었습니다.

PRD 작성, 잘 쓰고 있는지조차 확신이 없었던 정리 과정

챗GPT와 대화를 이어가며 결국 PRD 초안은 만들 수 있었습니다. 하지만 문서를 만든 것과 문서를 이해하는 것은 또 다른 일이었습니다. 저는 PRD를 검토해본 경험이 거의 없었기 때문에, 지금 적고 있는 내용이 정말 필요한 내용인지, 혹은 빠진 게 있는지 판단하기 어려웠습니다. 한 문장을 고칠 때도 이게 더 명확해진 건지, 아니면 그냥 말만 길어진 건지 헷갈릴 때가 많았습니다. 그래서 PRD를 만드는 과정은 단순히 문서 작성이라기보다, 제가 무엇을 원하는지 스스로 확인하는 과정에 가까웠습니다.

특히 불필요한 기능을 지우는 일이 생각보다 어려웠습니다. 처음에는 이것도 넣고 싶고 저것도 넣고 싶었지만, 실제로는 핵심 기능만 남겨야 했습니다. 성별 선택, 휴가 일수 입력, 시작일 선택, 종료일 계산처럼 정말 필요한 것만 남기는 작업이 필요했습니다. 저는 기능을 많이 넣는 게 좋은 기획이라고 막연히 생각했는데, 실제로는 반대였습니다. 더 중요한 건 사용자에게 당장 필요한 한 가지를 분명하게 해결해 주는 것이었습니다. 저는 그 과정에서 PRD가 단순히 개발자에게 전달하는 문서가 아니라, 스스로도 방향을 잃지 않기 위해 꼭 필요한 기준선이라는 점을 배웠습니다. 완벽하게 이해한 상태는 아니었지만, 최소한 무엇을 만들고 무엇은 지금 만들지 않을지를 정하는 데 PRD가 큰 역할을 했습니다.

디자인 설명, 원하는 방향은 있는데 언어로 풀어내기 어려웠던 디자인

페이지를 어느 정도 만들고 나니 이번에는 디자인이 문제였습니다. 결과물은 나왔지만, 제가 원하던 느낌과는 조금 달랐습니다. 문제는 싫다는 감정은 분명한데, 무엇이 어떻게 다른지 정확하게 설명하기가 어렵다는 점이었습니다. 저는 파스텔 무드, 핑크 톤, 유리 재질 같은 이미지는 떠올릴 수 있었지만, 그걸 컴퓨터가 알아듣는 수준으로 묘사하는 일은 또 완전히 다른 문제였습니다. 참고 사이트를 보여주고 분위기를 설명해도, 결과물이 제가 머릿속에서 상상한 그림과 정확히 일치하지는 않았습니다.

이 과정에서 저는 디자인 감각보다 디자인 언어가 더 중요하다는 걸 느꼈습니다. 내가 예쁘다고 느끼는 것과, 그 예쁨을 재현 가능한 문장으로 설명하는 것은 완전히 다른 능력이었습니다. 저는 솔직히 이 부분에서 조금 포기한 것도 있습니다. 디자인이 중요하지 않다는 뜻은 아니었지만, 이번 프로젝트에서는 계산기 기능이 훨씬 우선순위가 높았기 때문입니다. 그래서 완성도를 끝까지 끌어올리기보다는, 일단 사용할 수 있는 구조와 흐름을 만드는 쪽에 더 집중했습니다. 다만 다음에 다시 비슷한 작업을 한다면, 저는 기능만 되는 결과물보다 조금 더 의도한 감각이 살아 있는 화면을 만들고 싶습니다. 그때는 참고 레퍼런스를 모으는 것에서 끝내지 않고, 색감과 질감, 정보 위계를 더 구체적으로 설명하는 연습부터 해보고 싶습니다.

첫 제작 시행착오, 결국 만들면서 배운 것은 기술보다 언어였습니다

이번 작업을 돌이켜보면 가장 큰 시행착오는 기술적인 실수보다도, 제가 원하는 것을 정확하게 설명하지 못했다는 데 있었던 것 같습니다. 처음에는 AI에게 잘 말하면 빠르게 완성될 거라고 기대했지만, 실제로는 제가 모호하게 말할수록 결과도 모호해졌습니다. 반대로 목적, 기능, 우선순위, 디자인 방향을 조금 더 분명하게 말했을 때 결과도 훨씬 나아졌습니다. 저는 이 과정을 통해 바이브코딩이 마법처럼 자동으로 결과를 만들어주는 방식이 아니라, 생각을 잘 정리한 사람이 더 좋은 결과를 얻는 방식이라는 점을 배웠습니다.

무엇보다 저는 이번 경험을 통해 내가 아직 모르는 게 많다는 사실을 꽤 분명하게 확인했습니다. 그런데 이상하게도 그게 크게 나쁘게 느껴지지는 않았습니다. 오히려 무엇이 어려운지 정확히 알게 됐다는 점에서 다음 작업의 출발점은 더 선명해졌습니다. 저는 PRD를 더 잘 읽는 법도 배워야 하고, 디자인을 더 구체적으로 설명하는 법도 익혀야 합니다. 또 개발 과정에서 용어에 겁먹지 않고 질문하는 태도도 필요하다고 느꼈습니다. 처음 만드는 계산기 페이지는 완벽하지 않았지만, 적어도 어디에서 막히는지, 무엇을 더 공부해야 하는지는 확실히 알게 됐습니다. 그런 점에서 이번 첫 제작은 결과물 자체보다도 다음 결과물을 더 잘 만들기 위한 연습으로 남았습니다.

 

조심스럽게 결과물 링크와 이미지를 첨부해봅니다.

직접 만든 출산휴가 계산기 링크: https://parental-leave-calculator-bxssi4qja-miminodes-projects.vercel.app/parental-leave

개발 완료한 계산기 페이지 캡처