구현 형태
주문형 커머스 모바일 앱
커스텀 케이크 주문 앱
Make Moment
세상에 하나뿐인 케이크를 주문하다
고객이 직접 텍스트·스티커·이미지를 캔버스 위에 배치해 케이크 디자인을 완성하고, 그 결과물을 바로 결제까지 연결하는 엔드투엔드 주문 경험을 단일 Flutter 앱으로 구현했습니다.
CommerceCustomizationFlutter
제품 브리프
캔버스 편집부터 결제까지 한 번에 완결되는 수제 케이크 주문 플랫폼
고객이 직접 텍스트·스티커·이미지를 캔버스 위에 배치해 케이크 디자인을 완성하고, 그 결과물을 바로 결제까지 연결하는 엔드투엔드 주문 경험을 단일 Flutter 앱으로 구현했습니다.
주문 완료까지 전 과정을 앱 하나로 처리해 이탈 없는 구매 전환 흐름을 실현했습니다. 특별한 날 맞춤 케이크를 직접 디자인하고 싶은 소비자에 잘 맞습니다.
구현 범위
해결한 문제
해결한 문제
복잡한 커스터마이즈 옵션을 직관적 모바일 UX로 단순화하면서 결제 안정성까지 확보해야 했습니다.
핵심 구현
캔버스 기반 실시간 꾸미기 편집기를 자체 구현해 텍스트·스티커·이미지를 자유롭게 배치·미리보기할 수 있게 했고, 이미지 압축 후 업로드로 서버 부담을 최소화했습니다. KG이니시스 결제는 브라우저 환경을 내부에 내장해 안전하게 연동했으며, 딥링크를 활용해 결제 후 앱 복귀 흐름을 매끄럽게 처리했습니다.
결과
주문 완료까지 전 과정을 앱 하나로 처리해 이탈 없는 구매 전환 흐름을 실현했습니다.
적합한 제품 유형
특별한 날 맞춤 케이크를 직접 디자인하고 싶은 소비자
Deliverables
캔버스 편집기4단계 주문 플로우이미지 압축 업로드KG이니시스 결제딥링크 복귀
Tech
Flutter · Riverpod · 캔버스 편집기 · KG이니시스
기술 구조
제품 근거
주 스택
Flutter · Canvas editing · Mobile checkout
데이터 · 동기화
오브젝트 배치 · 이미지 압축 업로드
운영 포인트
KG이니시스 결제 · 주문 정보 흐름
스택
앱 클라이언트
Flutterhooks_riverpodflutter_hooksget_itflutter_svgphoto_viewcached_network_image
편집 · 이미지 처리
canvas object editingflutter_image_compresspath_providersticker/text overlaysorder data preparation
결제 · 운영
KG Inicis (WebView)webview_flutterflutter_inappwebviewuni_linksapp_tracking_transparencyconnectivity_plus
연동
KG Iniciswebview_flutterflutter_inappwebviewuni_linksapp_tracking_transparencyflutter_image_compress
화면
제품 근거
앱
비슷한 제품, 내부 도구, 출시 가능한 첫 버전이 필요하다면
현재 문제, 대략적인 범위, 참고 링크만 있어도 제품 구조와 출시 범위부터 정리할 수 있습니다.