가족의 기억 기록 서비스 첫걸음

소개

11.11일에 1차수 강의를 듣고 랜딩페이지를 만드는 숙제를 하기 위해서 Figma Make를 써보았습니다.

진행 방법

어떤 도구를 사용했고, 어떻게 활용하셨나요?

사용 도구: Figma Make, Gemini

부모와 자녀의 기억을 기록하는 앱을 만들고 싶었습니다.

서비스 아이디어의 draft를 Gemini와 대화 하며 기본적인 서비스 앱 프로토타입을 만들 프롬프트를 만들었고, 그 프롬프트를 Figma make에 넣고 이 서비스에 대한 프롬프트를 만들어 달라고 요청했습니다.

Prompt:아래 아이디어를 서비스화 했다고 생각하고, 랜딩페이지를 만들어 줘.

🚀 '메모리 퀘스트' (가칭) MVP 기능 상세 명세서
MVP 목표: "부모님(User)이 심리적 부담 없이 '음성 기록'을 남기고, 자녀(Buyer)가 그 결과물(음성/요약본)에서 '감동(Aha! Moment)'을 느껴 유료 결제(영구 보관)의 가치를 느끼는가?"를 검증한다.

핵심 아키텍처: 하나의 앱, 두 개의 모드 (자녀 모드 / 부모님 모드)

1. 공통 기능: 온보딩 및 모드 설정
기능: 사용자가 자녀인지 부모인지 식별하고, 1:1로 매칭합니다.

User Story (자녀): "나는 내 계정을 만들고, 부모님을 초대하여 하나의 '가족 아카이브'로 연결하고 싶다."

상세 스펙:

[화면 1] 시작: 앱 첫 실행 시 [자녀로 시작하기] / [부모님으로 시작하기] 버튼 표시.

[화면 2-1] 자녀 회원가입: 자녀는 이메일/소셜 로그인으로 가입.

[화면 2-2] 부모님 초대 (자녀): 가입 완료 후, 부모님을 초대하는 [초대 링크 보내기] 버튼 생성. (카카오톡/SMS로 고유 링크 전송)

[화면 3] 부모님 로그인: 부모님은 자녀가 보낸 링크를 클릭. (비밀번호 없는 원클릭 인증 또는 매우 간단한 로그인)

매칭: 링크를 통해 '자녀 A'와 '부모님 B'가 하나의 '아카이브'로 연결됨. 이후 앱 실행 시 자동으로 각자의 모드로 진입.

2. 자녀 모드 (Buyer: 30-50대)
자녀에게는 '퀘스트 관리'와 '기록 열람'이라는 두 가지 명확한 기능이 필요합니다.

기능 2-1: 퀘스트 관리 (질문 녹음 및 예약)

User Story: "나는 바쁘기 때문에, 10분만 투자해서 한 달 치 질문을 '내 목소리'로 미리 녹음해두고, 매주 자동으로 발송되게 하고 싶다."

상세 스펙:

[화면 4] 챕터 홈 (자녀): [챕터 1: 어린 시절] [챕터 2: 학창 시절] 등 챕터 리스트. (MVP는 챕터 1만 오픈)

[화면 5] 퀘스트 리스트 (자녀): 챕터 1을 누르면 5개의 사전 정의된 퀘스트(질문)가 나옴.

(예: 1. 어릴 적 가장 좋아했던 음식 / 2. 가장 친했던 친구...)

[화면 6] 퀘스트 녹음 (자녀): 각 퀘스트를 누르면 [🎙️ 내 목소리로 질문하기] 버튼.

(예: 자녀가 "엄마, 어릴 때 제일 좋아했던 음식이 뭐였어요?"라고 녹음)

[화면 7] 발송 설정 (자녀): 녹음 완료 후, [매주 월요일 오전 10시에 자동 발송] 옵션 선택.

기능 2-2: 메모리 피드 (Aha! Moment)

User Story: "부모님이 답장을 보내면, 즉시 알림을 받고, 원본 목소리와 AI 요약본을 확인하고 싶다. 그리고 더 궁금한 건 '꼬리 질문'을 하고 싶다."

상세 스펙:

[화면 8] 홈 피드 (자녀): 부모님이 보낸 답변이 시간순으로 도착하는 피드.

[화면 9] 답변 상세 (자녀): 피드를 누르면 '스레드' 형태의 상세 화면.

(상단) 내가 보낸 질문 ("엄마, 어릴 때...")

(핵심 1) [▶︎ 엄마 목소리 듣기] (원본 음성)

(핵심 2) AI 3줄 요약

(핵심 3) STT 변환 텍스트 전문

(핵심 4) [🎙️ 꼬리 질문하기] 버튼: 부모님의 답변에 대해 추가 질문을 녹음해 즉시 전송.

3. 부모님 모드 (User: 60-70대)
'부담감 해소'가 모든 UX의 최우선 목표입니다. 기능이 아닌 '경험'을 설계합니다.

기능 3-1: 질문 수신 및 '비공개 메모' (부담감 해소)

User Story: "자녀의 목소리 질문을 받고, '숙제'처럼 느껴지지 않게, 내가 편한 시간에 부담 없이 생각을 정리(녹음)하고 싶다."

상세 스펙:

[화면 10] 홈 (부모님): 극도의 단순함. "[아들 이름]에게서 음성 질문 1개가 도착했습니다."라는 알림 외에 거의 아무것도 없음.

[화면 11] 질문 듣기 (부모님): 알림을 누르면 자녀의 사진과 큰 [▶︎ 재생] 버튼. (자녀의 목소리가 재생됨)

[화면 12] '비공개' 녹음 (부모님):

버튼 텍스트: [답장하기 (X)]가 아닌 [🎙️ 생각해 보기 (비공개 메모)]

녹음이 끝나면 "[나만 보기]로 임시 저장되었습니다."라는 안내. 절대 자동 전송되지 않음.

기능 3-2: 발송 및 '덧붙이기' (수정의 부담 해소)

User Story: "내가 원할 때 녹음한 것을 보낼 수 있고, 나중에 생각난 게 있으면 텍스트 수정 없이 그냥 말을 '덧붙이고' 싶다."

상세 스펙:

[화면 13] 내 생각함 (부모님): 홈 화면의 작은 버튼 [내 생각함]

'임시 저장된 메모' 리스트가 보임.

각 메모마다 [▶︎ 들어보기], [🗑️ 다시 녹음하기], [✅ [아들 이름]에게 보내기] 버튼 제공.

[화면 14] 덧붙이기 (부모님): 이미 '보낸' 답변에도 [🎙️ 아, 맞다! (이야기 덧붙이기)] 버튼이 있어, 언제든 추가 녹음 파일(기억의 조각)을 보낼 수 있음.

4. 백엔드 및 AI (The Magic)
기능 4-1: 데이터베이스 (Firebase/Supabase)

Users (자녀/부모, 매칭 정보), Quests (챕터/질문), Stories (답변 스레드), Recordings (오디오 파일 링크) 테이블.

기능 4-2: 스토리지 (AWS S3)

이 사업의 핵심 자산. 모든 '원본 음성 파일'을 고음질로 영구 저장.

기능 4-3: AI 파이프라인 (Lambda/Cloud Function)

부모님이 '전송' 버튼을 누르는 순간 트리거.

Step 1: 오디오 파일을 STT API(Naver Clova, Google)로 전송 → 텍스트 받기.

Step 2: 텍스트를 LLM API(GPT, Claude)로 전송 → 3줄 요약 받기.

Step 3: 텍스트와 요약을 DB에 저장.

Step 4: 자녀에게 푸시 알림 전송.

순식간에 1차 안을 보여줬는데, 내 생각보다 좀 더 표현된것도 있고, 잘 못 표현된게 있어서 고치기 위해 수정 프롬프트를 입력했습니다.

내용을 좀 더 밝게 바꾸고 싶어. 돌아가시기 전에 기록한다라는 것 보다 서로를 더 생생하게 기억하는걸 더 중요한 가치라고 이야기 하자. 후회 보다는 까먹지 않도록 하는거고, 사진 만으로는 담을 수 없는 감정들에 대해서 담을 수 있도록, 사진이나 영상, 특정 사건에 대해서도 서로 대화하고 기억 나는 것들에 대해서 담을 수 있도록 한다. 자녀 모드와 부모님 모드에서 나이 대를 좀 빼주는게 좋겠다. 이미지 쓸 때는 동양스럽게 해줘. 돌아가시기 전에 음성 기록을 남긴다라는 말은 뺴자.

서로를 생생하게 기억 될 수 있도록, 서로를 더 연결 할 수 있도록. 내일은 늦을 수 있다라는 표현은 쓰지 말자. 얼리버트 혜택은 특정 기간 동안 그냥 사용자 1000명이 아니라, 사용자가 특정 조건을 달성하면 프리미엄 으로 올라가고, Heavy user가 되어서 많이 쓰게 되면 최고등급 플랜으로 쓸 수 있도록 하자. 그리고 대화를 볼 수 있는 사람들의 범위를 넓히는거를 넷플릭스에서 하듯이 추가해보자. Business Model 로는 이 대화를 책으로 엮고, 관련된 영상이나 목소리를 QR 코드로 만들어서 관련 챕터에 인쇄해준다고 하자. 어버이날 선물로 좋다고 이야기 하자. 


또 꼭 음성뿐만 아니라 영상으로도 제출 할 수 있어야 해. 영상으로 제출하면 더 인식률이 좋고, 분석도 더 고급 모델을 지원 한다고 하자.

이에 대한 결과로 랜딩 페이지가 만들어 졌습니다.

https://honey-kinder-97255717.figma.site/

강 앞 벤치에 앉아 있는 남자와 여자

새롭게 만들어진 내용에서도 잘못된 내용들이 들어가 있어서 더 수정하고 싶지만, 크레딧이 소모가 되어서 매일매일 조금씩 바꿔나가보면 좋겠습니다.

아래는 작동 안하는 앱 프로토타입입니다.

https://stylus-slide-38951889.figma.site

결과와 배운 점

내가 처음에 생각 했던 수준에서 조금 더 개발이 되고, 해외에서 벤치마킹 하는 사이트와 비교해보며 기본적인 서비스 기능의 유사도도 높이고 차별화 포인트를 생각 해보는데 큰 도움이 되었습니다.

랜딩 페이지의 역할과 CTA를 요구하는 Content의 흐름에서, 새로운 제품에 대해서 탐색하는 인간의 메타 여정과 여정 별로 활성화 되는 뇌 부분을 자극하는 색감, 폰트, 메시징, 애니메이션 기법 등이 랜딩페이지에 녹여들면 좋겠다고 느껴졌습니다.

서비스 랜딩페이지를 만들며 어떻게 내부적으로 제품 개발 문서를 적어야 하는지 그 좋은 사례가 궁금해졌습니다.

4
3개의 답글
지피터스 뉴스레터

이번 주 AI, 딱 쓸 것만

매주 월요일 오후,
읽고 바로 써먹을 AI 소식만