플러스프로젝트 배경
1. 재미있는 자기 표현 콘텐츠에 대한 수요
- Gen Z/밀레니얼 세대는 MBTI, 관상 테스트 등 "나"에 대한 콘텐츠 소비를 즐김
- 기존 서비스들은 텍스트 기반 질문 응답 방식으로 참여 장벽이 높고 차별화 부족
2. 노스탤지어와 자기 비하 유머 문화
- 과거 시대(싸이월드, 버디버디, 스키니진 등)에 대한 향수와 밈 문화 활성화
- 자기 비하 유머가 Gen Z 문화의 핵심으로 자리잡음
- 이러한 트렌드를 활용한 엔터테인먼트 서비스 부재
3. SNS 공유 최적화된 콘텐츠 부족
- 숏폼 공유 문화가 활성화되었으나, 공유하고 싶은 개인화 콘텐츠 생성 서비스 제한적
- 결과물이 SNS에 바로 공유하기 어려운 형태로 제공되는 경우 많음
4. 글로벌 확장 기반 구축
- 6개 언어 다국어 지원 (한국어, 영어, 일본어, 중국어, 힌디어, 스페인어)
- 국가별 문화 레퍼런스 적용으로 현지화된 유머 제공
- 모바일 앱(Turbo Native) 기반 구축으로 앱스토어 배포 준비
5. AI 기술 활용 차별화
- GPT-4o-mini Vision API로 사진 분석 기반 개인화된 콘텐츠 생성
- 단순 질문 응답이 아닌 이미지 인식 기반의 새로운 사용자 경험 제공
- Gen Z/밀레니얼 세대는 MBTI, 관상 테스트 등 "나"에 대한 콘텐츠 소비를 즐김
- 기존 서비스들은 텍스트 기반 질문 응답 방식으로 참여 장벽이 높고 차별화 부족
2. 노스탤지어와 자기 비하 유머 문화
- 과거 시대(싸이월드, 버디버디, 스키니진 등)에 대한 향수와 밈 문화 활성화
- 자기 비하 유머가 Gen Z 문화의 핵심으로 자리잡음
- 이러한 트렌드를 활용한 엔터테인먼트 서비스 부재
3. SNS 공유 최적화된 콘텐츠 부족
- 숏폼 공유 문화가 활성화되었으나, 공유하고 싶은 개인화 콘텐츠 생성 서비스 제한적
- 결과물이 SNS에 바로 공유하기 어려운 형태로 제공되는 경우 많음
4. 글로벌 확장 기반 구축
- 6개 언어 다국어 지원 (한국어, 영어, 일본어, 중국어, 힌디어, 스페인어)
- 국가별 문화 레퍼런스 적용으로 현지화된 유머 제공
- 모바일 앱(Turbo Native) 기반 구축으로 앱스토어 배포 준비
5. AI 기술 활용 차별화
- GPT-4o-mini Vision API로 사진 분석 기반 개인화된 콘텐츠 생성
- 단순 질문 응답이 아닌 이미지 인식 기반의 새로운 사용자 경험 제공
프로젝트 성과
MVP 전체 기능 100% 구현 완료
기획부터 배포까지 12개 핵심 기능(사진 업로드, AI 분석, 결과 카드, SNS 공유 등)
단독 개발 완료. Rails 8 + GPT-4o-mini Vision 풀스택 구현.
단독 개발 완료. Rails 8 + GPT-4o-mini Vision 풀스택 구현.
다국어 6개 언어 지원 시스템 구축
한국어, 영어, 일본어, 중국어, 힌디어, 스페인어 i18n 완전 지원. 국가별 문화
레퍼런스(싸이월드, MySpace, ミクシィ 등) AI 프롬프트 현지화.
레퍼런스(싸이월드, MySpace, ミクシィ 등) AI 프롬프트 현지화.
iOS/Android 모바일 앱 기반 구축 완료
Turbo Native 기반 하이브리드 앱 구조 설계. JavaScript↔Native 브릿지로
카메라/갤러리 연동 구현, 앱스토어 배포 준비 상태.
카메라/갤러리 연동 구현, 앱스토어 배포 준비 상태.
핵심 기능
AI 기반 흑역사 예측
GPT-4o-mini Vision API로 업로드된 사진을 분석하여 나이와 나라 기반 그 시대의
흑역사 4개(음악, 인터넷, 패션, SNS)를 자동 생성.
흑역사 4개(음악, 인터넷, 패션, SNS)를 자동 생성.
진행 단계
기획 및 요구사항 정의
2025.10.
PRD 작성, 타겟 유저(Gen Z/밀레니얼) 분석, 핵심 기능 정의(사진 업로드→AI
분석→흑역사 예측→SNS 공유), 바이럴 전략 수립.
분석→흑역사 예측→SNS 공유), 바이럴 전략 수립.
UI/UX 디자인
2025.10.
모바일 퍼스트 풀스크린 UI 설계, 3단계 폼 구조(사진→나이→나라) 설계, Atomic Design
패턴 컴포넌트 구조화, 결과 카드 디자인.
패턴 컴포넌트 구조화, 결과 카드 디자인.
백엔드 개발
2025.10.
Rails 8 서버 구축, GPT-4o-mini Vision API 연동, Prediction 모델 및 등급 시스템
구현, Solid Queue 백그라운드 작업 처리 구성.
구현, Solid Queue 백그라운드 작업 처리 구성.
프론트엔드 개발
2025.10.
Hotwire(Turbo+Stimulus) 기반 인터랙션 구현, 드래그앤드롭 업로드, 나이 슬라이더,
로딩 애니메이션, html2canvas 결과 카드 캡쳐.
로딩 애니메이션, html2canvas 결과 카드 캡쳐.
다국어 및 모바일 앱, 테스트 및 런칭
2025.10.
6개 언어 i18n 시스템 구축, 국가별 AI 프롬프트 현지화, iOS/Android Turbo Native 앱
기반 구축, SNS 공유 기능 완성.
기반 구축, SNS 공유 기능 완성.
프로젝트 상세
1) 포트폴리오 소개
Gen Z/밀레니얼을 위한 AI 기반 바이럴 엔터테인먼트 웹앱 개발
과거 사진과 나이를 입력하면 AI(GPT-4o-mini Vision)가 그 시대의 흑역사(창피했던 기억)를
유머러스하게 예측해주는 바이럴 웹앱. MBTI, 관상 테스트류의 자기 표현 콘텐츠를 즐기고 SNS
공유를 자연스럽게 하는 10~30대가 메인 타깃.
---
2) 작업 범위
개발 참여 범위:
- 기획 및 PRD 작성
- UI/UX 디자인 (모바일 퍼스트)
- 서버 구축 (Ruby on Rails 8.1)
- Front-end 개발 (Hotwire + Tailwind CSS)
- AI 프롬프트 엔지니어링 (GPT-4o-mini Vision)
- 다국어 i18n 시스템 구축
- 모바일 앱 기반 구축 (Turbo Native)
- 배포 환경 구성 (Kamal + Docker)
지원 환경:
- 반응형 웹 (모바일 최적화)
- iOS/Android 하이브리드 앱 (Turbo Native 기반 구축 완료)
- 다국어 지원 (한국어, 영어, 일본어, 중국어, 힌디어, 스페인어)
---
3) 주요 업무
핵심 기능:
- 드래그앤드롭 사진 업로드 (JPEG/PNG/WebP, 10MB 제한)
- 나이 슬라이더 (1~100세) 및 출생년도 자동 계산
- 7개국 나라 선택 + 검색 기능
- GPT-4o-mini Vision API 연동 실시간 AI 분석
- 흑역사 4개 카테고리별 생성 (음악/아이돌, 인터넷/게임, 패션/스타일, SNS/메신저)
- 크린지 점수(100~1000) 및 등급 시스템 (C/B/A/S/SSS)
- 결과 카드 이미지 캡쳐 (html2canvas)
- 카카오톡/Instagram/TikTok SNS 공유
- 재미있는 로딩 메시지 (시대별 밈 레퍼런스)
주요 페이지:
- 랜딩 페이지 (Social Proof 카운터 포함)
- 3단계 예언 폼 (사진 → 나이 → 나라)
- 로딩 화면 (애니메이션 + 유머 메시지)
- 결과 페이지 (점수/등급/흑역사 카드/공유 버튼)
---
4) 주안점
바이럴 최적화:
- SNS 공유에 최적화된 결과 카드 디자인
- 모바일 전용 Instagram/TikTok 공유 버튼 (플랫폼 감지)
- 국가별 문화 레퍼런스 적용 (한국: 싸이월드/버디버디, 일본: ミクシィ, 미국: MySpace 등)
사용자 경험:
- 모바일 퍼스트 풀스크린 UI
- 3단계 폼으로 이탈률 최소화
- 재미있는 로딩 메시지로 대기 시간 엔터테인먼트화
AI 품질 관리:
- 외모/가정환경 등 민감한 주제 프롬프트 레벨에서 필터링
- 이미지 256px 리사이징으로 API 비용 최적화
- 백그라운드 작업(Solid Queue)으로 서버 부하 분산
확장성:
- Atomic Design 패턴 컴포넌트 구조화
- 다국어 시스템 기반 글로벌 확장 준비
- Turbo Native 모바일 앱 기반으로 앱스토어 배포 준비
Gen Z/밀레니얼을 위한 AI 기반 바이럴 엔터테인먼트 웹앱 개발
과거 사진과 나이를 입력하면 AI(GPT-4o-mini Vision)가 그 시대의 흑역사(창피했던 기억)를
유머러스하게 예측해주는 바이럴 웹앱. MBTI, 관상 테스트류의 자기 표현 콘텐츠를 즐기고 SNS
공유를 자연스럽게 하는 10~30대가 메인 타깃.
---
2) 작업 범위
개발 참여 범위:
- 기획 및 PRD 작성
- UI/UX 디자인 (모바일 퍼스트)
- 서버 구축 (Ruby on Rails 8.1)
- Front-end 개발 (Hotwire + Tailwind CSS)
- AI 프롬프트 엔지니어링 (GPT-4o-mini Vision)
- 다국어 i18n 시스템 구축
- 모바일 앱 기반 구축 (Turbo Native)
- 배포 환경 구성 (Kamal + Docker)
지원 환경:
- 반응형 웹 (모바일 최적화)
- iOS/Android 하이브리드 앱 (Turbo Native 기반 구축 완료)
- 다국어 지원 (한국어, 영어, 일본어, 중국어, 힌디어, 스페인어)
---
3) 주요 업무
핵심 기능:
- 드래그앤드롭 사진 업로드 (JPEG/PNG/WebP, 10MB 제한)
- 나이 슬라이더 (1~100세) 및 출생년도 자동 계산
- 7개국 나라 선택 + 검색 기능
- GPT-4o-mini Vision API 연동 실시간 AI 분석
- 흑역사 4개 카테고리별 생성 (음악/아이돌, 인터넷/게임, 패션/스타일, SNS/메신저)
- 크린지 점수(100~1000) 및 등급 시스템 (C/B/A/S/SSS)
- 결과 카드 이미지 캡쳐 (html2canvas)
- 카카오톡/Instagram/TikTok SNS 공유
- 재미있는 로딩 메시지 (시대별 밈 레퍼런스)
주요 페이지:
- 랜딩 페이지 (Social Proof 카운터 포함)
- 3단계 예언 폼 (사진 → 나이 → 나라)
- 로딩 화면 (애니메이션 + 유머 메시지)
- 결과 페이지 (점수/등급/흑역사 카드/공유 버튼)
---
4) 주안점
바이럴 최적화:
- SNS 공유에 최적화된 결과 카드 디자인
- 모바일 전용 Instagram/TikTok 공유 버튼 (플랫폼 감지)
- 국가별 문화 레퍼런스 적용 (한국: 싸이월드/버디버디, 일본: ミクシィ, 미국: MySpace 등)
사용자 경험:
- 모바일 퍼스트 풀스크린 UI
- 3단계 폼으로 이탈률 최소화
- 재미있는 로딩 메시지로 대기 시간 엔터테인먼트화
AI 품질 관리:
- 외모/가정환경 등 민감한 주제 프롬프트 레벨에서 필터링
- 이미지 256px 리사이징으로 API 비용 최적화
- 백그라운드 작업(Solid Queue)으로 서버 부하 분산
확장성:
- Atomic Design 패턴 컴포넌트 구조화
- 다국어 시스템 기반 글로벌 확장 준비
- Turbo Native 모바일 앱 기반으로 앱스토어 배포 준비
