본문 바로가기
사이드 프로젝트

AI 감사일기 서비스, 기획부터 개발까지 1. 기획, 프로토타입 개발(Lovable)

by 카프리썬_ 2025. 7. 28.
728x90
728x90

최근에 커서를 사용하기 시작했다. 덕분에 평소에 만들어보고 싶었던걸 쉽게 시작할수 있게 되었다.

가장 먼저 개발한 첫번째 서비스는 [AI 감사일기]이다! 

 

이번 글에서는 이 서비스를 개발하게된 배경부터 시작해서 서비스를 기획하는 과정을 담아보려고 한다.

특히 LLM 서비스이기 때문에 프롬프트를 기획하는 부분도 필요했다.

일단 lovable과 superbase까지 연결해서 디자인까지 적용한 프로토타입까지 간단하게 만들어볼수 있었다.

    1. 개발 배경 

    1. 노션 템플릿으로 작성하기

    나는 자기전에 오늘하루 감사했던 일들을 적는 편이다.

    노션에서 템플릿을 만들어서 매일 같은 형식으로 작성할수 있도록 해두고 노션에 저장한다. 

     

    2. 한줄 일기 직접 요약하기

    이렇게 감사했던 일을 쓰니까 결국 일기가 되었다. 그런데 길면 다시 돌아보지 않을것 같아서 오늘 하루를 한줄로 요약하고 있었다.

    뿐만 아니라 그날 내가 가장 많이 느꼈던 기분도 기록하고 있었다. 생각보다 내가 너무 무감정하구나를 깨달았기 때문이다.

    그래서 이렇게 날짜별로 기분과 한줄일기를 노션에서 아카이브를 해두고 매월 회고를 할때 돌아보고 있다. 

     

    3.감정 통계 수동으로 기록하기

    추가로 올해부터 감정에 대한 점수를 기록하고 통계를 집계하고 있었다.  나름 기분 가이드라며 점수집계표도 만들었다..

    그래서 월간 회고를 할때 이번달 어떤 감정이 가장 많았는지 수동으로 통계를 집계했다.

    처음엔 기분별로 수치화를 해서 점수를 매겼는데 직관적으로 이번달은 어땠는지가 와닿지 않아서 없앴다.

     

    4.감사회고 커뮤니티에서 공유하기

    사실 감사회고를 하며 슬랙으로 공유를 하고 있다. 혼자 하는게 아니라는 생각만으로도 꾸준히 할수 있는 동기부여가 되었다.

     

    하지만 일일이 노션에서 감사일기를 작성하고, 다시 슬랙으로 공유하는것도 번거로웠다.

    뿐만 아니라 월별 회고를 할때 감정 데이터를 수동으로 집계하는게 가장 귀찮았고, 직접 한줄 일기를 요약하는는것도 깜빡하기도 했다. 

    그래서 이렇게 노션으로 감사일기를 썼던걸 나만의 서비스로 만들어볼까 했다.

    자동으로 통계정보도 확인할수 있고, 심지어 한줄일기 요약은 AI가 해주는 LLM서비스인 것! 

     

    2. 서비스 기획

    이제 직접 서비스를 기획부터 시작해야한다. "제품"을 만든다고 하니 이런 생각의 흐름으로 구체화했다. 

    누구에게 어떤 문제를 어떻게 풀것인가, 그리고 왜 이 문제를 풀 것인가?

    역설적으로 커서를 통한 바이브코딩의 시대가 되면서 만들기는 쉬워지기 때문에 '개발 동기'가 점점 더 중요해지고 있다.

     

    2.1. 전체 서비스 기획

    AI와 함께 나의 아이디어를 기반으로 서비스를 기획했다. 우선 나를 위한 서비스로, 핵심 기능은 아래와 같이 3가지만 뽑았다.

    • 감사 입력 인터페이스 : 나/타인/상황에 대한 감사항목, 감정 선택 (행복/뿌듯/편안/기쁨/피곤/우울)
    • AI 기반 한줄 요약 : 감사 내용을 바탕으로 오늘의 일기를 한줄로 요약
    • 감정 분석 리포트 : 월별 주요 감정 확인

    이런 주요 기능을 가지고 감사회고를 노션으로 불편하게 쓰고 있었던 문제를 해결하고자 했다. 감정 일기를 더 쉽게 쓸수 있도록 자동화하고, 내가 직접 일기를 한줄로 요약해야 했던걸 AI가 자동으로 일기를 한줄로 요약해준다면  편리 할 것 같았다.

     

     

    2. 2. 프롬프트 기획

    추가로 AI 한줄 일기 요약 기능에 대해서 구체적으로 핵심 의도와 목표를 좀 더 생각해봤다.

    • 기능 의도 : 훗날 이 문장 하나만 보더라도 그날 어떤 일이 있었고, 어떤 감정이였는지를 생생하게 떠올릴수 있게 도와주기
    • 목표 : 단순 요약이 아니라 감정, 행동의 맥락, 개인의 해석 까지 담고 있는 서사 요약을 AI가 생성

    추가로 여러가지 항목(나/타인/상황)중에 가장 많이 입력한 항목에 대해서 집중적으로 요약하거나, 문장이 너무 길지 않은 한줄(40자내외)이였으면 했고, 말투와 유머의 톤까지 세부적인 조절을 했다.

    당신은 감정에 섬세하게 반응하는 고급 핵심 요약 전문가입니다.
    
    사용자는 하루 동안 다음 네 가지 정보를 기록했습니다:
    - 나에 대한 감사  
    - 타인에 대한 감사  
    - 상황에 대한 감사  
    - 감정 (하루의 전반적인 정서: 행복, 뿌듯, 기쁨, 편안, 피곤, 우울 중 하나)
    
    당신의 역할은 이 정보를 바탕으로, **사용자의 하루를 1문장(40자 내외)**으로 요약하는 것입니다.
    ---
    
    ## ✅ 반드시 반영할 요소:
    1. **가장 많이 입력한 감사 항목**에 대해 집중적으로 요약할 것
    2. **실제로 일어난 일 또는 구체적인 행동 또는 인물**을 요약 안에 포함시킬 것  
    3. 그 일이 사용자의 하루에 어떤 **의미**였는지를 **간접적으로 묘사**할 것  
    4. 문장은 반드시 **40자 내외, 1문장**, 느낌표/의문문/말줄임표 없이 작성 
    5. 말투는 **밝고 긍정적이면서 따뜻하게** 유머는 **유쾌하고 솔직하게**, **희망적인 미래를 암시**할 것  
    
    --
    ### 예시 입력 4:
    
    - 나에 대한 감사: 하반기 목표를 다시 정리하며 희망을 찾는 나에게 감사하다  
    - 타인에 대한 감사: 커리어적으로 좋은 제안을 해주신 분에게 감사하다.
    - 상황에 대한 감사: 오랜만에 새로운 업무를 받을 수 있어서 감사하다  
    - 감정: 피곤
    
    ### 출력 예시:
    
    무거운 하루 끝에, 다시 한번 해보고 싶은 마음이 남았다

     

    2.3. PRD 작성

    lovable에서 단계별로 작성 할 수 있도록 서비스의 입력,처리,출력 과정이 명확하게 드러나도록 작성했다.

    추가로 gemini-2.0 flash API를 사용해서, 브라우저에서 사용자가 Api key를 입력하고 저장해서 사용할수 있도록 했다.

    2.4. 프로토타입 개발

    lovable은 프롬프트를 통해 프로토타입을 뚝딱 만들수 있게 해주는 툴이다. 하루에 5회 무료이다.

    PRD를 아주 구체적으로 잘 작성했다면, 그걸 바탕으로 디자인까지 적용된 프로토타입을 실시간으로 확인해볼수 있다.

     

     

    미지막으로 이제 나의 깃허브와 연동한다. 깃허브 주소를 입력해주면 된다. 

    그러면 lovable에서 작성한 프론트 디자인을 바로 프로젝트를 클론해서 가지고 올수 잇게 된다.

     

    그러면 이제 깃허브에 있는 프로젝트를 다시 커서로 가지고와서 추가적인 개발을 계속 진행할수 있다.

    다음글에서는 커서로 프론트와 백엔드를 다듬고 추가적인 기능을 개발하는 과정을 진행해보겠다.

     

     

     

     

    728x90