brunch

You can make anything
by writing

C.S.Lewis

by 김자유 Dec 27. 2018

윈도우8, 스냅챗 리디자인이 실패작인 이유?

완전 망작이라고요!


목차


1.리디자인은 왜 실패할까?

2.스냅챗의 네비게이션 리디자인

3.윈도우 8 시작 메뉴 리디자인 

4.모든 리디자인이 나쁜 걸까?

5.페이스북 네비게이션 리디자인

6.배운 점

7.리디자인은 과정이지, 목적지가 아니다.

8.소규모 전환(micro conversion)에 신경 쓰기

9.결론





어느 날, PM이 디자인 부서로 걸어들어와 웹사이트 리디자인을 요청한다.


PM:우리 웹은 너무 구려요! 경쟁사들은 훨씬 힙한데. 리디자인을 하는 게 좋겠어요. 색깔 그림자가 들어간 버튼이 유행이라던데요?



디자이너: 좋아요, 그럼 일단 사용성 테스트를…

PM: 3주 드릴테니 컬러를 모두 핫핑크, 엣지블루 아니면 밀레니얼 오렌지로 바꿔주세요.


skype 리디자인 2018



이게 바로 당신의 전환율(conversion rate)을 죽이는 가장 쉬운 방법이다. 위 시나리오가 다소 과장된 것이라고는 해도, 다수의 회사들이 매년공격적으로 그들의 브랜드를 리디자인한다는 사실은 과장이 아니다. 당장 페이스북만 봐도, 내가 열 때마다 새로운 웹사이트가 나오는 것 같다. 약 3,000명의 멤버로 이루어진, 매 분마다 페이스북의 변화를 체크하는 그룹도 있다.
 

제품을 사용하는 어떤 유저든, 항상 변화하는 시장에선 불가피하게 최신 상태를 유지해야 한다. 리디자인은 웹, 앱 혹은 그 외 모든 프로젝트에서, 유저나 이해관계자와 상호작용하는 데에 있어 매우 치명적이다. 철저하게 데이터 드리븐 프로세스를 따르고, 명확한 디자인 KPI를 정의하여 행해진 리디자인은 전환율을 높이고 매출을 증가시키며 유저를 기쁘게 할 것이다.
 

하지만 리디자인은 종종 전환율이나 불만 있는 유저, 부정적인 앱 리뷰를 별로 달가워하지 않는다. 스냅챗 같은 작은 플레이어부터 MS나 스카이프 같은 대기업이든, 실패한 리디자인에서 자유롭지는 않은 것 같다.



1.리디자인은 왜 실패할까?


리디자인은 시각적이든 기능적이든, 유저가 당신의 제품을 기억하는 방식을 바꾸는 것이다. 당신이 앱에서 유저가 설정창을 접근하는 방식을 바꿨을 때, 그들에게 평소 습관을 깨라고 말하는 것과 같다. 이전에는 두 번 생각하지 않고 설정창에 접근했던 유저들이, 이제는 머뭇거리며 일부러 그 기능을 찾아야만 접근할 수 있게 된다. 디자이너로서 당신이 해야 할 일은, 이런 미묘한 불편함(microaggression)을 최소화하고 그들로 하여금 새로운 습관을 잘 형성하도록 만드는 것이다.


2.스냅챗의 네비게이션 리디자인


스냅챗이 그들의 코어 기능(친구 스토리 보기)을 어떻게 리디자인했는지 살펴보자.

구 버전은 네비게이션을 이렇게 설계했다.: 스토리를 보기 위해서는 왼쪽으로 스와이프하고, 친구들과 채팅하기 위해서는 오른쪽으로 스와이프한다. 리디자인 후에는, 친구들의 스토리를 보기 위해서는 메인 카메라 화면에서 왼쪽으로 스와이프한 후, 친구의 스토리를 클릭해야 한다.

셀럽 광고 및 뉴스는 원래 스토리가 있던 페이지에 배치되었다. 이제 친구들의 스토리 옆에 나란히 서게 놓이게 된 것이다.

스냅챗이 리디자인을 한 결과, 친구들의 스토리가 왼쪽으로 옮겨지고 채팅과 합쳐졌다. 그리고 원래 친구 스토리가 있던 자리를 광고 스토리가 차지했다. 이 리디자인은 스냅챗이 “채팅"과 “스토리"가 분할된 것을 극복한 것으로 보였다. 친구와 광고주 사이의 구분에 초점을 두었고, 광고주들이 광고 콘텐츠와 친구 콘텐츠를 쉽게 구분할 수 있도록 만들었다.


이번 리디자인에서, 스토리를 보기 위해 클릭해야 했던 영역 역시 감소했다. 이전에는 유저가 친구의 스토리를 보기 위해서는 직사각형 바를 클릭해야 했다. 리디자인 후에는, 작은 원 모양으로 축소되어 화면 왼쪽으로 치우쳐졌다.


스토리를 보기 위해 클릭해야 하는 영역

적어도 엄지 사용법이 두 가지 바뀌었다.: 네비게이션 구조와 스토리 탭 영역. 말할 필요도 없이, 유저는 이런 변화를 달가워하지는 않는다. 스냅챗의 평균 이용률은 한 주 내에 3.1에서 2.4로 뚝 떨어졌다.


이 트윗은 스냅챗에 10억 달러 상당의 피해를 입혔다.

"스냅챗 안 열어보는 사람~? 나 뿐인가? 휴, 너무 슬프다."


스냅챗의 리디자인은 말그대로 재앙이었다. 데일리 유저를 1억 9천 3백만에서 1억 8천 8백만으로 떨어뜨렸다. 광고 조회와 수익은 36% 떨어졌다. 많은 광고주들은 플랫폼을 바꿨고, 인스타그램을 새 둥지로 칭하기 시작했다.


리디자인 사태 6개월 이후, 스냅챗은 원래 버전으로 돌아갈 것을 공지했다. 친구 스토리는 원래 자리인 오른쪽 페이지에, 광고 스토리 옆 자리로 돌아갈 것이라고. 실제로 한 말은 다음과 같다.: 


우리는 스토리를 보는 것과 친구들과 의사소통하는 것을 같은 화면에서 이루어지게 하는 것이 각각의 행위에 방해가 된다는 것을 알게 되었다. 우리는 스토리를 친구 창에서 앱의 오른쪽으로 옮기는 작업을 수행하고 있다.

-스냅챗 CEO, Evan Spiegel


3.윈도우 8 시작 메뉴 리디자인


이제 MS가 어떻게 윈도우 8 시작 메뉴를 리디자인했는지 살펴보자. 먼저 윈도우 7과 8의 컨트롤 패널을 열어보자.

윈도우 8에서는 이미 처음부터 시작메뉴에서 시작한다. 썩 좋은 시작이다, 그렇지 않은가? 아니다. 리스팅 된 앱에서 보여야 할 컨트롤 패널이 없다. 또한 모든 프로그램을 나열하는 옵션도 없다.


패널에 접근하려면, Charms 메뉴를 열어야 한다. 메뉴는 마우스를 화면 우상단/우하단에 올려놓아야 보인다. Charms 메뉴를 연 후, 설정을 클릭한 다음 컨트롤 패널을 눌러야 한다.


이러한 제스처 기반 접근 방식은 윈도우 8을 깐 유저들을 전혀 고려하지 않았다. 윈도우는 charms 메뉴를 찾는 그 어떤 온보딩 과정도 제공하지 않았다. 심지어 유저가 구글링이나 친구들을 통해 Charms메뉴를 찾은 후에도, 그들은 여전히 불편함을 느껴야 했다. 제스쳐와 호버링 모두 해당 OS에서는새로운 콘셉트였으니까.


4.모든 리디자인이 나쁜 걸까?


리디자인은 변화고, 사람들은 변화를 좋아하지 않는다. 위 사례들을 보고 쉽게 생각할 수 있다. 리디자인에서 제품이 작동하는 방법을 바꾸는 것은 좋은 투자가 아니라는 것을. 하지만 ‘안정을 지키기 위해' 발전하지 않고 똑같은 디자인을 고수하는 제품은 빠르게 움직이는 경쟁사들에 밀릴 수밖에 없다.

유저들이 쉽게 익힐 만한 가볍고 진보적인 변화들은 리디자인을 참을 만한 수준으로 만들어준다. 때때로 리디자인은 유저가 이미 익숙한 방법을 사용하도록, 플래시 애니메이션, 제스쳐 혹은 네비게이션 구조를 생략하기도 한다.


5.페이스북 네비게이션 리디자인


2012년, 페이스북은 사람들이 그들의 앱을 잘 쓸 수 있도록 하기 위해 대대적인 리디자인을 준비했다. 지금까지 친구 요청, 메시지 및 알림은 맨 위에 있는 파란 액션 버튼을 통해 확인할 수 있었다. 이 액션 바는 유저가 웹사이트에서 사용하는 것과도 똑같은 방식이었다. 모바일은 웹사이트의 룩앤필을 그대로 따라서 만들어졌다.


안드로이드와 iOS에서도 비슷한 느낌의 액션 바가 제공되고 있다.


하지만 모바일 유저 기반이 점점 앞서고 있었고, 모바일을 우선적으로 사용하는 유저가 웹을 우선으로 사용하는 유저를 거의 압도하게 되었다. 인스타그램이나 스탭챗, Vine(RIP) 같이 모바일에서만 지원하는 소셜 네트워크가 인기를 얻고 있었다. 그것은 앞으로 사람들이 컴퓨터보다 휴대폰에 시간을 더 쏟을 것이라는 주장의 꽤 믿을 만한 근거였다.


그래서 페이스북이 모바일에서 그들의 네비게이션의 구조를 단순화하기로 결정했을 때, 두 다른 제품인 안드로이드와 iOS의 통일성을 버리기로 했다. 페이스북은 각각의 앱에 두 가지 다른 네비게이션 구조를 제안했다. 안드로이드 앱은 상단에 붙어있는 슬라이드 가능한 탭 바를, iOS는 하단에 붙어있는 고정 탭 바를 제공했다.


이러한 변화는 앱 뿐 만아니라 유저에게도 신선한 변화였다. 리디자인이 유저에게 네비게이션 바를 사용하기 위해 상단으로 이동하는 습관을 깨라고 요구하는 반면, 유저는 이미 그들 플랫폼의 특정한 탭 바에 익숙해져 있었다. 슬라이드 탭 바는 안드로이드 생태계에서 몇 년 간 사용되어져 오고 있었다. 유저들이 액션 바에서 탭 바로 습관을 전환하는 것은 그다지 어려운 일이 아니었다. 비슷하게, iOS탭 바는 플랫폼의 시작서부터 사용되고 있었고, 유저들에게 이상하게 느껴지지도 않았다.


페이스북의 안드로이드/iOS 탭 바 구분 전략은 그들에게 매우 좋게 작용했다. 그들은 순식간에 해당 산업 분야의 스탠다드가 되었으며, 요즘까지도 대부분의 안드로이드 및 iOS 앱들은 그들과 비슷한 네비게이션을 사용한다.


6.배운 점


'가장 효과적인 리디자인=가장 예쁜 것'은 아니다.


리디자인은 예쁜 것을 만드는 과정이 아니다. 시각적인 측면은 리디자인의 한 부분이긴 하지만, 그 자체가 리디자인은 아니다. 만약 당신의 제품을 그저 보기에 더 예쁘게 만들고, 드리블에 있는 잘 꾸며진 목업 위에 올려진 영감을 끌어내고, 아무런 리서치 없이 디자인 트렌드를 추가하고 있다면, 당신의 리디자인은 실패할 확률이 매우 높다.


가끔 유행이 지난 디자인 언어가 브랜드 가치를 깎아내릴 때도 있다. 당신의 고객들은 보기에 더 예쁜 디자인 시스템을 가진 경쟁사로 옮겨가기도 한다. 그렇다면 당신의 디자인 시스템을 보기에 더 좋게 만드는 것이 좋은 리디자인이다. 하지만 어떤 전략이나 리서치 없이 맹목적으로 디자인 트렌드를 따르는 것은 좋지 않은 결과를 가져다 줄 것이다.


리디자인은 특정한 비즈니스적 제약과 요구를 기반으로 문제를 해결하는 것이다.


드리블에 올라와있는 이 구글 리디자인 콘셉트는 시선을 끌기 위해 강렬한 컬러와 진한 그림자를 사용했다. 꽤 화려해 보이긴 하지만, 이 리디자인은 몇 가지 결함을 갖고 있으며 절대 구글에서 빛을 보지 못 했을 거다. 먼저, 구글이 20년 동안 지켜왔던 상징적인 컬러 브랜딩이 사라졌다. 두 번째, 모든 구글 웹사이트에서는 프로필 아바타가 우상단에 위치해있는데, 여기서는 좌상단에 위치해있다. 할 말이 많지만, 내가 전하고자 하는 바가 무슨 뜻인지 잘 이해했으리라 믿는다.


7.리디자인은 과정이지, 목적지가 아니다.


제품 디자인은 프로토타이핑, 테스팅, 분석 그리고 제품 혹은 과정을 재정의하는 반복적인 과정이다. 리디자인은 완성된 제품을 의미하는 것이 아니다. 그저 현재의 요구를 “충분히 반영하는"것을 의미한다. 어떤 제품과 UI도 “완성될" 수 없다.


8.소규모 전환(micro conversion)에 신경 쓰기


유저와 그들의 행동에서 더 좋은 그림을 그려내려면, 행동의 의도를 읽어내는 것이 중요하다. 전형적으로, 우리가 테크 분야에서 전환에 대해 이야기 할 때는 앱 다운로드, 로그인 혹은 매출에 초점을 맞춘다.


소규모 전환은 종종 간과되거나, 추적조차 되지 않을 때가 잦다. 소규모 전환은 사용자를 최종 목표, 즉 대규모 전환으로 이끄는 따 먹기 쉬운 열매다. 소규모 전환의 예는 유저가 검색 창을 쓰는 횟수, 그들의 프로필 사진을 바꾸는 횟수, 혹은 그들의 전화번호를 확인하는 것이 될 수 있다. 소규모 전환은 전환 퍼널에서 마일스톤으로서 기능할 수 있고, 궁극적인 단계인 대규모 전환에 영향을 끼칠 수 있다.


어떻게 이런 소규모 전환이 일어나게 될까? 소규모 전환의 특정 공식에 대해 본적이 있는가? 새 검색 바를 찾기 어려운 탓에 친구를 추가하지 못 한 유저가 있는가? 무료 버전에 로그인하도록 유도하는 버튼이 새로운 레이아웃에 묻혀 발견되지 못하는 경우는? 정밀한 소규모 전환 목표를 설정하고, 그들을 잘 추적하는 것은 당신이 리디자인한 플랫폼에서 유저가 어느 지점에서 마찰을 겪는지 아는 데에 도움이 될 것이다.


9.결론


읽어주셔서 감사하다! 부디 이 글이 리디자인을 이해하고 그들로부터 무언가를 배우는 데에 도움이 되기를 바란다.


저자 :Cirish Rawat

원문 링크: https://medium.freecodecamp.org/why-most-redesigns-fail-6ecaaf1b584e

번역: REASIGN

문의: reasign.newsletter@gmail.com

*무단 전재 및 재배포 금지(링크 공유는 가능)


해외 디자인 아티클을 한글판으로 편하게 받아보세요!

읽는 디자인, <디독D.dok>(구:REASIGN) 구독링크: http://bit.ly/2FNQNpv

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari