독이 든 병

독이 되는 레퍼런스 활용법

profile-img
장세린Product Designer
2023. 11. 27

토스에서 킥보드도 빌릴 수 있다는 사실, 알고 계시나요? 킥보드 서비스를 디자인하게 된 제가 제일 먼저 한 일은 무작정 다른 앱을 다운받는 거였어요. 킥보드 앱은 차고 넘쳤고, 10개 정도를 보다 보니 다 비슷하게 생겼더라고요. 그래서 별 의심 없이 화면을 토스답게 바꾸기만 하고 있었죠. ‘나 뭐 하고 있는 거지?’ 하는 생각이 들 때쯤 토스의 코어 밸류인 ‘Question Every Assumption’이 뇌리에 스쳤어요.

돌이켜보니 저는 당연한 것들에 의문을 가지지 않은 채 관습적으로 디자인하고 있더라고요. 그때부터 정신 차리고 모든 기능, 모든 요소에 질문을 던지기 시작했어요.

문제

킥보드를 빌리기 위해 가장 먼저 마주하는 화면은 지도 화면이에요. 무려 10가지 킥보드 앱을 모아보니, 지도 화면에 기능이 7개 정도 있더라고요.

다른 서비스가 제공하는 기능들을 바탕으로 재구성한 화면이에요

7~8개의 버튼이 흩어져 있고 핀도 빽빽하게 차 있어 화면을 알아보기 어려웠어요. 가장 중요한 정보를 전달하는 지도는 전체 면적의 64%밖에 쓸 수 없었죠.

아이콘도 서비스마다 달랐고,

요소가 너무 많아 정작 중요한 배터리 정보는 잘 보이지도 않았어요.

가설

처음에는 필요한 기능이니까 있는 거 아닐까? 필요한 건 아니라도 있는 게 낫지 않을까? 하는 생각에 갇혀있었어요. 하지만 10명의 사용자를 만나며 그게 아니라는 걸 깨달았죠.

교통 서비스의 목적은 빠른 이동인데, 부가 기능을 제공하는 건 오히려 목적에 방해가 될 뿐이겠다 싶었어요.

해결

1. 불필요한 기능 빼버리기

그래서 기능별로 사용하는 사람이 얼마나 되는지부터 파악했어요. 직접 타보기도 하고 인터뷰도 다시 했어요. 그 결과, 부가 기능이 필요한 상황이 매우 적다는 걸 검증할 수 있었고, 대여하기를 뺀 모든 기능을 과감하게 빼버릴 수 있었어요.

2. 필요한 상황에 제공하기

하지만 뺄 수 없는 기능들도 있었어요. 운전 면허 인증이나 고객센터 문의 같은 기능들이었죠. 생각해 보니 그 기능들이 꼭 지도 화면에서 필요한 건 아니더라고요. 오히려 더 자주 찾는 상황이 있었고, 그 상황에서 제공해 주는 게 낫겠다는 생각이 들었어요.

  • 그래서 운전 면허 인증은 대여 직전으로 옮기고

  • 문의는 반납이 제대로 되지 않았을 때와 반납 후에 이어질 수 있도록 했어요.

3. 가장 중요한 정보 강조하기

이렇게 하나 둘씩 정리하니 가장 중요한 배터리 정보가 잘 안 보인다는 문제가 확실히 느껴졌어요. 그래서 핀 모양도 업체와 배터리가 잘 보이게끔 수정했어요.

결과

덕분에 가장 중요한 ‘대여하기’라는 액션을 강조할 수 있었고, 레퍼런스보다 지도를 39% 더 사용할 수 있었어요.

Case 2. 정보 화면에 질문 던지기

문제

지도 화면에서 핀을 클릭하면 킥보드 정보를 볼 수 있어요. 여러 서비스를 비교해 보니 평균 10개의 정보를 제공하고 있더라고요.

다른 서비스가 제공하는 기능들을 바탕으로 재구성한 화면이에요

좁은 공간에 모든 정보를 넣으려다 보니 어떤 게 기능이고 정보인지 파악이 어려웠고, 지도는 30% 밖에 보이지 않았어요.

심지어 정보를 줄이기 위해 설명 없이 아이콘만 있는 기능들도 많더라고요

어떤 기능인지 한 번에 이해가 되나요?

가설

저는 이번에도 모든 것에 질문을 던졌어요. 꼭 필요한 걸까? 가장 중요한 건 뭘까?

킥보드 정보에서 가장 중요한 건 ‘내가 가려는 거리를 갈 수 있을지’ 라고 생각했어요. 가격이나 기기 이름은 그다음 문제라고 생각했죠.

해결

이번에는 킥보드를 빌리는 상황을 가정해서 인터뷰를 진행했어요.

1. 가장 중요한 정보 강조하기

모든 앱에서 기기 코드를 가장 강조해서 보여주고 있었어요. 배터리 아이콘과 퍼센트, 몇 km 이동 가능한지는 코드 아래 작게 보여주고 있었죠.

공급자에게 이건 당연한 논리이자 친절한 배려였을 거예요. 기기 이름을 제목으로, 하위 정보인 배터리는 작게 표시하는 게 맞았을 거고, 배터리 관련 정보를 몽땅 주는 게 배려였을 거에요.

하지만 사용자에게는 불편함이었어요. 사용자가 궁금한 건 원하는 시간 동안 탈 수 있을지 뿐이었거든요. 그래서 모든 정보를 날리고 몇 분 달릴 수 있는지를 가장 크게, 위에 넣었어요.

2. 필요한 상황에 제공하기

어떤 기능인지 알기 어려운 벨 울리기 기능은 ‘소리로 찾기’라는 직관적인 이름으로 바꿨어요. 이 기능은 킥보드와 사용자가 가까울 때만 쓸 수 있는 기능이라, 가까워졌을 때만 보여주기로 했어요.

기기 코드 복사 기능은 코드를 입력해서 킥보드를 빌릴 때만 필요한 기능이었어요. 그래서 복사할 필요가 없도록, 코드 입력하는 칸을 미리 채워주었죠.

3. 불필요한 기능 빼버리기

사용하는 사람이 많지 않은 고장 신고, 여기 없어요 기능은 빼버렸어요.

결과

불필요한 정보와 뒤바뀐 위계로 정신없던 화면을 정리하니, 이동 가능 시간이 한 눈에 보였어요. 레퍼런스보다 지도도 46%나 더 볼 수 있었죠. 개선한 화면이 불편할지 싶어 UT를 했는데, 어떤 기능이 없어졌는지 아는 사용자는 없었어요.

적용해보기

기능은 편의가 아니라 비용이다

다양한 기능을 제공해 주면 좋을 것 같지만, 오히려 사용자에게 방해가 되고 유지 보수 비용이 들어요. 정보도 마찬가지예요. 정보가 많을수록 친절한 것 같지만, 사용자는 이해하기 위해 더 힘을 들여야 하죠. 결국 누구에게도 도움이 되지 않는 거예요.

디자이너의 일은 사용자가 목적지에 쉽게 다다를 수 있도록 길을 닦아주는 것이라고 생각해요. 아래 4가지 단계로 ‘Question Every Assumption’ 해보면 사용자에게 목적지로의 지름길을 만들어 줄 수 있을 거예요.

킥보드 서비스가 궁금하다면?

전체탭의 교통칸을 확인해주세요!

재미있게 읽으셨나요?

좋았는지, 아쉬웠는지, 아래 이모지를 눌러 의견을 들려주세요.

😍
🤔
website-code-blue

토스팀이 만드는 수많은 혁신의 순간들

당신과 함께 만들고 싶습니다.
지금, 토스팀에 합류하세요.
채용 중인 공고 보기