[결제UI] 결제 화면 설계서

대부분의 커머스 사이트에서는 장바구니에 상품을 담는 것은 비회원도 가능하지만, 결제를 진행하려면 로그인이 필수인 경우가 많습니다. 이는 몇 가지 이유 때문입니다:

1. 안전성: 결제 정보와 관련된 민감한 데이터를 보호하기 위해 회원으로 로그인하여 결제 프로세스를 진행하는 것이 더 안전합니다.
2. 주문 추적: 회원 정보를 통해 주문 내역을 추적하고, 배송 상태를 확인하는 것이 용이합니다. 또한, 고객이 주문을 변경하거나 취소하는 것도 더 간편해집니다.
3. 개인화 서비스: 회원 로그인을 통해 사용자 맞춤형 추천 상품, 할인 혜택 등을 제공할 수 있습니다.
4. 데이터 수집: 회원의 구매 패턴과 취향 등을 파악하여 마케팅 전략을 세우는 데 도움을 줄 수 있습니다.

[쿠팡 결제] 화면을 기준으로 정의해 보겠습니다.

쿠팡 결제

로겟 배송 최소 금액 체그 후 conform창

로겟 배송 상품이라면 와우 회원이 아닌 경우 , 결제하기 버튼 클릭 시 로켓배송 최소금액를 체크하여

최종 결제 금액이 2만원 이하일 경우 컨펌창을 노출합니다.

 

로켓배송 결제

결제 화면의 구성을 다음과 같이 정리할 수 있습니다:

 

1. 배송건수

• 제품명 / 수량 / 배송종류:
  • 구매한 제품의 이름
  • 구매 수량
  • 배송 방식 (로켓배송, 일반배송 등)

2. 결제정보

• 총상품가격:
  • 구매한 모든 제품의 총 가격
• 할인쿠폰:
  • 적용 가능한 할인쿠폰이 있을 경우, 해당 금액이 표시됨
• 배송비:
  • 배송비가 발생하는 경우 해당 금액이 표시됨
• 쿠팡캐시:
  • 보유 중인 쿠팡 캐시 금액을 표시하며, 결제에 사용할 수 있는 금액
• 총 결제 금액:
  • 총상품가격에서 할인쿠폰, 쿠팡캐시 등을 적용한 후 최종 결제 금액이 표시됨
• 결제방법:
  • 사용자가 선택할 수 있는 결제 방식
    • 계좌이체
    • 쿠페이 머니
    • 신용/체크카드
    • 법인카드
    • 휴대폰 결제
    • 무통장 입금(가상계좌)

이러한 구성 요소들은 결제 과정을 쉽게 이해하고 빠르게 완료할 수 있도록 설계되었습니다.

 

쿠팡 결제 UI

쿠팡 결제 프로세스 > 결제화면 이동 Flow

결제 Flow

결제 기획서

 

결제UI

 

결제 방법에 따른 Flow는 다음과 같이 정리할 수 있습니다:

1. 계좌이체

• 은행 선택: 사용자가 이체를 원하는 은행을 선택합니다.
• 현금영수증: 선택에 따라 발행
  • 소득공제: 휴대폰 번호 입력
  • 지출증빙: 현금영수증 카드 번호 또는 사업자 번호 입력

2. 쿠페이 머니

• 잔액 유무 확인: 사용 가능한 잔액이 있는지 확인
• 현금영수증: 계좌이체와 동일하게 처리
  • 소득공제: 휴대폰 번호 입력
  • 지출증빙: 현금영수증 카드 번호 또는 사업자 번호 입력

3. 신용/체크카드

• 카드 선택: 결제에 사용할 카드를 선택합니다.
• 할부 기간 선택: 할부 기간을 선택 (단, PG사 정책에 따라 결정)

4. 법인카드

• 카드 선택: 법인카드를 선택합니다.
• 할부 기간: 법인카드는 할부가 불가능하며, 일시불만 가능합니다.

5. 휴대폰 결제

• 통신사 선택: 결제에 사용할 통신사를 선택합니다.
• 통신사 화면 이동: 선택한 통신사의 결제 화면으로 이동하여 결제를 진행합니다.

6. 무통장 입금(가상계좌)

• 입금은행 선택: 입금을 진행할 은행을 선택합니다.
• 입금기간 노출: 입금 가능 기간이 사용자에게 표시됩니다.
• 현금영수증: 계좌이체와 동일하게 처리
  • 소득공제: 휴대폰 번호 입력
  • 지출증빙: 현금영수증 카드 번호 또는 사업자 번호 입력

이와 같은 결제 방법 Flow는 사용자가 선택한 결제 방식에 따라 필요한 정보를 입력하고, 결제를 완료할 수 있도록 도와줍니다. 각 결제 방식은 해당하는 절차를 따르며, 사용자는 적합한 옵션을 선택하여 결제를 진행하게 됩니다.

---

 

기획은 검정색입니다.

"졸업 가운의 색이 검정인 이유는 검정이 성취와 권력의 색이기 때문입니다."

 

질문 환영합니다. 댓글 남겨주세요.
thinkhub