PORTFOLIO
함뜨까 여행 사진 커스텀 스티커 앱 개발
국내 여행 사진을 커스텀 스티커로 재해석한 맞춤형 기록 솔루션 프로젝트입니다.
- 여행굿즈 커머스
- 하이브리드 앱
- 실시간 사진 편집
- 토스페이먼츠 결제
과제: 사진을 지역 모양으로 잘라 보는 편집이 실시간이어야 하고, 주문한 원본은 제작까지 남아야 합니다.
한 것: iOS·Android 하이브리드 앱 + 관리자 웹 + API 서버 + 토스페이먼츠 결제
결과물
프로젝트 정보
- 클라이언트·업종:
- 기간: 2025.06 ~ 2025.08
- 담당 범위: 기획 · 디자인 · 프론트엔드 · 백엔드
- 주요 산출물: 사용자 앱 · 관리자 웹 · API 서버
- 플랫폼:
- 기술 스택:
어떻게 풀었나
SVG path로 정밀하게 자르는 지역 모양 사진 마스킹
지역 경계를 SVG path로 두고 사진에 마스킹해, 지역 모양 그대로 잘립니다. Canvas 클리핑에 터치 줌·팬을 붙여 사용자가 손가락을 움직이는 동안 미리보기가 바로 따라옵니다.
주문 시점에 보관하는 편집 원본 이미지
주문이 생기면 편집에 쓴 원본 이미지를 S3에 아카이브하고, 실패하면 트랜잭션을 되돌립니다. 제작은 주문 뒤에 시작되므로 사용자가 나중에 사진을 지우거나 바꿔도 만들 파일이 사라지지 않습니다.
전략 패턴으로 확장 가능한 소셜 로그인 4종
카카오·네이버·구글·애플을 Firebase Custom Token으로 묶고 제공자별 처리를 전략 패턴으로 갈라, 하나가 더 붙어도 인증 흐름은 그대로입니다. Capacitor 브릿지로 iOS·Android 네이티브 로그인을 태워 하이브리드에서도 같은 화면을 씁니다.
- 이미지 편집이 들어가는 커머스 앱 개발 업체를 찾는 중
- 하나의 코드베이스로 iOS·Android를 함께 내려는 경우
- 토스페이먼츠 결제를 붙인 커머스 첫 버전이 필요한 경우
Q. 결제까지 붙은 커머스 앱 첫 버전은 얼마나 걸리나
이 건은 편집 기능부터 결제·관리자까지 약 3개월이었습니다(기간 기준, 금액과 무관).
Q. 결제는 어떤 수단까지
이 건은 토스페이먼츠로 카드·가상계좌를 붙이고, 입금 확인은 Webhook으로 처리했습니다.
비슷한 프로젝트를 고민 중이라면, 상담만 받아보셔도 됩니다.
기획 범위, 디자인 시스템, 개발 핸드오프까지 필요한 내용을 함께 확인해 드릴게요.