brunch

You can make anything
by writing

C.S.Lewis

by 김자유 Jan 30. 2020

데이터 기반으로 UX 설계하기

*본 글은 디자인 뉴스레터 디독에서 발행한 글입니다.

해외 디자인 아티클 번역 뉴스레터 '디독' 구독링크: http://bit.ly/2FNQNpv

책 보러 가기


Insight


비즈니스에서 활용되는 데이터는 기업 매출 창출에 큰 역할을 합니다. 특히 사용성이 상향 평준화되면서, UX 디자이너는 디자인이 비즈니스에 얼마나 기여하고 있는지를 판단할 수 있어야 하죠. 데이터의 시대. 이제 디자이너는 심미성을 넘어, 사용자의 행동을 끌어내는 데이터 기반의 디자인을 탐구해야 합니다. 그렇다면 데이터는 무엇이고, 어떻게 분석해야 하는 걸까요? 저와 같은 데이터 입문자를 위해 몇 가지 목차를 골라 정리해보았습니다.


데이터에 관한 오해

데이터 분석하기


1. 데이터에 관한 오해


데이터를 분석하기 전에 데이터에 관한 오해를 풀어보면서 개념을 짚어봅시다.


첫째. 데이터는 숫자와 수치를 의미한다.

데이터는 다양한 형태로 정의할 수 있는데, 이때 사이트와 웹을 분석하기 쉽도록 정형화한 것이 바로 수치입니다. 하지만 수치만으로 사용자가 어떻게 느꼈는지, 무엇을 기대하는지 알 수 없죠. 따라서 데이터는 단순히 숫자와 수치가 아닌 다양한 관점에서 수집해야 합니다.


둘째. 디자이너의 역할은 데이터 측정 및 결과를 공유하는 일이다.

데이터는 행동을 일으키지 못하면 의미를 상실합니다. 따라서 디자이너는 단순한 보고자가 아니라, 데이터의 결과를 통해 사이트를 개선하는 액션을 취해야 합니다. 더불어 데이터를 분석하기 전에는 수집 목표를 정확히 세워야 하며, 그 목적에 따라 측정과 수집 방법이 달라질 수 있습니다.


셋째. 데이터는 숫자가 가장 중요하다.

데이터는 숫자나 수치보다 패턴이 더 중요합니다. 패턴은 '추세'를 가리킵니다. 예컨대 오늘 방문자가 20% 증가했다 하더라도 지난 3개월간 계속 줄어드는 추세였다면, 20% 증가는 큰 의미가 없을 수 있습니다.


넷째. UX 디자인과 관련된 의사 결정은 모두 데이터를 바탕으로 실행해야 한다

데이터는 다양한 시장, 측정 환경, 분석자 등에 따라 그 결과가 달라질 수 있습니다. 따라서 데이터뿐만 아니라 자신이 속한 팀의 목표와 기업의 목표, 시장의 트렌드 등의 환경을 고려하여 보는 자세가 중요합니다.


2. 데이터 분석하기

그림 1. 데이터에 기반한 UX 디자인 프로세스
그림 2. 커머스 사이트의 퍼널 예시

데이터 분석은 데이터에 기반한 UX 디자인 프로세스에서 이루어집니다. 기존 방식과 달리, 데이터 분석을 통해 빠르고 정확하게 비즈니스 성과를 내는 특징이 있죠. 이 데이터 분석 프로세스는 '퍼널'(깔때기)에서의 전환율을 높이는 일인데, 그림2처럼 서비스 단계별로 사용자가 줄어드는 것을 막는 일을 뜻합니다.


데이터를 분석하는 툴은 여러 가지가 있지만 손쉽게 사용할 수 있어야 합니다. 저자는 데이터를 시각화한 뷰저블의 '히트맵'을 통해, 사용자의 정성적인 행동, 이를테면 마우스 클릭, 스크롤 등의 데이터를 분석하는 방법을 정량적으로 설명합니다. 이러한 방법을 활용하면 UX 디자이너도 데이터로 문제를 수월하게 해결할 수 있을 것입니다.


예시: Average Fold 히트맵 분석

스크롤 히트맵과 스크롤링에 따른 사용자 이탈 현황 차트

Average Fold는 스크롤을 이동하지 않고도 볼 수 있는 화면의 경계를 말합니다. 위 그림은 스크롤 상단과 하단의 도달률 차이를 그래프로 보여주고 있는데요. 우측의 사용자 이탈 현황 차트에서 사용자의 비율(PV Rate)을 의미하는 초록색 막대그래프가 페이지 하단으로 갈수록 줄어드는 것으로 보아, Average Fold 영역만 확인한 사용자가 많다는 사실을 알 수 있죠.


Above the Fold는 사용자의 추가 탐색을 유도하는 기준이 됩니다.

더불어 닐슨 노먼 그룹의 'Scrolling and Attention' 연구에 따르면, 사용자가 스크롤을 이동하더라도 Above the Fold 영역에서 80%의 시간을 할애한다고 합니다. 저는 가끔 스크린에 노출되는 콘텐츠의 높이 값을 고민하곤 했었는데, 책 속의 데이터 분석 자료를 참고하여 위 그림처럼 더 나은 UX 개선 방향을 찾을 수 있었습니다.


데이터가 두려운 실무자들을 위한 입문서. 종장을 읽은 후, 부제를 참 잘 지었다는 생각이 들었습니다. 이 책은 기본적인 데이터의 개념부터, 예제를 바탕으로 데이터 분석을 기초, 응용, 심화로 나누어 쉽게 설명하고 있습니다. 따라서 UX를 공부하는 학생들 혹은 디자이너가 아닌 직군도 데이터를 수월하게 이해하고, 나아가 데이터를 보면서 실무에서 함께 협업하는 데 도움이 되리라 확신합니다.


One more


데이터 입문자를 위해 데이터를 쉽게 분석할 수 있는 비주얼 애널리틱스 툴을 소개합니다. 대부분 트라이얼을 제공하고 있으니 구글 애널리틱스와 같은 웹 로그 분석 툴과 함께 실제 서비스에 적용해봐도 좋을 듯합니다.


뷰저블

이 책을 출간한 포그리트에서 개발한 뷰저블입니다. 히트맵, 퍼널 등의 기본 기능과 더불어 웹 로그 분석, A/B Testing 등을 지원합니다. 친절한 한국어 설명으로 사용법을 쉽게 익힐 수 있다는 장점이 있습니다. 최초 이용 시 14일 무료 트라이얼을 제공합니다.

웹사이트 보러 가기


hotjar  

hotjar는 가장 잘 알려진 히트맵 분석 툴입니다. 다양한 기능을 제공하는 올인원 툴로, 명성만큼 가장 직관적인 사용성을 가지고 있다는 평이 많습니다. 히트맵에서 마우스 클릭과 동시에 이동 경로까지 표시해주기 때문에, 사용자의 상호작용을 알기 쉽다는 장점이 있습니다. 최초 이용 시 15일의 트라이얼을 제공합니다.

웹사이트 보러 가기


crazyegg  

crazyegg는 히트맵 분석 툴 중 두 번째로 많은 점유율을 가지고 있습니다. hotjar와 유사한 기능을 제공하는 반면에, 히트맵에서 콘페티(confetti)라는 기능으로 클릭 수를 다른 카테고리(신규 방문자와 재방문자, 국가, 브라우저 등)로 보여줌으로써, 방문자 그룹의 차이점을 쉽게 확인할 수 있다는 장점이 있습니다. 또 javasript와 호환되며, 30일 트라이얼을 제공합니다.

웹사이트 보러 가기



*본 글은 디자인 뉴스레터 디독에서 발행한 글입니다.

해외 디자인 아티클 번역 뉴스레터 '디독' 구독링크: http://bit.ly/2FNQNpv


매거진의 이전글 iOS vs Android 어떻게 디자인해야 할까?
작품 선택
키워드 선택 0 / 3 0
댓글여부
afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari