brunch

You can make anything
by writing

C.S.Lewis

by 뀨언 Jan 24. 2021

UX 디자이너가 벤치마킹하는 법

The hidden powers of benchmarking in UX


UX 디자인에서 바람직한 벤치마킹이란 무엇이고 어떻게 이루어져야 하는가에 대한 Lucas Didier의 미디엄 글을 번역한 포스트입니다. 표준 사용성이 곧 유저의 편의로 이어지는 UI/UX에서 항상 표절과 벤치마킹은 뜨거운 감자입니다. 후반부엔 구체적인 예시와 함께 벤치마킹에 좋은 사이트까지 소개하는 친절한 글입니다. UXUI에서 사용되는 외래어는 굳이 한글 번역하지 않았습니다. 오늘도 부족한 번역 읽어주셔서 감사합니다. 오타, 오역 등 피드백은 언제든 정말 감사한 마음으로 받겠습니다!


아래는 원문입니다.

https://uxdesign.cc/the-hidden-powers-of-benchmarking-in-ux-design-796296f7a9c1




UX 디자인에서 벤치마킹의 숨은 힘


그저 쳇바퀴 돌듯 재생산하지 않기 위함입니다.


"다른 앱들을 카피하지 마세요. 틀 밖에서 사고하세요. 혁신적이길 바랍니다."


이 인용문은 제가 종종 듣거나 읽은 말들입니다. 대다수의 "비전을 가진" 설립자들은 그들의 앱이 특색 있기를 바랍니다. 모두를 놀라게 할 완전히 새로운 사용자 경험(UX) 혹은 콘셉트를 제공하고 싶어 합니다. 그러나 오직 소수의 희귀종들만 완전히 새로운 인터렉션을 생각해 낸 것처럼 보이게 할 수 있습니다. 틴더(데이팅 앱)는 "스와이핑"제스처를 선보였습니다. 스냅챗(Z세대 이미지 메신저)은 일정 기간이 지나면 지워지는 사진 메시지 우선의 콘셉트와 스와이핑 제스처 베이스의 내비게이션을 제시했습니다. 아래 사진에서 알 수 있듯, 구글맵은 여행, 라이프스타일 그리고 모빌리티 앱들에 영감을 준 지도 기반의 장소 추천 경험을 제공했습니다.

어느 집이 원조죠?




훌륭한 예술가는 훔친다.


제 첫 직장인 BlaBlaCar(프랑스의 카풀 앱)에 있던 동안 새로운 기능을 구상할 때, 저희는 가장 괜찮은 관행을 기계적으로 벤치마킹했습니다. 이전 제 동료는 종종 파울로 피카소의 말을 반복하며 벤치마킹을 권했습니다.


"좋은 예술가는 따라 하는데 그치지만, 훌륭한 예술가는 훔쳐버린다."


이 구절을 조사한 사람에 따르면, 이 말은 사실 스티브 잡스가 파블로 피카소의 말로 오인하고 발언한 것이라고 합니다.

두 현명한 사람들

누가 이 말을 처음 했든, 요지는 예술은 다른 예술가의 생각들로부터 영감을 받는 것이 전부라는 것입니다.

좋은 예술가는 따라 하지만 그렇다고 두 개가 같아 보일 정도로 너무 똑같이는 하지 마세요. 훌륭한 예술가는 훔친다. 왜일까요? 바로 그들은 다른 예술가의 기존 스타일을 가져오지만 적어도 더 나은 것으로 만듭니다. 그렇게 되면 사람들은 그 스타일이 초기 창작자보다 훔쳐버린 그 예술가와 훨씬 더 연관 있다고 생각하게 됩니다.




새로운 양식을 창작하는 것은 위험 부담이 크다.


완전히 새로운 사용자 경험을 제시하기를 바라는 것은 몇몇 문제를 가져옵니다.


사용자를 혼란하게 할 가능성이 너무 높은 위험

혹시 제이콥 닐슨(Jakob Nielsen)이라는 사람을 아시나요? 그는 미국의 대형 인터넷 UX 컨설팅 기업인 닐슨 노먼 그룹의 공동 창립자입니다. 제이콥은 "제이콥 법칙(Jakob’s Law)"을 개발한 것으로 유명합니다. 이 인터넷상 사용자 경험의 법칙은 이렇게 말합니다.


"사용자들은 대부분 다른 사이트에서 그들의 시간을 사용한다. 이것은 즉, 사용자들이 당신의 사이트도 이미 그들에게 익숙한 방법으로 다른 사이트에서 처럼  작동하기를 바란다는 뜻이다."
거실에 걸어도 손색 없을 멋진 포스터


이 제이콥 법칙에 따르면, 사용성 측면에서는 이미 존재하는 UI/UX를 사용하도록 규제하는 것이 낫습니다. 인터넷 세상에서는 '잡스에 의한 피카소 명언'이 기본적으로 이런 식으로 작용합니다. 실제로 창의적인 방법은 환영받지 않습니다. 그러나 마이크로 인터렉션 혹은 이스터 에그 등을 이용해 사용자를 즐겁게 할 수 있습니다.  (좋은 예시를 보려면  LittleBigDetails 이곳을 방문하세요.) 제 생각에 실제로는 오직 구글, 애플, 우버, 스포티파이와 같은 소수의 IT 거물 기업들만이 새로운 UI/UX 패턴을 구축할 만한 힘과 영향력을 가지고 있습니다. 어디에도 없던 완전히 새로운 패턴을 도입하여 사용자를 혼란시키는 것은 위험부담이 너무 큽니다.




IT 거물 기업들마저 실패를 합니다- 그러나 그들은 그것을 감당할 수 있습니다.


최고의 기업들도 새 UX 패턴을 소개하고 혹평을 받을 수 있습니다.

구글 독스의 새로운 공유 경험을 살펴보겠습니다. 인터넷상 모든 유저들이 짜증 내는 모습을 살펴볼 수 있습니다.

진짜로 이해하기까진 몇 주가 걸렸습니다. 왜 이런 반응이었을까요? 흠.. 저희는 "확장/축소(expand/collapse)" 의 이중 레이오버 시스템을 사용하지 않습니다. 이는 완전히 일반적인 사용성에서 벗어난 패턴입니다.


이 외에도 언급할 수 있는 예시들이 많습니다. 애플은 최근 iOS14 업데이트에서 알람 시계의 설정 부분 UX를 개조하며 사용자를 매우 화나게 했습니다.

우린 이걸 그냥 "퇴화"라고 부릅니다.

사람들은 때때로 업데이트 사항을 철회해달라는 청원까지 만들 정도로 화냅니다. 그러나 저는 사실 이런 업데이트로 인해 더는 구글독스나 아이폰을 쓰지 않겠다고까지 말하는 사람을 본 적은 없습니다. 만일 사람들이 이런 새로운 패턴에 적응한다면, 아마 언젠간 받아들이고 말 것입니다. 어쨌건, 이 사례들은 새로운 패턴에 적응하도록 강제할 만한 능력이 되는 구글과 애플입니다. 최악의 경우엔 이런 회사들이 사용자들의 선택을 받지 못하는 신제품을 출시하기도 합니다. 구글에서 출시한 이메일 대안 어플이자 한정적 접근 권한을 가지고 몇 년 전 출시한 인박스 Inbox를 생각해봅시다. 모두들 바로 초대를 받아 접근 권한을 가지기 위해 난리였습니다.


인박스, 여기 잠들다

당시의 "상단 고정", "다시 알림", "완료"등의 인박스 기능은 지저분한 메일함을 깔끔하게 만들려는 혁신적 노력의 흔적이었습니다. 그러나 그 기능들은 언제나 사용자에게 바로 이해가 갔던 것은 아니었습니다. 몇몇 사용자는 인박스를 "더 헷갈리는 지메일"이라고 칭하기도 했으니까요.

핀, 스누즈, 지우기, 완료 : 인박스의 네 가지 메인 기능

여기에 끝끝내 개선되지 않은 혼란스러운 사용성의 문제가 다수 추가되어 결국 2019년 구글은 인박스 서비스를 종료합니다. 이 독특한 UX 패턴은 인박스의 실패를 초래했습니다. 하지만 그게 구글로서 엄청난 타격은 아니었죠. 그러나 시장에 호언장담하며 제품을 선보인 스타트업 기업이었다면 불편한 UX 때문에 서비스를 종료하게 된 것이 매우 큰 손해였을 것입니다.




벤치마킹은 무작정 경쟁자를 따라 하는 것이 아닙니다.


다른 서비스를 벤치마킹 하란 뜻은 경쟁사의 디자인을 픽셀 단위까지 똑같이 따라 하라는 뜻이 절대 아닙니다.마치 Zoom의 메인 인터페이스를 베껴간 JioMeet처럼요...

틀린 그림 찾기!

사실, JioMeet는 아마 사용자들에게 친숙한 환경을 제공하고 Zoom과의 전환이 쉬울 수 있도록 하는 등 좋은 의도였을 것입니다. 그러나 이 픽셀 단위까지 똑같은 카피는 인도 유저들의 국제적 반발과 공개적으로 표절을 인정한 JioMeet를 강타하는 결과를 초래했습니다.




시간을 허비하라는 소리가 아닙니다.


벤치마킹이라는 개념은 문제를 지나치게 의식하느라 생기는 시간 낭비를 피하자는 것입니다. 매번 디자이너는 새로운 기능을 작업할 때마다 그에 주입시키고 싶은 몇 기능을 구상합니다.


Bandsintown이라는 음악 팬들에게 다가올 콘서트에 대한 정보를 제공하는 스타트업이자 제 클라이언트의 실례를 들어보겠습니다. 최근 프로젝트에서 저는 음악 마케터들이 이메일 캠페인을 만들 수 있도록 설계한 그들의 프로모션 도구, SaaS(Software as a Service: 소프트웨어형 서비스)를 감사했습니다.


UX 문제들 중, 저는 그 기능이 자사의 "이전 캠페인"형식과 레이아웃이 유사함을 발견했습니다. 그리고 그것은 아주 새로운 플로우였지만 어떤 행동이 전체적 캠페인 비용에 정확히 어떤 영향을 미칠지 유저들에게 잘 안내되지 않았습니다.



결과적으로, 우리는 이 경험을 개선할 필요성을 느꼈고 더 단계적인 플로우로 쪼갰습니다. 사용자들이 단계별 어떤 행동이 캠페인 비용에 얼마나 영향을 미치는지 완벽히 이해가 갈 수 있도록 말이죠.


제가 적용시키고 싶었던 기능은 '전체 비용에 대한 즉각적이고 시각적인 반응을 통한 단계별 경험'이었습니다.

저는 가장 좋은 영감을 Bandsintown의 경쟁사가 아닌 분석과 분기별 해석 서비스를 제공하는 FullStory라는 곳에서 얻었습니다.


FullStory의 온보딩 경험

이를 통해 저는 Bandsintown의 캠페인 창작 경험을 개선하는 데에 있어 아주 흥미로운 아이디어를 떠올릴 수 있었습니다. Bandsintown의 경쟁사 중 어느 곳도 이와 같은 기능을 제공하지 않았기에 더욱더 다른 산업군의 서비스로부터 받은 영감은 혁신적인 해결방안을 구상하는 데에 도움을 주었다는 것은 중요한 사실입니다. 벤치마킹을 할 때, 더욱이 당신이 종사 중인 서비스에만 한정하지 말고 일반적 UX 경험을 디자인과 기능에 접목시켜보려는 시도가 중요합니다. 그러면 해당 원칙을 포함하는 산업군들과 특정 제품을 찾아보는 것이 중요합니다.




어떤 제품들을 벤치마킹해야 할까?

   

첫째, 당신이 종사 중인 산업군의 최고의 제품 목록을 만듭니다. 바보처럼 아이디어를 훔치기 위한 생각은 하지 마세요. 하지만 제이콥 법칙에 적용되는 패턴을 찾아보세요. 예를 들어, 지도에서 어떤 결과를 보여  필요가 있다면 모빌리티나 여행 어플이 유사한 방식을 이미 선보이고 있음을 알아차릴  있을 것입니다. 사용자를 헷갈리지 않게 하려면  단계를 적용하는 것은 중요합니다.

그다음, 다른 산업군에서 유사한 패턴을 찾습니다. 경쟁사를 베끼지 않고 창의적이고 고정관념을 탈피한 아이디어를 찾는 가장 좋은 방법입니다. 예를 들면, 개인적인 경험이지만 TransferWise(해외 송금 금융 플랫폼)의 환전 과정 중 "요약 페이지"가 부동산 관련 서비스인 제 클라이언트의 "요약 페이지"를 만드는 데에 아주 좋은 영감을 제공했습니다.




1단계 : 당신만의 자료실을 만드세요

언제든 아주 훌륭한 인터페이스나 플로우를 마주하면 저는 스크린샷을 찍어 그것들을 드롭박스 내의 "벤치마크" 폴더에 저장합니다. 저는 제 기준 중요한 UI/UX토픽 순으로 폴더를 정리했습니다(예시로 "가격 페이지", "Gamification(게임화)", 그리고 "좋은 비교 페이지"). 이렇게 정리하면 언제든 제가 영감이 필요할 때 다시 찾아보기 쉽습니다.

몇몇은 클라이언트들의 서비스로부터 영감을 받았습니다.

만일 피그마나 스케치 같은 디자인 툴을 사용한다면 벤치 마킹 전용 프로젝트를 하나 생성하고 프로덕트당 하나의 탭이나 페이지를 만들어 쉽게 찾을 수도 있겠죠?




2단계 : 시간 절약을 위해 벤치마킹 사전을 이용하세요.


어쩔 때는 계정을 생성하고 어쩔 때는 결제까지 해야 하는 등 시간과 돈을 들여 흥미 있는 모든 서비스와 페이지를 기계적으로 들여다보고 있는 대신 아주 좋은 벤치마킹 사이트가 있습니다. 시간 절약에 굉장한 도움이 될 것입니다.   


Mobbin.design : iOS 인터페이스 레퍼런스 모음

Pageflows : SaaS(소프트웨어 서비스)와 모바일 인터페이스 등을 제공하고 사용 비디오까지 볼 수 있습니다. 하지만 연간 $99를 지불해야 합니다.

Really Good Emails : 이메일 레이아웃을 참고할 레퍼런스를 제공합니다.

SaaS Pages : SaaS 랜딩 페이지 참고하기에 좋습니다.


On Mobbin.design, you can filter by patterns, for instance “Pricing”

분명 이 외에도 좋은 벤치마킹 사이트들이 존재할 것입니다. 만일 알고 계시다면 댓글을 통해 알려주세요.




3단계 : 당신만의 "핸드북"을 만드세요.


어떤 특정 플로우나 인터페이스를 엄청 많이 벤치마킹했다면 최상의 적용 법을 터득하기 시작할 것입니다. 그렇다면 그 적용 내용을 어딘가에 적어 모두와 공유하기를 추천합니다. 이는 당신의 생각을 구조화하고 작업하는 데 있어 더 나은 퍼포먼스를 이루는 데에 도움을 줍니다. 이것은 제 사이트입니다 : Designing complex user forms: 12 UX best practices (이하 최고의 12가지 적용 사례).


이 '최고의 12가지 적용 사례'를 통해 복잡한 리드 제네레이션(Lead generation), 구매 혹은 예약 단계 등등의 UX를 개선해야 하는 클라이언트와 작업할 때마다 아이디어 구체화 단계에서 어마어마하게 시간 절약이 가능합니다. 제 클라이언트의 상황에 '최고의 12가지 적용 사례'가 해당이 되는지 확인하는 데에 시간을 들이긴 하지만, 확인이 끝나면 바로 와이어 프레임 구상 단계로 넘어갈 수 있습니다.


가장 좋은 적용 사례의 "핸드북(혹은 프레임)"을 만들고 공유하는 것은 사실 오래된 마케팅 기법입니다. 거대한 컨설팅 기업 보스턴 컨설팅 그룹은 (Growth-share matrix를 사용하는 Boston Consulting Group) 이미 레드오션인 컨설팅 산업계에서 인지도를 얻고 눈에 띄기 위해 이 방법을 사용합니다. 프로덕트 디자인에서도 이와 마찬 가지로, 만일 당신이 프리랜서라면 이 방법은 당신을 차별화하는 데에 유용할 것입니다. 만약 회사에서 근무한다면, 팀과 이를 공유하면 더 효율적이고 정돈된 업무환경을 갖출 수 있을 것입니다. 결국 당신은 좋은 동료가 될 것입니다.



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