2025 내일배움캠프

[MVP UI/Prototype 설계] 4. 프로토타입

sihyun22 2025. 10. 29. 19:38

[과제] 사용자 문제를 해결할 수 있는 MVP UI와 프로토타입 설계

[주제] 중고거래 앱의 '상품 상세 → 거래 요청 → 대화 시작' 흐름

 

 

프로토타입

✅ 사용자 목표
중고거래 서비스 사용자는 거래 시 채팅으로 낭비되는 시간에 불편함을 느끼며, 빠르게 거래를 완수하고자 한다.


✅ 사용자 시나리오
상품 상세 정보 확인 → 거래 방식 선택(직거래 or 택배 거래) → 채팅 시작 or 바로 구매(결제)

 

 

프로토타입

 

 

 

프로토타입 제작 과정

  • 사용자 목표와 시나리오를 바탕으로 UI화면을 설계한 뒤, 프로토타이핑으로 흐름을 만들어주었다.
  • 각 화면에 대한 설명도 첨부해 화면의 목적을 분명히하였다.
[상품 상세 페이지]
판매자는 거래글을 작성할 때, 필수로 거래 방식을 기입
→ 구매자가 채팅 없이도 판매자가 원하는 거래 방식을 파악할 수 있음
거래하기 CTA 버튼으로 행동 유도


[거래 방식 선택 페이지]
채팅 전, 거래 방식 선택으로 채팅 최소화
→ 채팅 특성상 상대방의 답장을 기다리는 시간이 필수적이므로 채팅을 최소화하는 것이 거래 시간 단축에 도움
옵션 선택 시 CTA 버튼 활성화


[거래 방식 선택 - 택배 거래 페이지]
택배거래의 경우, ‘바로 구매’를 통해 채팅 없이 빠른 거래 가능. 하지만 문의사항이 있을 수 있으므로 ‘판매자 문의' 옵션 제공
옵션 선택 시 CTA 버튼 활성화


[채팅 페이지]
선택한 거래 방식에 따라 자동 제안 메시지를 텍스트 필드에 띄워 바로 전송 혹은 간단한 수정을 거쳐 전송할 수 있게 함
→ 사용자가 메시지 내용을 생각하고, 작성하는 시간을 최소화하여 빠르고 효율적인 거래 진행에 도움
이외의 자주 문의하는 내용은 텍스트 필드 위 칩으로 제공하여 클릭 시 텍스트 필드에 자동 작성 됨


[결제 페이지]
모든 항목 작성, 약관 동의 시 CTA 버튼 활성화

 

 

 

예외 상황 고려

  • Happy Path가 아닌 예외 상항을 고려한 플로우도 추가 제작하였다.

 

 

 

 

 

[회고]

이번 과제를 통해 사용자의 목표와 흐름에 집중하여 설계하는 과정을 학습하였다. 사용자가 특정 목표에 도달하기 위한 최소한의 흐름을 만들어 검증하는 과정을 통해 사용자 관점에 더욱 고려하며 작업을 진행할 수 있었다. 목적을 뚜렸하게 설계하고자 노력하니 그에 대응하는 UI를 자연스럽게 제작할 수 있었던 점이 가장 기억에 남는다. 앞으로 더욱 사용자를 깊이 고려한 서비스를 제작하고 싶은 목표가 생겼다.