[번역] 멀티플랫폼에서의 UI 적용
Approaches For Multiplatform UI Design
이 글은 Sergii Ganushchak 와 Kate Abrosimova가 Smashing Magazine에 기고한 'Approaches For Multiplatform UI Design Adaptation: A Case Study'를 번역한 글입니다.
안드로이드와 iOS를 모두 지원하는 앱을 디자인 할 때, 앱의 아이덴티티를 위해 모든 플랫폼에 앱 고유의 UI를 적용해야 할지, 아니면 플랫폼에 익숙한 사용자의 편의를 위해 플랫폼의 UI를 따라야 할지 고민을 해보셨을 겁니다. 아래 글에서는 앱의 컨셉과 목적, 특징에 따라 앱 특유의 UI를 내세우는 것이 좋을지, 플랫폼의 UI를 따르는 것이 좋을지, 아니면 둘 다 적절히 혼합하여 적용하는 것이 좋을지 유명한 앱을 예시로 하여 잘 설명해 주고 있습니다. 결론은 일반적으로 두 가지 방식을 혼합하여 적용하는 것이 낫다고 합니다. 아래 글을 통해 본인이 만드는 앱에서 어느 부분에서 앱 고유의 UI를 가져가고 어느 부분에서 플랫폼을 따라야 할지 조금은 감이 잡힐 것 같습니다.
Approaches For Multiplatform UI Design Adaptation: A Case Study
iOS와 Android 사이에 어떤 것이 우선이라고 볼 수는 없다. 둘 중 하나의 플랫폼에서 제품이 성공하면, 당연히 다른 플랫폼으로도 제작을 할 것이다. 때로는 두 플랫폼에서 동시에 런칭하기도 한다. 이것은 디자이너가 어플리케이션의 UI와 UX를 일관성을 유지하면서 서로 다른 플랫폼에 적용해야 한다는 것을 의미한다.
UI를 서로 다른 플랫폼에 적용하는 방식에는 세 가지 시나리오가 있다.
브랜드의 일관성을 유지하는 방법, 그리고 해당 플랫폼에 적합하게 맞추는 방법, 그리고 두 가지 방법 사이에서 적절한 균형을 찾는 것이다. 디자인을 할 때 어떤 방법이 가장 좋을지 인사이트를 얻을 수 있도록 유명한 앱들이 이 방법들을 어떻게 적용했는지 분석해보기로 하자.
The Brand-Oriented Approach
브랜드를 고수하며 플랫폼의 규칙을 무시하는 방법은 가장 빠르고, 쉽고 비용이 적게 드는 접근방식이다. 그러나 그것은 UI디자인의 관점에서만 그렇고, 커스텀 UI는 개발하기가 더 복잡하므로 개발의 관점에서는 플랫폼의 표준요소를 사용하여 개발을 하는 것 보다 비용이 더 든다고 볼 수 있다.
더우기, 브랜드를 UI디자인에서 우선적으로 두는 것은 매우 위험한 접근방식일 수 있다. 그러한 방식은 사용하기 편하게 느껴지지 않으며, 규칙을 따르지도 않고, 때때로 매우 성가시게 만들기도 한다. 만드는 사람은 독창적이라 생각하겠지만, 그런 종류의 앱들과 그냥 비슷한 앱일 뿐이다. 그러나 예외도 있다.
V S C O C A M
Visual Supply Co의 첫번째 VSCO Cam 의 iOS앱은 2012년에 개발되었다. 일년 후에 안드로이드 버전도 제작하였고, 안드로이드 버전에는 iOS 버전의 인터페이스가 거의 그대로 적용되었다. 그러나 iOS버전과 Android 버전 모두 플랫폼의 표준과 맞지 않는 모습을 보여주고 있다.
VSCO Cam iOS (left) and Android.브랜드 아이덴티티에 맞춰 플랫폼의 가이드라인을 포기한 것은 이 경우에 잘 나타나 있다. VSCO Cam의 설립자들은 Creativity가 매우 중요하다고 생각하며, 그들이 만드는 제품의 비젼을 설명해준다고 생각한다. 그들은 앱을 브랜드의 일부로 생각하고 만들었다.
VSCO Cam.
I N S T A G R A M
VSCO Cam 앱처럼, 인스타그램도 안드로이드보다 앱스토어에 먼저 런칭이 되었다. iOS 가이드에 철저하게 맞춰진 iOS 앱은 대단히 성공적이였다. 그래서 애플에 맞춰진 UI가 인스타그램의 차별화된 특징이 되어 버렸다. 그래서 인스타그램은 안드로이드 앱에서도 안드로이드 방식을 따르지 않는다. 앱의 전반적인 스타일이 안드로이드 유저들이 기대하는대로 되어있지 않지만, 매일 구글플에이에서 백만 다운로드 이상을 기록하고 있다.
Instagram iOS (left) and Android.현재 인스타그램의 iOS와 Android 버전이 똑같아 보이지만, 일부 요소는 다르기도 하다. 예를 들면, 검색 바는 각 플랫폼의 네이티브 UI와 동일해 보인다. 그리고 최근의 카메라의 인터페이스도 iOS버전과 달라 보인다. 그리고, iOS에서는 인스타그램의 로고가 내비게이션바의 중앙에 위치하지만, 안드로이드 버전에서는 툴바의 좌측에 위치한다.
Instagram search interface iOS (left) and Android.안드로이드 인스타그램의 UI는 플랫폼의 표준을 따르지는 않았지만, 사용자들에게는 여전히 편리하게 느껴진다.
Instagram video interface on iOS (left) and Android.
W I R E
Skype의 창립자가 세운 Wire는 또다른 메시징 앱이다. 한 가지를 제외하면 다른 메시징 앱들과 다르지 않다. Wire는 사용자에게 깊은 인상을 줄 수 있는 매우 아름다운 인터페이스를 갖고 있다는 것이다. Wire의 디자이너는 표준을 따르지 않는 제스처 중심의 방식을 적용하였다. 이러한 방식을 채택한 중요한 이유는 사용자에게 가능한한 최소한의 요소만 눈에 보이게 하려는 것이였다.
우리는 텍스트, 음성, 비디오, 미디어 등 모든 양식에서 아름답고 유용한 툴을 만들고 있다.
Wire의 사용자 경험에서 핵심은 미디어이며, 컨텐츠 관점에서 모든 불필요한 것들을 제거하려고 하였다. 그리고 아름다운 타이포그래피와 가독성을 좋게 만들기 위해 많은 노력을 하고 있다.
—Priidu Zilmer, Wire’s head of design
처음에 내비게이션을 하려면 약간 생각을 해야 하지만, Wire는 사용자에게 재미와 몰입감을 주는 마이크로 인터렉션을 많이 사용하였다. Wire의 단순화된 주소록 검색, 아름다운 컬러, 다양한 배경화면과 색상은 Telegram, WhatsApp, Viber, 그리고 유사하게 보이는 메시징 앱들이 지배하는 세상에서 독특함으로 승부하고 있다.
Wire iOS (left) and Android.우리는 디자인에 많은 것을 투자하지만 그것을 모든 플랫폼(Android, iOS, Desktop/Web)마다 투자할 수는 없다. 특히 플랫폼의 디자인은 iOS7과 Android L의 디자인처럼 갑자기 변할 수 있기 때문에 플랫폼의 디자인을 따른다는 것은 어느 순간 플랫폼과 디자인이 맞지 않을 수도 있다는 것을 의미한다.
동시에, 플랫폼의 방식을 따르지 않는 것에 대한 위험성도 알고 있다. 그래서 우리는 항상 반복과 조정을 통해 적절한 균형을 찾기 위해 노력하고 있다. 그래서 우리는 디자인이 플랫폼에 관계 없이 쉽게 이해되도록 단순하게 만들었다.
—Priidu Zilmer, Wire’s head of design
Wire 앱의 iOS와 Andriod 인터페이스는 UX와 아이콘 디자인이 모두 매우 일관적이다. Wire 앱은 클릭 가능한 사이즈에 대한 규정 외에는 플랫폼의 가이드라인을 거의 따르지 않는다.
Wire iOS (left) and Android.VSCO Cam, Instagram, Wire는 인터페이스 디자인에서 브랜드에 촛점을 두었다. 그러나 작은 모바일 스타트업이 이 방식을 따른다고 성공할 수 있을까? 브랜드 중심의 접근이 좋은 전략이 되는 몇 가지 경우에 대해서 이야기 하겠다.
언제 브랜드 중심의 접근을 해야 할까?
동일한 사용자가 다양한 채널(Desktop, iPad, iPhone, Android)로 앱에 접근할 경우
사용자와 소통을 위해 많은 채널을 이용하는 브랜드는 브랜드 중심의 접근방식을 많이 따른다. 그러나 이 방식은 동일한 사용자가 다양한 플랫폼과 디바이스를 통해 접근을 하는 경우에만 유용하다. 예를 들면, 음악 서비스인 iBroadcast는 동일한 사용자가 iOS, Android 그리고 Desktop에서도 접근할 수 있다. 어떤 플랫폼에서건 사용자의 경험이 자연스럽게 이동되어야 하고 어떤 다른점도 느끼지 않아야 한다는 것이 iBroadcast의 가장 중요한 가치이기 때문에 이 앱은 어떤 환경에서건 유사해 보여야 한다.
우리의 서비스는 웹싸이트와 iOS 앱, Android 앱 사이를 뛰어다니는 고객을 가지고 있다.
우리는 가능하면 다양한 플랫폼에서 고객들의 경험이 일관적으로 유지되어 사용하는데 어려움을 느끼지 않게 하고싶다.
—Rod Collen, co-founder of iBroadcast
The iBroadcast app for iOS (left) and Android.멀티플랫폼을 사용하는 당신의 앱이 이런 케이스와 맞을지라도, 브랜드 중심의 접근 방식을 적용하기 전에 다시 생각해 보아야 한다. 예를 들면, 페이스북은 멀티플랫폼 디자인 적용에 있어서 혼합된 접근방식을 따랐다. 페이스북의 유저는 iOS나 Android 플랫폼을 동시에 사용하는 것이 아닌, 이중 한 가지를 통해 소셜 네트웍을 사용하는 경향이 있기 때문이다.
커스텀 UI를 사용하는 것은 직관적이며 사용자의 흥미를 끄는 인터렉션을 제공한다.
한 연구결과에서 직관적인 인터렉션의 4가지 요소를 제안했다. 느낌이 좋은(gut feeling), 말로표현할 수 있는(verbalizability), 노력이 들지 않는(effortlessness), 마법같은 경험(magical experience)이다. 이 요소들의 조합은 디자이너가 플랫폼의 가이드라인을 따르는 것에 관계 없이 일관된 사용자 경험을 만들 수 있게 해 준다. 결국, 커스텀 UI는 플랫폼의 표준보다 더 뛰어나고 인터렉티브한 경험을 제공해 줄 수 있다.
플랫폼의 차이가 사용하기에 편리함과 불편함의 차이가 될 수는 없다.
데이트 앱인 HowAboutWE의 제작자는, 다양한 안드로이드 OS 버전, 제조사, 스크린 사이즈 및 밀도에서 스타일과 레이아웃을 일관적으로 확립할 수 있는 유일한 방법은 커스텀 UI를 사용하는 것이라고 한다. 네이티브 UI는 일정부분 제약이 있지만 사용자 경험을 증진할 수 있는 방법도 항상 있다.
예를 들면, 안드로이드 예산관리 앱인 Receipt는 플랫폼의 가이드를 무시한 독특한 drop down 애니메이션을 적용하였지만, 사용하기에는 편리하다.
나는 더 좋은 방법으로 특정 기능이나 아이디어를 만들고싶을 때 가이드라인에 제시된 방법이 맘에 들지 않았다.
일반적으로, 내 방식으로 만들었을 때 사용자에게 더 좋은 피드백을 제공할 수 있거나, 불필요한 단계를 제거할 수 있거나, 워크플로우의 연속성을 유지하거나 하는 확실한 장점이 있다고 판단되었을 때만 가이드라인을 무시하였다.
—Bogdan Mihaiciuc, founder of Receipt
독특하고 아름다운 UI 솔루션이 사용자 경험을 복잡하게 할지라도, 그들은 사용자에게 훌륭한 첫인상을 주고 제품에 관심을 갖게 해 준다. 사용자가 My Day countdown 앱을 매력적으로 느끼는 이유 중 하나는 양 쪽 플랫폼에서 일관적으로 적용된 독특하게 디자인된 인터페이스 때문이다.
Citymapper의 훌륭한 UI 디자인은 웹을 포함해서 모든 플랫폼에서 앱을 돋보이게 해 준다.
친숙한 UI 동작을 제공하는 것과 브랜드로서 우리가 누구인지 명확하게 보여주는 것 사이에서 선택하는 것은 항상 벨런스의 문제이다.
독특한 디자인 랭귀지의 가치는 때때로 가치를 매길 수 없다. Citymapper? "초록색" 그것 자체로 매우 큰 가치를 가지고 있다.
— Gilbert Wedam, lead design at Citymapper
UI를 다른 플랫폼에 적용할 때, 사용하는 접근방식에 관계없이 사용자의 입장에서 바라보아야 한다. 브랜드의 일관선을 유지하면서 마찰이 없는 사용자 경험을 만들어내는 것은 훌륭한 디자이너의 덕목 중 하나이다.
The Platform Oriented Approach
Brand oriented approach와 반대로, 플랫폼에 규정된 표준을 따르는 것은 굉장히 많은 시간과 비용이 든다(UI디자인의 관점에서만). 디자인을 다른 플랫폼에 적용시킬 때, 많은 UX와 UI 요소들을 플랫폼의 형식에 맞춰 다시 만들어야 한다.
이러한 경우에, 사용자는 플랫폼의 형식에 익숙해져 있기 때문에 포커스는 브랜드 아이덴티티에서 친숙한 사용자 경험으로 이동한다. 사용자는 그들이 사용하는 플랫폼의 디자인 룰을 직관적으로 여길 것이며, Telegram과 WhatApp처럼 이런 특징을 잘 활용할 수 있다.
T E L E G R A M
Telegram은 러시아의 대형 소셜 네트웍인 Vkontakte를 설립한 Pavel Durov에 의해 공동제작된 메시징 앱이다. Telegram은 미니멀한 디자인 스타일일과 보안 encryption protocol을 지원하여 매우 경쟁력이 있는 앱이다.
Telegram은 iOS와 Android에서 동시에 런칭을 하였고, 디자인 보다는 기능에 집중을 한 앱이다. 그래서 디자인도 플랫폼의 디자인을 따르고 있다.
같은 제품의 iOS와 Android 앱이 전형적인 iOS와 Android 앱만큼 다른 모습을 보여주고 있다. iOS 버전은 애플의 가이드라인을 전적으로 따르고 있고, iOS 7/8을 위해 디자인된 앱과 같이 보인다. 내비게이션 바의 우측에는 새로운 매시지를 생성하기 위한 아이콘이 있고, 좌측에는 편집을 위한 버튼이 있다. 화면의 하단에는 섹션이 나뉜 tab bar가 있고, 상단에는 현재 화면의 제목이 나와 있다.
Telegram for iOS (left) and Android.안드로이드 버전은 구글의 Material Design 가이드라인을 따르고 있다. 내비게이션을 위한 햄버거 메뉴가 있으며, 우측 상단에는 검색 버튼이 있다. 그리고 material design의 심장이자 영혼인 floating 버튼이 있다.
Telegram contacts list in iOS (left) and Android.앱은 플랫폼의 표준 컨트롤과 UX 인터렉션을 사용하고 있다. 텔레그램의 디자이너는 앱을 만들 때 플랫폼의 가장 일반적인 룰을 따른 것 같다.
Telegram settings interface in iOS (left) and Android.
W H A T S A P P
계속 메시징 앱에 대해서 다루겠다. 또 살펴볼 것은 메시징의 전도사라고 불리는 WhatsApp이다. iOS 앱은 2009년에 출시했으며, BlackBerry와 Symbian용이 바로 나왔다. 안드로이드용 앱은 2012년에 출시했으며, 안드로이드 유저들이 사랑하는 형태로 나왔다.
WhatsApp은 거의 대부분의 플랫폼에서 사용할 수 있기 때문에, UI도 자연스럽게 플랫폼을 따르는 방법을 적용하였다.iOS와 Android 버전은 서로 완전히 달라 보인다. 디자이너는 멀티플랫폼에 적용하는데 있어서는 매우 성공적으로 작업한 것 같다. UX부터 메시지의 룩, 아이콘, 요소들의 위치까지 모두 다르다.
WhatsApp for iOS (left) and Android.
K O M O O T
Komoot는 독일에서 만들 앱으로, 하이커와 바이커에게 필요한 앱이다. iOS버전으로 2010년에 출시되었으며, 1년 후 안드로이드 버전이 출시되었다.
Komoot for iOS (left) and Android.iOS와 Android 앱은 플랫폼의 가이드라인에 충실하게 디자인이 되어 있다. 지형학적인 지도와 함께 수많은 여행 관련 컨텐츠와 쉽게 찾아갈 수 있는 내비게이션, 멋진 장소에 대한 추천 등을 포함하고 있다. 이 모든 기능들은 사용자가 쉽게 접근이 가능하다.
네이티브 UI가 더 예측가능하고 사용자에게 쉽기 때문에 플랫폼의 규칙을 따르기로 결정했다.
더우기, 애플과 구글은 그들의 UI 디자인 요구사항을 따른 앱들을 우대한다.
이것은 앱스토어와 구글 플레이에서의 프로모션에 있어 매우 중요한 점이다.
—Dmytro Prudnikov, UI and UX designer at Komoot
Komoot은 애플의 앱스토어에 지속적으로 featured 되었다. 그리고 2014년 Google Play의 Best App에 오르기도 했다. 그리고 현재도 독일에서 Google의 Top app에 들어있다.
언제 플랫폼의 규칙을 따르는 방식을 사용해야 하는가?
매우 경쟁적인 시장환경에서 빨리 런칭을 하고 사용자를 확보해야 하는 상황
앱의 컨셉을 다시 디자인해야 하더라도, 플랫폼을 따르는 방식은 개발자가 훨씬 빠르게 개발할 수 있도록 해 준다. 앱이 런칭이 되면, 사용자는 인터렉션 패턴이 친숙하다고 느낄 것이다. 더우기 디자이너는 뭔가 특별한 영감이 떠오를 때까지 기다릴 필요가 없다. 그저 가이드라인을 따르기만 하면 된다.
애플이나 구글이 정의한 디자인 트랜드가 성공적으로 증명되었다.
구글은 iOS의 앱을 Android용으로 제작할 때, 반드시 메터리얼 디자인을 따르도록 하고 있다. iPhone 유저도 메터리얼 디자인 트랜드를 매력적으로 느끼는 것 같다. 부분적으로 플랫폼의 형식을 따르지 않더라도, 디자인트랜드를 따르는 것이 중요할 수도 있다.
앱이 복잡한 기능과 인터페이스를 갖고 있을때
모바일 앱은 기능이 많은 앱이라도 가능한한 단순해야 한다. 플랫폼을 따르는 방식은 기능이나 컨텐츠가 풍부한 앱에 적용하기에 좋다. 영국의 엑센트와 사투리를 가르치기 위한 Accent Kit을 예를 들면, 녹음과 재생 등 매우 다양한 기능과 액센트를 배우기 쉽도록 텍스트와 이미지등의 컨텐츠를 매우 많이 가지고 있다. 우리가 만든 Yalatis는 안드로이드용 앱을 만들 때, 다른 방식은 고려하지 않고 플랫폼의 룰에 충실했다. 그렇지 않으면, 사용자는 앱이 제공하는 유용한 기능들을 익히기 위해 많은 노력을 들여야 했을 것이다.
The Accent Kit app for Android (left) and iOS.플랫폼의 방식을 따르면서 사용자에게 플랫폼에서의 경험을 제공하는 것은 사용자가 기대한대로 조작할 수 있다는 것을 의미한다.
어떤 앱은 성공하고, 어떤 앱은 실패한다. 플랫폼의 방식을 따르는 접근은 브랜드 이미지를 강화하려는 회사에게는 그리 좋아보이지 않을 것이다. 앱을 선생님의 강아지처럼 만들지 말라. 규칙을 따르는 학생은 친구들로부터는 사랑을 받지 못한다.
The Mixed Approach
약간의 독창성으로 브랜드의 가치를 유지하면서 플랫폼의 성격에도 맞출 수 있다. 다양한 플랫폼에서의 혼합된 접근방식은 위에 언급된 두 가지 방식을 균형있게 조합한 방식이며, 가장 복잡한 방식이기도 하다.
이 경우에, 두 가지 종류의 사용자를 고려해야 한다. 당신의 제품에 친숙한 사용자와, 전혀 사용해본 적이 없는 사용자이다. 전자는 브랜드에 충실할 것이고, 후자는 플랫폼에 익숙할 것이다. 혼합 방식을 적용하는 디자이너는 브랜드의 특성을 대표하는 동시에 사용자와 친숙한 관계를 유지하는 외교관과 같은 역할을 해야 한다. 디자이너는 어떤 UI 요소가 제품을 돋보이게 하는지, 그리고 어떤 플랫폼의 방식이 브랜드의 특징을 해치지 않는지도 판단해야 한다.
S O U N D C L O U D
유명한 오디오 스트리밍 앱인 SoundCloud는 iOS와 Android 마켓에 동시에 출시되었다. SoundCloud는 양쪽의 플랫폼의 형식에 맞춰 디자인 되었지만, 브랜드의 특징을 살리기 위해서도 많은 노력을 하였다.
모바일에서, 우리는 사용자의 플랫폼에 대한 익숙함과 우리 제품만의 특징과 브랜드를 반영하는 패턴 사이에서 적절한 균형을 찾으려고 하였다. 예를 들면, 우리가 scrubbing이라 불르는 트랙을 건너뛰는 방식은 다른 어떤 서비스들과도 다른 방식을 고수한다.
—Sylvain Grande, VP product, creators & monetization at SoundCloud
플랫폼의 방식을 따른 기능들에는 iOS에서는 화면 하단의 Tab bar와 상단의 Search bar가 있다. 안드로이드 버전은 화면 상단에 tool bar가 있고, 좌측의 햄버거 메뉴, search bar를 호출하는 돋보기 아이콘이 있다. iOS와 Android 앱 모두 플랫폼을 따르는 인터렉션이 적용되어 있다.
SoundCloud for iOS (left) and Android.
SoundCloud play screens on iOS (left) and Android.
F A C E B O O K
Facebook은 HTML5로 모바일버전이 처음 나왔지만 큰 실수였다고 설립자인 Mark Zuckerberg가 인정했다. 결국 Facebook은 iOS와 Android, 다른 플랫폼에서의 사용성을 향상시키기로 결정하였다.
반면에 Facebook의 브랜드는 막대한 영향력을 가지고 있는 반면, 여러가지 플랫폼 네트워크의 사용자도 거대했다. 그래서 브랜드 아이덴티티와 플랫폼의 방식을 조화롭게 혼합하여 적용하는 방식을 선택하였다.
Facebook의 iOS와 Android 버전은 비슷해 보이지만, 각 플랫폼의 방식과 매우 익숙하게 느껴지기도 한다. Facebook은 애플과 구글의 가이드라인을 사용자를 위한 관점에서 적용하였다. Facebook 앱의 주요 요소는 컨텐츠이기 때문에, 컨텐츠에 많은 공간을 할당하기 위해 미니멀한 디자인 스타일을 채택하였다.
Facebook for iOS (left) and Android.iOS 버전은 하단에 전형적인 iOS 네비게이션바와 상단의 검색 바를 사용하고 있고, 안드로이드 버전은 대부분의 안드로이드 앱에 적용되어 있는 상단 탭 바를 통해 섹션을 이동할 수 있다.
A I R B N B
가장 빠르게 성장하는 스타트업 중 하나인 Airbnb는 단순함과 환상적인 사용자 경험으로 인해 마켓에서 강력한 포지션을 가지고 있다.
Airbnb의 디자이너는 서비스를 모바일에 도입할 때 혼합 방식을 적용하였다. 브랜드 자체는 독특하며 전세계의 사용자들에게 사랑을 받고 있다. 그러나 이 앱의 가치는 컨텐츠에 있다. 그래서 Airbnb의 제작자들은 제품을 양쪽 플랫폼에서 사용하기 편리하게 만들었다.
우리는 모든 사용자가 우리의 앱을 친숙하게 느끼길 원한다. 그래서 사용자에게 익숙한 방식으로 사용성을 제공하고자 합니다. 그러나 또한 사용자들이 하나의 Airbnb로 경험하기를 원하기도 한다.
플랫폼 간의 일관성 - mobile, web, email, etc. - 은 우리가 만드는 신뢰감에 있어 중요하다. 그러므로 우리의 결정은 단지 다양한 플랫폼의 표준에 의해 결정되지 않는다.
경험을 통합하는 연속성의 맥락은 브랜드이다.
—Katie Dill, head of experience design at Airbnb
첫 인상에서, Airbnb의 iOS와 Android의 차이는 네비게이션 바의 위치이다. iOS에서는 하단에, Android에서는 상단에 있다.
Airbnb for iOS (left) and Android.이 작지만 큰 특징이 아니라면, Airbnb는 브랜드에 충실한 접근방식을 적용했다고 여겼을 것이다. 그러나 자세히 보면, iOS와 Android 간의 차이는 더욱 확실해 진다.
Airbnb search screens on iOS (left) and Android.
Airbnb navigation on iOS (left) and Android.
V I B E R
Viber야말로 혼합된 디자인 접근방식의 대표적인 예이다.
WhatsApp과 Telegram과는 달리, Viber의 디자이너는 플랫폼의 요구사항을 따르면서도 브랜드의 아이덴티티를 거의 완벽하게 표현하였다. 혼합된 방식의 접근으로 어떤 플랫폼에서도 Viber를 인식하기 쉽고, 사용하기에도 편리하게 만들었다. 다시 말하면, 사용자는 Viber를 다른 메신저와 혼동하지 않을 것이고, 필요한 동작을 하기 위해 어떠한 어려움도 겪지 않을 것이라는 것이다.
Viber for iOS (left) and Android.Viber는 독특한 색상과 아이콘으로 두 플랫폼에서 모두 브랜드 아이덴티티를 나타내고 있다. iOS와 Android 앱을 사용하기 쉽게 만들기 위해, 앱의 스크린 간의 내비게이션은 플랫폼의 방식에 맞춰져 있다.
Viber contacts lists in iOS (left) and Android.브랜드를 강하게 표현함에도 불구하고, Viber는 인터페이스와 인터렉션에서 사용자의 기대를 완벽하게 만족시킨다. 그리고 기능에 집중할 수 있도록 해준다.
언제 혼합된 방식을 사용해야 하는가?
피드백과 평가에 기반한 제품의 디자인을 점차적으로 발전시키고 다듬어야 할 때
혼합된 방식은 iterative design 방법론에 기반하여 사용자 경험을 지속적으로 연구한다는 것을 의미한다. 이것은 사용자가 제품에 어떻게 인터렉션 하는지 이해하기 위해 메트릭스를 분석하고, 개선점을 지속적으로 업데이트 하고, 다시 메트릭스를 분석하고, 성장률을 유지해야 한다는 것을 의미한다. Iterative design은 프로토타이핑, 테스팅을 하고 성공적인 버전을 분석하고 개선하는 주기적인 프로세스 안에서 수행되는 연구를 의미한다.
혼합된 방식은 경험이 브랜드를 말해주도록 하는 기능을 한다. 나는 이 방식이 다양한 플랫폼에 적용하기 위한 가장 이상적인 방법이라고 생각한다. 혼합된 방식이 플랫폼과 브랜드, 사용자에게 정직한 방법이다. 반면에, 이 접근방식은 디자이너가 브랜드와 플랫폼 가이드라인 사이에서 밸런스를 맞출 수 있도록 해 주며, 훌륭한 결과를 가져다 줄 것이다.
이 방식의 유일한 단점은 훌륭한 앱 디자인을 위해 충분한 시간과 비용을 투자할 여력이 없는 작은 스타트업에게는 거의 불가능한 방식이라는 것이다. 더우기, 사용자 테스트 없이 첫번째 버전을 올바로 내놓기에는 운에 맡길 수 밖에 없는 방식이다.
어떤 접근방식이 맞을까?
혼합된 접근방식이 가야할 길이라도, 어떠한 방식도 완벽한 방식은 아니라고 본다.
아무리 앱의 디자인이 아름다워도 플랫폼의 표준보다 브랜드 아이덴티티를 선택하는 것은 사용자 경험의 문제를 일으킬 수도 있다. 결국 사용자는 메뉴가 어떻게 나타나는지, 특정 기능을 위해 어디를 swipe해야 하는지, 프로파일 페이지로 어떻게 돌아가는지 알아내야 한다.
플랫폼 중심의 접근방식은 너무 표준화되 보이거나, 브랜드를 잘 표현하지 못하는 위험성이 있다. 반면에, 앱이 기능이 매우 많고, 사용자층이 넓을 경우 성공적일 것이다.
혼합된 방식의 예로 든 앱들은 매우 성공적인 케이스들이다. 그러나 똑같은 결과를 얻기위해 노력을 하지 말라는 것은 아니다.
앱을 디자인 할 때, 우리는 실제 상황에서 실제 디바이스에서 실제의 사람들이 사용을 한다는 것을 항상 기억하려고 한다. 사실, 그것은 브랜드나 플랫폼이 아니며, 당신이 중요하게 생각하는 creativity도 아니다. 유일하게 중요한 것은 사용자이다. 사용자는 당신이 적용한 멀티플렛폼 접근방식에 상관하지 않는다. 우리가 그것을 좋아하던 그렇지 않던, 모든 사용자는 제품과 함께하는 전반적인 경험에 관심이 있고, 그것이 긍정적이면, 제품은 성공하는 것이다.
원문 출처 : Approaches For Multiplatform UI Design Adaptation: A Case Study
