본문으로 건너뛰기
포트폴리오 목록으로
커머스2025

PC웹 기반 커머스 — 결제 중심 32화면 해부

쇼핑몰 하나에 32개 화면이 필요한 이유. 2025년 프로젝트에서 만난 기획의 디테일과 놓치기 쉬운 포인트를 공유합니다.

이창민
쇼핑몰기획이커머스PC웹결제UX실시간채팅리뷰시스템관리자화면서비스기획

실제 서비스가 아닌, 핵심 기능 흐름만 담아 재구성한 익명화 목업입니다. 모든 데이터는 가상입니다.

주문·배송 단계 관리일반·학원(단체) 회원 관리리뷰 노출·답변 관리식단 콘텐츠 발행단체 주문 확정 플로우
demo.example — 샵고

화면 스켈레톤

실제 Figma 44개 화면 중 운영 핵심 7개 화면 재구성

고객사 화면은 저작권 보호를 위해 공개하지 않는 대신, 주요 화면의 구성을 와이어프레임으로 재구성했습니다.

대시보드

주문 관리

주문 상세

회원 관리

리뷰 관리

식단 이야기

설정

이 서비스가 해결하는 문제

온라인 쇼핑의 핵심 과제는 "어떻게 하면 사용자가 원하는 상품을 빠르게 찾고, 망설임 없이 구매하게 만들 것인가"입니다. 단순히 상품을 나열하는 것이 아니라, 탐색 → 비교 → 결정 → 결제 → 배송 확인까지 끊김 없는 경험을 설계해야 합니다.

특히 모바일 환경에서는 작은 화면에서의 정보 밀도, 엄지 하나로 가능한 조작성, 결제 과정의 이탈 방지가 기획의 승패를 가릅니다. 이 프로젝트는 32개 화면에 걸쳐 이 문제를 체계적으로 풀어냈습니다.

핵심 가치 제안

  • 마찰 없는 결제 — 장바구니에서 결제 완료까지의 단계를 최소화하고, 각 단계에서의 이탈 원인을 제거하는 데 집중했습니다. 결제 실패 시 복구 플로우도 포함되어 있습니다.
  • 실시간 소통 채널 — 텍스트, 이미지, 파일까지 주고받을 수 있는 채팅으로 사용자 간 또는 운영자와의 즉각적인 소통이 가능합니다.
  • 검증된 신뢰 시스템 — 리뷰와 평점이 구매/이용 결정에 직접적인 영향을 미칩니다. 리뷰 어뷰징 방지와 인증 리뷰 강조가 설계에 반영되어 있습니다.

사용자 시나리오

주요 사용 흐름:

  1. 메인 화면에서 핵심 콘텐츠와 개인화된 추천을 확인합니다. 주요 기능으로의 진입점이 명확하게 배치되어 있습니다.
  2. 상세 페이지에서 충분한 정보를 확인하고 의사결정을 내립니다.
  3. 결제 또는 예약을 진행합니다. 최소한의 입력으로 빠르게 완료할 수 있도록 설계되어 있습니다.
  4. 이용 후 리뷰를 작성하여 다른 사용자에게 도움을 줍니다.

관련 포스트

새 글 알림 받기

평일 오전 10시 30분, 하루 한 통의 일일 다이제스트를 보내드립니다.

AI/테크 · 웹/제품/디자인 · 비즈니스/산업 · 경제/금융 · 증시/기업 · 정책/규제 · 국제/지정학 · 국방/방산 · 사이버보안

구독 신청 시 새 글 알림 발송을 위한 이메일 이용에 동의하게 됩니다. 신청 후 받는 확인 메일의 버튼을 눌러야 발송이 시작됩니다. 모든 메일에서 언제든 구독을 해지할 수 있습니다.