WhatsApp Pay에 오신 것을 환영합니다 - UX 사례 연구 [Welcome to WhatsApp Pay — a UX case study]

이 글은 Ana Sanchis Welcome to WhatsApp Pay — a UX case study 글을 번역했습니다. 저의 모든 글은 허가를 받고 진행 하였습니다.

기존 App에 기능 추가.

presentation
photo: pixr8.com
친구들과 결제를 할 때 문제가 있었던 적이 있나요? …당신의 친구들에게 돈을 지불하는 것을 잊은 적이 있습니까? 아니면 그들이 당신에게 돈을 주는 걸 잊었을까요? 그리고 친구들과 동일한 결제 플랫폼을 갖추지 못할 때 문제가 있었던 적이 있습니까?
만약 비슷한 문제가 있다면 아마 제 생각을 좋아하실 거라고 생각합니다. :)
presentation

프로젝트 요약

이것은 UX/UI 세계에서 전문가로서 연습하고 발전하는 것을 목적으로, ironhack에서 UX/UI 디자인 부트캠프에 참석하는 동안 수행된 개별 프로젝트입니다. 프로젝트를 개발하기 위해 저는 많은 것을 한 단계 더 나아가 좋은 최종 해결책을 얻는 데 도움이 되는 design thinking을 따랐습니다.💪🏼
브리핑 : 기존 앱에 기능 추가
프로젝트 총 기간 : 4일
이 프로젝트의 시간 편성 :
DAY 1 : 인터뷰, 앱 경쟁사의 경험 분석
DAY 2 : 선호도 다이어그램, 공감 맵, 사용자 개인 정보
DAY 3 : 테스트, 종이 프로토타입, 반복, 스케치
DAY 4 : 더 많은 스케치, 더 많은 테스트, 더 많은 반복, invision 프로토타입

이니셜 IDEA :

당신의 친구에게 지불하는 기능을 WHATSAPP에 추가하세요.

사용자 연구

선호도 다이어그램 및 공감 지도

저는 이 아이디어를 염두에 두고 친구 간의 결제와 친구들에 의해 사용되는 결제 플랫폼과 관련된 질문을 바탕으로 개인 인터뷰를 하는 사용자 연구를 시작했습니다. 12번의 인터뷰 후에 저는 많은 다른 의견과 다른 상황들의 예들을 얻었습니다. 하지만 그들 모두는 갚는 것을 잊어버리는 사람들에 의해 야기된 불편한 순간에 동의했습니다.
presentation
이것이 제 사용자 연구가 어떻게 보이고, 제가 그들에게 주어진 입력을 조직하는데 많은 도움을 주었던 방법입니다. 이것은 선호도 다이어그램(affinity diagram)이고, 매우 유용한 도구입니다. 스티커 메모는 당신의 가장 친한 친구가 될 것입니다;)
그리고 왜 사람들은 친구들에게 지불하는 것을 잊었을까요? 몇 가지 이유를 말씀드릴 수 있습니다. 첫 번째 이유는 지불을 위해 사용되는 다양한 플랫폼과 관련이 있을 것입니다. 이것은 사람들이 지불을 많이 지연하게 만듭니다. 현금은 절대 정확하지 않습니다. 은행 계좌이체는 지루합니다(정식 이체를 위해서는 은행 번호를 입력하고 계좌에 입력해야 합니다). 그러면 어떤 사람들은 다른 디지털 지갑을 사용하지만 보통은 그렇지 않습니다. 이 모든 것이 사람들로 하여금 지불을 미루고 잊어버리게 합니다. 두 번째 이유는 그들에게 알림이 없기 때문이에요, 네.. 그들이 돈을 빚진 사람은 아마도 그들에게 물어볼 것이지만, 그들은 불편함을 느끼고 그것을 요구하지 않는 것을 선호합니다.
저는 문제를 요약하고 분류함으로써 연구를 계속했습니다. 그래야 제가 공감 지도(empathy map)에서 완벽한 인물(persona)(주요 고통 포인트를 반영하고 문제를 해결하는 데 더 잘 집중할 수 있도록 도와주는 사용자)을 만들 수 있습니다.
presentation

presentation
선호도 다이어그램과 공감 맵에서 발견한 결과

사용자의 PERSONA

이제 칼라(Carla) "그녀의 친구 그룹의 프로젝트 매니저"를 소개합니다. 아마 여러분도 그녀와 같은 사람을 알고 있거나 그녀처럼 느껴질 겁니다. 그녀는 그의 친구들과 함께 행사, 계획, 활동을 계획할 때 항상 주도적인 역할을 하는 사람입니다.
presentation
칼라(Carla), 내 프로젝트의 사용자. 그녀는 기능에서 무엇이 필요할지 그리고 그것을 어떻게 사용할지를 상상하도록 도와줍니다(시나리오/콘텍스트)

새로운 스크린에 대한 개념

기능은 매우 분명했습니다. Carla는 지불 알림을 필요로하며 쉽게 지불해야합니다.
이 기능을 중요한 옵션으로 추가하려고했기 때문에 내 생각을 홈 화면에 배치했지만 처음에는 사용자의 반응 (기대와 느낌)을 테스트하기 위해 테스트했습니다. 그래서 네비게이션 바에있는 지불 옵션을 사용하여 홈 화면을 신속하게 만들었습니다.
presentation
보시다시피 위쪽 네비게이션에서 카메라 동작을 숨겼습니다(모든 탭에 이미 포함되어 있었기 때문입니다). 그리고 Pay라는 새 탭을 추가했습니다. 20명에게 카메라 기능에 대해 물었더니 아무도 이용하지 않고 있었기 때문에 "상태"를 숨기고 싶습니다만, 저는 마크 주커버그가 아닙니다.
첫 번째 테스트에서 아주 좋은 답을 얻었어요. 그들은 모두 돈을 지불하고, 돈을 요청하고, 분할 지불을 할 수 있는 화면을 찾길 기대했어요. 와, 그리고 또한 이런 것을 어떤 것에 통합해서 매우 행복했습니다. 이 테스트에서 나의 행복도는 다음과 같습니다.
presentation
또한 탐지할 수 있듯이, 지불 기능과 관련된 새로운 알림 기호를 제안하여 상환 대기 중인 사용자를 알 수 있습니다.
이 모든 것을 고려해 볼 때, 저는 지불 화면에서 프로토타입을 종이에 만들기 시작했고, 몇몇 사용자들과 함께 테스트를 했습니다.
presentation
종이 프로토타입에서 최종 고화질 프로토타입까지의 인터렉션 일부는 스페인어로 되어 있습니다. 제 테스트는 스페인어로 이루어졌기 때문입니다.
첫 번째 아이디어에서 시작하여 WhatsApp Pay 지갑에 잔액이 있는 화면을 제안했고 그 아래에는 미결금과 미결금이 있는 탭 2개를 제안했습니다. FAB 버튼에는 새로운 결제, 요청, 그룹 결제, 지갑에 추가하기 위한 빠른 액세스를 포함했습니다(다른 앱을 통해 운문과 같은 친구에게 돈을 지불함).
하지만 처음 테스트했을 때 (1) 사용자에게 새로운 지불을 요청했을 때, 그 중 일부는 예상한 대로 많은 수치의 잔액(12€)으로 이동하고 FAB 버튼으로 가지 않는 것으로 바뀌었습니다. 따라서 아이콘을 좀 더 직관적인 것으로 바꾸기로 했습니다. (또한 종이 프로토타입에 색상이 없다는 사실이 사용자에게 제대로 전달되지 않는다고 생각합니다.)
두 번째 테스트를 할 때 (2) 현재 FAB 버튼을 잘 사용 중이었지만, 지금은 사람들이 어떻게 돈을 빚지고 있는지 궁금해하고 있었습니다. 다시 한 번 제 탭과 화살표는 매우 직관적이지 않았기 때문에 저는 지금 스케치에서 바로 새로운 디자인(3)을 선택하기로 결정했습니다. (4)와 (5)의 다음 변화는 시각 인식과 WhatsApp 지침에 대한 결정이었습니다. 왜냐하면 사용자들은 앱의 모양과 느낌을 유지하는 데 매우 중요하기 때문입니다.

최종 프로토타입

지불 화면의 최종 제안입니다.
presentation
WhatsApp Pay에 대한 내 제안
채팅에서 결제를 할 수 있는 가능성을 더하고 싶었기 때문에, 저는 몇몇 사용자들과 함께 테스트를 했고, 이 세 가지 점 모두가 이것을 하려고 할 때 세 가지 점으로 갔기 때문에, 저는 사용자들의 기대를 바탕으로 그들의 작업을 더 쉽게 만들기로 결심했습니다.
presentation
채팅에 "새로운 결제" 추가 제안
이제 저는 칼라(Carla)일이 친구에게 줄 선물을 사고 싶기 때문에 "라우라(Laura)의 생일" 그룹에서 어떻게 쉽게 새로운 지불금을 만들 수 있는지를 보여드리고자 합니다.
presentation
Carla는 그룹 채팅에서 지불을 정리합니다.
이것은 칼라(Carla)가 새로운 결제를 만들기 위해 할 수 있는 두 가지 방법 중 하나입니다. "Pay" 탭으로 가서 FAB 버튼을 통해서도 할 수 있기 때문입니다. 아래와 같이:
presentation
그룹 및 급여 부문에서의 칼라(Carla) 체크 결제
채팅에 추가 한 새 아이콘 (왼쪽 상단의 지불 아이콘)을 볼 수도 있습니다. 채팅에 대기중인 지불이있을 때만 표시 할 것을 제안했습니다.

미래에 추가 할 것들

더 이상 발전시킬 시간이 없었어서 못한 것들이 있습니다.
  • 친구에게 알림 보내기
  • 지불로 표시하는 방법 그리고 만약 친구가 현금 이체, 또는 whatsapp이 아닌 다른 앱으로 지불한다면 어떻게 할 것인가.
  • 지불 설정에서 은행 계정 구성(돈 추가 및 제거)
  • 지불 작성자가 그룹을 관리하는 방법
  • 일부 그래픽 측면을 체크리스트로 재디자인합니다(이 화면을 개발할 시간이 더 필요함).

한번 써 보실래요?

이 기능을 사용해 보려는 경우 먼저 그룹 내에서 결제 생성 방법을 테스트한 다음 Pay(지불) 화면 안에서도 탐색할 수 있는 이 invision prototype을 만들었습니다.
친구들과 함께 새로운 지불을 할 준비가 되셨습니까?
presentation
그리고 Hey WhatsApp 내 아이디어 맘에 들어요? :)
읽어주셔서 감사합니다!

이 글은 번역 글입니다. 원본 링크입니다.


https://www.facebook.com/groups/224179755005643/

안녕하세요! Early adopter입니다.
페이스북 [DTF] 디자인 번역 공장 - Design Translation Factory 그룹도 많이 가입해주시길 바랍니다.
"보버"에서 "디자인 번역 공장" 연재를 저와 함께 해주실 분을 찾습니다. 하단 "리뷰" 또는 "페이스북"으로 편하게 메시지 주세요!
PS. 제가 사용하는 블로그 "보버"에 "함께 쓰는 블로그"라는 기능이 요번에 추가됐네요 ㅋ (미디엄에 퍼블리케이션 같은 기능..)
하단 링크 글을 보시면 "디자인 번역 공장"에 어떻게 함께 연재할 수 있는지 자세히 설명되어있습니다. 또는 쉽게 FB 메시지 주세요!
https://bit.ly/2L6WsZp