Home 기획 가이드북 넷플릭스의 셔플 기능, 네이버 지도 UI 개선, 채널톡 회원가입 UI, Etsy의...

[기획자의 모바일앱 뜯어보기] 넷플릭스의 셔플 기능, 네이버 지도 UI 개선, 채널톡 회원가입 UI, Etsy의 툴팁에 대한 이야기

2020-09-01

4934

–

1.채널톡은 왜 회원가입 화면을 스플릿 UI 형태로 만들었을까?

스플릿UI는 우리가 거의 매일 접하는 구성 중 하나입니다. 슬랙에서는 좌측의 채널과 참여중인 멤버 리스트를 보며 우측에서 바로 대화를 할 수 있고, 라인에서도 왼쪽 친구 리스트와 선택된 대화방을 인지한 상태에서 오른쪽으로 대화창이 펼쳐지기 때문입니다.

즉, 정보를 확인하거나 탐색할 수 있는 왼쪽의 프라이머리 패널과 실제 선택된 내용을 확인, 실제 다른 행동을 할 수 있는 오른쪽의 세컨더리 패널을 동시에 볼 수 있는 구성이라고 할 수 있습니다. 하나 더 예를 들어보면, 지메일이 있는데요. 왼쪽에는 사용자가 지정한 라벨이나 받은, 중요한 편지함 등의 구분이 있고 오른쪽으로는 구분에 따라 최신순으로 쭉 나열된 메일을 확인 할 수 있습니다.

물론 스플릿 UI가 꼭 위와 같이 사용되는 것은 아닙니다. 얼마 전 가입 하며 알게된 채널톡의 사례도 마찬가지였습니다. 채널톡 관리자 계정을 가입하며 재미있는 점을 발견했는데요. 이메일을 입력하고 영어 이름을 입력하는 순간 오른쪽에 입력한 이름이 어떻게 보이는지 바로 반영해서 보여줬기 때문입니다.

오른쪽으로는 실제 사용자들이 우리 서비스로 진입했을 때 어떤 모습인지 보여주고 있었는데요. 비록 이름 하나만 적용해준 것이지만 담당자인 내 이름이 사용자들에게 어떻게 보여지는 지 미리 확인 할 수 있는 것은 꽤 매력적인 경험이었습니다.

한쪽으로는 가입에 필요한 정보를 입력하게 하고, 또 한쪽으로는 입력한 정보가 어떻게 노출 되는지를 명확하게 보여주는 방법인 것이죠. 뿐만 아니라 채널톡을 쓰면 무엇이 좋은지 핵심 내용을 함께 배치해두었네요. (개발자, 디자이너 없이도 빠른 적용. 효과 측정 및 테스트도 간편하게!)

가입 과정에서 다시 한 번 서비스가 줄 수 있는 가치를 느끼게 해주는게 그리 쉬운 일은 아닌데! 데스크탑 환경이긴 했지만 그럼에도 불구하고 오랜만에 회원가입 과정에서 느껴본 디테일의 간격이었습니다

👉 1-1 함께 읽어보세요!

스플릿 스크린 어떻게 활용하면 좋을까?

–

2.Etsy가 신규 기능에 툴팁을 활용하는 방법

한국에 아이디어스, 미국의 Etsy 모두 수공예 제품을 다루는 서비스입니다. Etsy가 먼저 생겨났고요. (2005년) 세계 최대 핸드메이드 마켓이기도 합니다. 얼마 전, Etsy iOS 버전 앱에 재미난 기능이 업데이트 되었어요. 구매할 제품 놓을 공간에 가상으로 배치해볼 수 있는 기능인데요.

애플은 이미 AR Kit을 제공하고 있기에 이를 활용한 것으로 보입니다. 몇 가지 제품을 가지고 벽에도 해보고, 식탁 위에도 해봤는데 그냥 제품 상세 페이지 내 설명과 이미지만 보는 것 보다 구매 결정에 더 큰 영향을 줄 수 있겠구나, 라는 생각이 들었습니다. 구글 아트앤컬쳐 앱이 저 멀리 있는 박물관, 미술관의 작품을 눈 앞에서 보는 것처럼 느끼게 해주는 것과 같은 맥락에서 말이죠.

그런데, 이 기능 자체 그러니까 AR을 활용한 것은 처음이 아니었기에 몇 번 써보고 일단 멈췄는데요! 더 재미있었던 건 우리 이런 기능을 새로 업데이트 했어! 라고 알려주는 이들의 툴팁 활용 방법이었습니다. 사실 앱을 새로 설치, 실행하거나 기능이 새로 업데이트 되었을 때 자주 활용되는 방식이지만 몇 가지 눈에 띄는 차별점이 있었습니다.

베타라는 표기가 있습니다. 베타라는 건 의외로 사용자들에게 기대감을 덜 갖게 하는 효과가 있습니다. 게임에도 자주 활용되는 클로즈 베타, 오픈 베타 등의 단계에선 버그가 있어도 상대적으로 너그러운 모습을 보여주는 사용자들이라고 할 수 있죠! 우리 이런 기능을 업데트 했는데 써봐! 가 아니라, 우리 이런 기능을 업데이트 했는데 아직 베타라 불안정 할 순 있어! 라고 말했을 때 받아들이는 정도가 다를 수 있다는 것입니다.

이 아이콘이 무엇인지, 아이콘을 탭 했을 때 무엇을 확인 할 수 있는지 핵심만 쏙쏙 뽑아 설명해줍니다. 군더더기 없이 깔끔해요. “카메라를 활용해 특정 공간에 아이템이 놓인 모습을 미리 확인해볼 수 있다.” 툴팁은 보통 최초 1회에 한정되니, 이 정도 안내라면 낯선 아이콘이라도 다음에 다시 한 번 활용해볼 가능성이 생기지 않을까 싶습니다.

명확한 행동 유도 버튼들도 구성이 좋습니다. 사실 새로운 기능을 안내하는 툴팁이라도 서비스가 원하는 행동으로 이어졌을 때 목표 달성에 가까워지는데요. 보통의 툴팁은 ‘안내’의 역할에서 끝나는 경우도 많기에, 써볼게! 에 해당하는 버튼을 강조한 모습이 더 매력적으로 다가왔습니다. 저도 그래서 써봤거든요.

툴팁 자체에만 너무 초점을 맞춰 얘기했지만, 사실 AR를 활용한 이 기능이 시사하는 바는 또 있어요. 판매자와 구매자에게 모두 적용되는 부분인데요. 판매자이자 제작자는 자신이 만든 제품이 어디에 어떻게 쓰이면 좋을지를 이미 알고 있어요. 다만 그걸 표현하는 방법에는 한계가 존재합니다. 텍스트, 영상, 이미지 정도로 상세 페이지 내 표현하는 것. 아쉬움이 많을 수 밖에 없죠.구매자에게도 아쉬움이 있습니다. 우리집에 잘 어울릴까? 내가 원하는 공간에 잘 맞을까? 라는 답을 스스로 상상해야 하기 때문이죠. 이케아가 비슷한 방법을 일찌감치 활용한 것도 우리집을 어떻게 꾸미면 좋을지에 대한 상상을 현실에 더 가깝게 만들어주기 위해서였다는 사실을 떠올려 본다면, 이런 노력이 어떤 목적으로 시작되었는지 조금 더 구체적으로 생각해볼 수 있지 않을까 싶습니다.

👉 2-1 함께 읽어보세요!

–

3.넷플릭스는 왜 셔플 기능을 테스트 하고 있을까?

이미지 출처 : https://techcrunch.com/2020/08/18/netflix-test-puts-a-shuffle-play-button-right-on-your-home-screen

저는 네이버 뮤직이 나왔을 때부터 지금까지 쭉 같은 음원 스트리밍 서비스를 이용하고 있어요. 물론 지금은 바이브가 네이버 뮤직을 대신하고 있지만요. 바이브는 기본적으로 사용자가 원하는 음악을 찾아 듣는 서비스가 아니라, 좋아요를 하거나 실제 들었던 음악들을 바탕으로 취향에 맞는 음원을 계속해서 플레이 해주는 서비스입니다. 믹스테잎 같은 개념을 잘 활용하고 있는 서비스이기도 하고요. 이렇게 만들어진 임의의 리스트는 종종 셔플 기능으로 섞어 듣곤 하는데요. 두 가지 목적이 있습니다.

같은 리스트를 다르게 느낄 수 있어요.
내 취향에 맞게 생성, 추천되는 리스트에서 어떤 노래가 나올 지 묘한 기대감이 생겨요.

그렇게 음원 스트리밍 서비스에서 주로 활용하던 셔플 기능이 넷플릭스에 등장했다는 소식을 지난 8월 19일 듣게 되었습니다. (TV에서만 테스트 중) 어라? 추천 알고리즘을 논할 때 빠지지 않는 넷플릭스에서 셔플을? 내가 본 영화나 드라마 등을 바탕으로 추천 리스트를 만들어주는게 아니라 랜덤으로 재생시킨다고? 등등, 별 생각이 다 들었던 소식이었는데요! 일단, 넷플릭스는 특정 국가의 일부 사용자에게 해당 기능을 테스트하고 있는 것으로 보였습니다. 근데 옅은 내공으로 의도를 생각해보기 전 살펴본 사용자들의 반응이 꽤 재미있었어요.

Netflix has a shuffle play option now. And it played Modern Family from the start. Bitch fuckoff I watched all 9 seasons back in 2018 already (이미 본 콘텐츠를 셔플로 만난다면?)
why the fuck does netflix have a shuffle play option lmfaoooo (꽤 당황스러운가 봐요)
Whoa whoa what is this cool “shuffle play” feature on Netflix?!? It’s amazing and helpful for my indecisive self (뭘 봐야 할 지 모를 때 유용할 수도)
My TV has a Netflix shuffle play option. The definition of chaotic evil. (혼돈 그 자체)

요즘 그런 말을 많이 듣게 됩니다. 넷플릭스에서 볼 게 없다. 더 재밌는건 유튜브와 네이버 등 정보 탐색의 역할을 하는 서비스에서 넷플릭스 추천 영화, 드라마 등에 대한 검색이 꽤 많이 일어난다는 것인데요. 구독 서비스니, 매 달 돈은 빠져나가는데, 뭘 봐야 할 지는 모르겠고, 그렇다고 넷플릭스가 탐색에 최적화된 서비스는 아니니, 네이버에 검색이나 해보자! 와 같은 흐름이 존재한다는 증거이기도. 그렇다면, 넷플릭스는 왜 셔플 기능을 TV에서만 테스트하고 있는걸까요? 제가 흥미롭게 느낀 점은, 넷플릭스가 셔플 기능을 테스트 한다는 사실 보다 TV라는 기기를 대상으로만 테스트를 한다는 점이었습니다.

이미지 출처 : https://img.hankyung.com/photo/202008/01.23531109.1.jpg

TV를 켰어요. 그런데 재미있는 프로그램이 없네요. 지금 보고 있는 채널에서는. 그래서 열심히 채널을 돌립니다. 채널 버튼을 위로, 아래로 누르면서요. 그렇게 몇 개, 몇 십개의 채널을 지나칩니다. 그런데도 볼 게 없어요. 우리 앞에는 저녁이, 야식이 기다리고 있는데. 와씨!(아이고)
TV라서 발생 할 수 있는 상황입니다. 일반화 하긴 어렵지만, 한 번 이상은 위와 같은 경험을 겪어 봤을 것 같아요. 그럼 넷플릭릭스나 IPTV로 진입하거나 편성표를 통해 다시 한 번 지금 방송 중인 프로그램을 확인합니다. 혹시나 하고 말이죠.
이렇게 5-10분을 소비하고 나면, 이제 슬슬 열이 받아요. (아 물론 이건 제 개인적인 상황에 더 가깝습니다) 그렇게 적지 않은 시간을 투자해 겨우 채널 하나를 고정하곤 금방 다른 일에 빠져버립니다. 스마트폰을 보거나 하는.
그런데, 그냥 버튼 하나를 눌러서 프로그램을 추천 받는다면 어떨까요? (추천의 정확도는 일단 뒤로 하고) 적어도 그 동안 내가 어떤 종류의 콘텐츠를 봤는지 누구보다 잘 알고 있는 녀석이 하나, 하나, 하나 추천해준다면? 앞의 행동 보다 더 빠르게 원하는 콘텐츠를 찾을 수 있지 않을까요?

시간을 벌어주는 개념으로 받아들일 수 있겠다. 라는 생각이 처음 들었고, 예상치 못한 콘텐츠를 만나볼 수 있겠다. 라는 생각이 이어 들었습니다. 물론 부작용도 적지 않을 것 같아요.

무작위라는 걸 알고 눌렀지만, 그래도 내가 좋아하는 스타일이 아닌 콘텐츠를 만나게 된다면? 한 두 번은 넘어갈 수 있지만 연달아 같은 상황이 발생한다면? 서비스에 대한 신뢰도에도 영향이 있지 않을까?
넷플릭스의 강점은 나의 시청 기록을 바탕으로 여러 종류의 콘텐츠를 쭉 펼쳐주는 거 아냐? 그런데 무작위로 재생을 하라고? 라는 당황스러운 마음도 생기지 않을까?

여러분들은 어떻게 생각하시나요? 지금 TV로 넷플릭스를 켰는데 프로필 하단에 셔플 버튼을 발견했다면? 일단 한 번 눌러보시겠어요? 아니면 그냥 프로필을 하나 선택해 들어가시겠어요?

–

4.네이버 지도는 왜 탭 위치를 포함한 UI를 개선했을까?

네이버 지도가 주요 화면을 업데이트 했습니다. (지난 7월) 기존에는 지도와 맞닿은 부분에 ‘탭’ 구분이 되어 있었는데요. 지도 – 탭 – 관련 기능 또는 콘텐츠 구성으로 말이죠. 업데이트 후 지도 – 관련 기능 또는 콘텐츠 – 하단 탭 구성으로 변경되었습니다.

(1)내비(길안내 탭)

내비를 랜딩 화면으로 갖는 네이버 지도(변경 가능). 기존에는 사용자가 즐겨찾기 한 장소 3개를 화면 내 확인 할 수 있었는데, 변경 후 집, 회사, 3개의 주요 장소를 확인 할 수 있는 구성으로 변경 되었습니다. 집, 회사 등으로 가기 위한 주요 경로 내 도로명을 표기해주는 것도 달라진 점!

또 길찾기 버튼은 상단 검색창 옆으로 배치된 모습을 확인 할 수 있네요. 별도의 전환 없이 바텀 시트를 끌어 올려 최근 방문했던 장소를 격자형으로 확인 할 수 있게 되었습니다. 해상도에 따라 다르겠지만, 12-15개 정도의 장소를 한 눈에 볼 수 있는 구성이죠. 보통의 내비가 버튼이나 탭 등을 한 번 더 눌러 최근 방문, 입력 장소를 보여주는 것과 대비해 더 빠르게 찾아볼 수 있다는 장점이 있는 구성이기도 합니다.

카카오가 카카오지도와 카카오내비를 별도로 가져가는 것과 다르게 네이버는 네이버 지도 내 내비와 일반 길찾기, 주변 장소 안내 등을 함께 제공하기에 화면 구분을 더 명확하게 할 수 있는 의도가 있지 않을까 하는 생각도 듭니다.

(2)주변 탭

대중교통, 내비와 함께 주요 탭을 구성하고 있는 ‘주변 탭’에도큰 변화가 있었습니다. 기존에는 지도 화면 상단과 주변 탭에 ‘음식점’, ‘카페’ 등 동일한 구분이 노출되고 있었는데요. 업데이트 후에는 검색창 하단에만 구분이 남아있고, 지도탭에는 스마트어라운드가 적용되었습니다.

스마트어라운드는 2018년 출시, AI가 적용된 기능으로 사용자 개인의 위치와 시간대, 성별과 연령대 등에 맞춰 가볼만한 곳을 추천해줍니다. 기존에는 네이버앱에서 제공 되었었는데 이번 업데이트를 통해 지도에도 적용된 것이죠. 스마트어라운드가 적용된 것은, 네이버가 앞으로 네이버 지도를 어떻게 활용할지에 대한 힌트를 제공해주기도 합니다. 주변 ‘장소’를 중심으로 하기에 쇼핑은 물론 할인 등 생활혜택과 같은 편의를 연동할 수 있기 때문입니다.

추가로, 현재 날씨 정보만 제공하던 것과 달리 현재 시간을 포함 최대 4시간 범위 내 날씨 정보를 제공하는 점도 달라진 점. 현재 위치의 미세, 초미세 데이터도 함께 제공됩니다.

(3)대중교통 탭