[UX 특강(조엘 마쉬)] 데이터 디자인 (#28~31) END

#28

지금까지 사용자 연구, 목표 설정, 정보 설계 계획, 사용자 시선 유도, 와이어프레임 만들기, 사용자 심리 이해하기를 배웠습니다. 이제 출시할 시간입니다! 출시한다는 얘기는 뭔가 측정할 게 생긴단 얘기죠. 그러니 이걸 알아봅시다.

데이터란 무엇인가

****

* 데이터는 객관적입니다.

초반 글에서 사용자 연구에 대해 다룬 바 있습니다.

데이터는 달라요.

데이터는 사용자의 행동을 측정합니다. 뭘 하는지. 몇 번이나 했는지. 얼마나 걸렸는지 등등이요.

컴퓨터가 이런 데이터를 수집하기 때문에 사용자에게는 영향을 끼치지 않습니다. 측정 기준이 잘 정의되어 있기 때문에 에러도 굉장히 낮습니다. 여러분이 따로 노력하지 않아도 수백 만명을 측정합니다. 그리고 사용자가 어떤 브라우저를 사용하는지, 어느 나라에 있는지 등을 알려주죠.

그리고 데이터는 절대로 거짓말을 하지 않아요. 이건 과학입니다. x팔!

하지만 여러분에게 맥락에 대해선 아무 것도 알려주지 않으니 조심하세요. 불행히도 우리 디자이너들은 데이터를 해석해야 하고, 거기에서 실수가 일어납니다.

****

* 데이터는 사람들로 구성됩니다.

데이터를 “그냥 숫자”로 취급해서 원하는 어디에나 갖다 쓰고 싶을 겁니다. 하지만 그 숫자들은 복잡한 삶을 사는 실제 사람들의 행동을 나타내고 있다는 걸 기억하세요.

수백 만명을 단 하나의 숫자로 만들고, 그게 어떤 상황에도 믿을만한 것이라 생각하지 마세요.

여러분이 옳다는 걸 “증명”해줄 수 있는 숫자를 찾으려는 유혹도 있을 겁니다. 그러지 마세요. 그렇게 해달라는 사람한테도 ‘아니오’라고 답해주세요.

****

* 데이터는 많으면 좋습니다.

다섯 명의 클릭을 측정했다면, 그 다섯 명이 전부 취해있었을 지도 모릅니다. 여러분은 그걸 알 길이 없어요. 5백만 명의 클릭을 측정했다면 이들 모두가 취했을 가능성은 굉장히 희박합니다. 봄방학 때 멕시코 칸쿤에 있는 사람들만 잰 게 아니라면 말예요.

데이터로 내리려는 결정이 중대할수록, 결정하기 전에 더 많은 데이터가 필요합니다. 하지만 일단 데이터가 어떤 방향으로 얘기했다면, 데이터가 이미 얘기한 거에요!

****

* 사용자의 객관적 데이터를 수집하는 몇 가지 방법

사용자의 객관적 데이터를 수집하는 방법은 사용자를 주관적으로 연구하는 방법만큼이나 많습니다.

분석 – 구글 등 많은 회사들이 여러분의 사용자가 무엇을 하는지 익명으로 추적하는 방법을 제공하고 있습니다. 싸거나 무료로요. 사용자가 페이지를 로드하거나 뭔가를 클릭할 때마다 알 수 있어요. 커스텀 측정 방식을 만들 수도 있기 때문에 하늘만이 한계가 되겠죠.

A/B 테스트 – 똑같은 걸 두 가지 버전으로 디자인한 다음 동시에 출시합니다! 실시간으로 실제 사람을 대상으로 테스트하기 때문에 어떤 쪽이 효과적인지 알 수 있습니다. 그런 소프트웨어는 테스트를 언제 멈춰야 할 지도 알려줍니다. 어느 정도를 넘으면 테스트 대상이 늘어나도 결과가 크게 바뀌지 않게 되거든요.

눈 추적 – 실험실에서 진행되지만 사용자가 제어할 수 없기 때문에 객관적이라고 봅니다. 특별한 소프트웨어와 장비를 통해 사용자가 여러분의 디자인을 하면서 어디를 보는지 측정합니다. 그 결과로 디자인이 사용자를 제대로 안내했는지 아닌지를 알 수 있죠.

클릭테일 (ClickTale) – 히트맵을 이용해서 클릭과 스크롤, 흐름을 측정해주는 회사입니다. 다른 곳도 있어요. 클릭테일의 소프트웨어는 실제 사용자가 사용하는 것을 익명으로 녹화할 수 있게 해줍니다. 사용자의 입력값을 가려지지만, 어디를 클릭하는지, 마우스가 어디로 가는지, 스크롤을 얼마나 내리는지, 어떤 페이지들을 옮겨다니는지 등을 볼 수 있습니다. 완전 유용해요.

검색 기록 – 여러분 사이트의 검색 칸에 타이핑한 모든 단어를 따로 저장할 수 있다는 걸 모르는 분들이 많더라고요. 사용자들이 뭔가를 검색한다면, 사용자들이 그 뭔가를 찾지 못했단 뜻이죠. 이런 기록은 여러분의 정보 설계와 레이아웃을 개선하는 데에 완전 소중합니다!

****

이건 시작에 불과합니다. 다음 글에서는 어느 웹사이트에나 의미있는 기본적인 숫자들을 볼게요. ‘요약 통계’ 기대해주세요.

 

#29

웹사이트를 분석하려고 계획 중이라면, 곧 구글 어낼리틱스로 가서 사이트의 건강도를 바라보게 될 겁니다. UX 디자이너는 이 작업을 마케터와는 좀 다른 방식으로 하게 되는데요. 이번 글에서는 기본을 배워보죠.

데이터로 디자인하기 – 요약 통계

****

웹사이트에서 뭔가를 하고 싶다면 이해해야 할 기초 통계가 7종 있습니다. 어떤 걸 측정하는지만 알면 되는 게 아니라, 어떤 의미인지도 알아야 해요.

숫자 자체는 좋지도 나쁘지도 않습니다. 사용자 1백만 명이라고 해도 지난 달보다 늘었을 때에만 좋은 겁니다. 여러분이 페이스북인데 이번 달 사용자가 1백만 명이라면 문제가 생긴 거죠.

뭔가를 분석하기 전에 여러분의 사이트는 어떤 행동을 하는 곳인지 잠시 생각해보세요. 그런 행동을 나타내는 숫자들은 어떤 걸까요?

****

1) & 2) 총 방문자수(Total visits) & 순 방문자수(Unique visits)

약간 놀랄지도 모르겠지만 총 방문자수는 사이트가 몇 번 방문됐는지 전체 회수를 측정합니다.

순 방문자수는 조금 달라요. 제가 여러분의 사이트를 50번 들어가도, 저는 순 방문자 수로 따지면 1명인 거죠. 기술적으로 이 숫자는 “사람”이 아닌 기기를 기준으로 집계합니다.

의미: 이 숫자들을 비교하면 사이트 트래픽에 대해 다음을 알 수 있습니다.

질이 높다 – 총 방문자수가 순 방문자수보다 훨씬 많다.

양이 많다 – 총 방문자 수가 순 방문자수와 엇비슷하고, 순 방문자수가 지난 달보다 많다.

둘다 – 순 방문자수가 지난 달보다 많고, 총 방문자수가 순 방문자수보다 훨씬 많다.

둘다 아님 – 순 방문자수가 지난 달보다 적고, 총 방문자수가 순 방문자수와 엇비슷하다.

“순 방문자수”가 트래픽을 좀 더 제대로 나타내긴 합니다만, 저는 10,000명이 한 달에 한 번 방문하는 것보단 1,000명이 매일 방문하는 쪽이 더 좋아요. 마찬가지지만, 1명이 제 사이트를 수백만 번 들어온다면, 그것도 쓸모없긴 마찬가지에요. 그 친구한테 뭔가 문제가 있는 거죠.

3) 페이지 조회수 (Pageviews)

측정 대상: 어떤 방문자가 어떤 페이지를 하나 로딩할 때마다 페이지 조회수가 1 올라갑니다.

의미: 페이지 조회수를 트래픽의 “일반적인 안내 숫자”라고 봐도 좋습니다. 콘텐츠가 모두 통틀어서 얼마나 보여졌는지 나타내는 숫자거든요. 그외 모든 요소들은 무시하고요.

여러분의 사이트에서 배너 광고를 돌리고 있다면, 중요하게 지켜볼 숫자입니다.

여러분의 사이트가 뉴스같은 콘텐츠 기반이라, 전체 페이지 조회수가 많다는 게 더욱 더 중요하고요.

4) 방문당 페이지 조회수 (Pager-per-Visit)

측정 대상: 각 방문자가 방문할 때마다 보는 페이지 수의 평균입니다. 필요하다면 방문당 “클릭” 수로 생각해도 돼요. (기술적으로 정확하지는 않지만요.)

의미: 여러분의 사이트가 좀 더 할 일이나 소셜 인터랙션에 집중한다면, 페이지 조회수보다 방문당 페이지 조회수를 지켜보는 게 낫습니다.

반면, 구글 검색이라면 이 숫자를 되도록 낮추고 싶을 겁니다. 검색 엔진이 훌륭하다면 검색 결과 첫 페이지에 원하는 게 뜨는 게 좋으니까요.

5) 방문당 시간 (Time-per-Visit)

측정 대상: 방문할 때마다 얼마나 머무르는지 평균값입니다. 방문당 시간과 방문당 페이지 조회수를 비교해보는 게 아주 중요합니다.

의미: 완전한 세상에선, 콘텐츠 기반 사이트는 방문자들이 기사 전체를 읽고, 다른 기사도 아주 많이 읽기를 바랄 것입니다. 그렇게 된다면 방문당 시간도 길고, 방문당 페이지 조회수도 많겠죠.

방문당 페이지 조회수는 많은데, 방문당 시간은 짧다면, 사용자들이 뭔가를 찾고 있는데 못 찾은 것이거나(나쁘죠), 자기가 하려던 일을 굉장히 빨리 끝낸 거죠(좋죠.). 상황에 따라 달라요!

하지만 방문당 시간은 긴데, 방문당 페이지 조회수가 적으면, 사이트의 내비게이션이 구리거나(나쁘죠), 기사가 긴데 사용자들이 거의 끝까지 다 읽는다(좋죠)는 얘기죠. 상황에 따라 달라요!

방문당 시간도 짧고, 방문당 페이지 조회수도 적으면, 안 좋은 징후일 수 있습니다. 여러분의 사이트가 구글처럼 빨리 들어갔다가 빨리 나오는 게 목적이라면야 얘기가 다르겠지만요.

6) 반송률 (Bounce Rate)

측정 대상: 한 페이지만 본 다음 아무 것도 클릭하지 않고 나가버리는 사람

의미: 보통 이런 사람들은 여러분 사이트가 ‘싫어’라고 말한 거라고 보면 되죠. 하지만 예외가 있는데요.

블로그는 반송률이 높은 편입니다. 글 하나를 보게 디자인된 것이니까요. 최근 글 목록을 훑든 아니면 특정 글을 보러 왔든지 간에 상관없이요.

사이트 구조와 트래픽 소스가 반송률에 큰 영향을 끼칩니다. 그러니 단순해 보여도 반송률은 복잡한 숫자에요.

7) 신규 vs 복귀 방문자 (New vs Return Visitors)

측정 대상: 특정 사람(정확히는 특정 기기)이 이전에 사이트를 방문한 적이 있으면 “복귀 방문자”입니다. 아니라면 “신규 방문자”고요.

의미: 복귀 방문자는 여러분의 사이트에 대해 좀 더 많이 압니다. 그래서 반송률도 낮고 페이지도 더 많이 봅니다. 복귀 방문자라면 여러분의 작업도 좋아하는 사람일 테고, 그래서 사이트에서 체류 시간도 긴 편입니다.

하지만 “신규” 방문자도 좋습니다. 여러분의 사이트가 좀 더 많은 사람들에게 노출되고 있단 얘기니까요.

중요한 건 신규/복귀의 비율입니다. 복귀 방문자가 없다면, 사이트가 새로 만든 것이거나 엄청나게 구리다는 뜻입니다. 아무도 다시 돌아오지 않았으니까요. 복귀 사용자만 있다면, 여러분의 사용자가 충성도가 높은 것일 수도 있지만, 사이트는 죽어가는 중입니다. 새로운 사람들은 누구도 찾지 않으니까요.

대개 사이트가 성숙할 수록, 백분율로 봤을 때 복귀 방문자가 늘어납니다. 복귀 사용자의 수가 많다면, 검색이나 광고로 들어오는 신규 사용자로는 이길 수가 없거든요.

****

다음 글에서는 행동 데이터를 시각화하면 어떻게 보이는지 알아보죠. ‘데이터로 디자인하기 – 그래프 모양’ 기대해주세요.

 

#30

통계를 깊이 알지 못해도 그래프에서 흥미로운 건 볼 수 있답니다. 인간의 행동은 꽤 예측가능한 모양을 만들거든요! 그러니 오늘은 이걸 좀 배워봅시다.

데이터로 디자인하기: 그래프 모양

****

인간 행동이 꽤 자주 만들어내는 그래프 모양에는 두 가지가 있습니다. 트래픽과 구조화된 행동입니다.

****

한 마디 더: 예시에는 전부 막대 그래프를 썼어요. 더 빨리 그릴 수 있거든요. 여러분이 분석할 땐 다른 그래프를 써도 돼요.

당황하지 마세요. 기본적으로는 다 똑같은 일을 하는 거에요. 그래프 종류가 아닌 그래프 모양을 공부하는 것도 그때문이에요.

****

* 트래픽 그래프

이런 그래프들은 시간 흐름에 따라 뭔가를 한 사람들의 숫자를 보여줍니다. 일방문자수 같은 거요. 그걸 “트래픽”이라고 부릅니다.

트래픽은 항상 조금씩 오르락 내리락해요. 세상엔 매일같이 뭔가 알 수 없는 일이 벌어지니까요. 여러분의 사이트가 전혀 바뀌지 않아도 그래요.

따라서 트래픽에 약간 변화가 생겼다고 해도 절대로 그게 새로운 기능이나 디자인 변화 때문이라고 가정하지는 않아요.

자, 그럼 모양 좀 봅시다!

****

그래프를 가로 질러 걷는 게 쉬웠다면, 꾸준한 “상승”이나 “하락”은 경향이 될 가능성이 높습니다. 여러분이 사이트를 바꾸지 않는다면 말이죠.

주말에 광고라도 돌렸나요? 아니면 페이지 중 하나에 기술적인 문제를 일으킬만한 뭔가가 있나요? 아니면 여러분의 섹스 동영상이 유출되었나요? 그래프에서 “치솟는 부분” 또는 갑작스레 “뚝 떨어지는 부분”을 보게 되면 어떤 게 원인인지 알아보세요. 여러분이 자연스레 멋져졌다고 믿고 싶은 것만큼이나 치솟는 부분에는 항상 이유가 있기 마련입니다. 좋을 때도 있고, 나쁠 때도 있죠.

패턴이 어떻게 반복되는지 보이나요?

“사무직 노동자”에 인기 많은 사이트들은 평일에 트래픽이 더 많곤 합니다. 사용자들이 모두 평일에는 학교에 가는 어린이라면, 주말이 대목이겠죠. 아주 흔하고 정상입니다.

하지만…

건강한 패턴이라면 보통 느릿하게 성장하는 경향도 있어야 합니다. 패턴이 정말 뻔하게 예측가능해지고, 숫자가 조금씩 줄어들고 있다면 사용자들이 지루해서 죽어가는 거에요. 판을 좀 흔들어보세요!

****

* 구조화된 행동 그래프

다른 중요한 그래프 유형은 사람들이 무엇을 하고 있는지 보여줍니다. 사람들이 몇 일 몇 시에 그 행동을 했는지는 상관없어요. 정보 설계를 통해 이런 행동 유형에 큰 영향을 끼칠 수 있습니다.

노트: “구조화된 행동”이란 제가 이 글 때문에 만들어낸 표현입니다. 직장에서 이런 표현을 꺼내면 똑똑해보이긴 하겠지만, 무슨 말을 하는지 아무도 못 알아들을 거에요.

위의 그래프는 미끄럼틀 같은 모양인데요. 더 많은 사람들이 두번째 것보단 첫번째 것을 더 클릭하고, 세번째 것보단 두 번째 것을 더 클릭하고 그런 거죠. 메뉴처럼 시각적인 순서가 있거나 자연적인 순서가 있는 곳에서는 이런 그래프가 나타납니다.

검색 결과 목록이 보통 이렇게 보입니다. 1페이지를 열지 않고선 2페이지로 갈 수 없으니까요. 방문당 시간, 방문당 페이지 조회수를 자세히 보면 대체로 이렇게 보이기도 합니다. 사이트에서 10초 이상 머무르는 게 그렇게나 x라 어렵거든요.

이 그래프는 좀 더 흥미롭습니다. 여러분의 데이터가 이렇게 보인다면, 여러분의 사이트가 모든 조각을 제대로 갖고 있는데 몇 곳에서 순서가 잘못됐다는 뜻입니다. 즉 사용자들은 우선 순위에 대해 여러분과는 다르게 생각한다는 거죠. 첫번째 놓은 것 대신에 두번째 것을 누르곤 한다는 건데요. 아오, 정말 @$#%때문에 돌아버리겠어요.

데이터가 알려주는 것에 맞게 여러분의 디자인이나 정보 설계를 바꿔보세요. 하지만 사용자를 바꾸려 들지는 마세요. 사용자들은 그거 정말 싫어하거든요.

이 그래프는 처음의 “미끄럼틀 모양”과 비슷하지만 살짝 튀어나온 부분이 있습니다. 그래프가 임신했다고 생각하는 사람들은 멍청이고요. 이런 그래프는 충성도가 높거나, 굉장히 활동을 열심히 하거나, 사이트에서 정말 시간을 오래 보내는 사람들이 소수 있을 때 나타납니다. 평균 사용자들보다 뭔가를 훨씬 더 많이 하고, 그래서 저렇게 튀어나오는 거죠.

어떤 것이 저런 사용자들을 동기 부여시키는지 알아내서, 좀 더 많은 사람들이 저렇게 되도록 만드세요!

“미끄럼틀”이 완만하고 매끈하기를 바랄 겁니다. 미친 듯이 뚝 떨어지거나 울퉁불퉁한 부분이 있으면, 문제가 있다는 겁니다. 사이트의 홈페이지가 정말 혼란스러우면 두번째 페이지로 가는 사람이 적어 이런 그래프가 나타날 수 있습니다.

뭐가 문제인지 확실치 않다면, A/B 테스트가 문제를 찾는 데에 큰 도움이 될 수 있습니다.

****

A/B 테스트는 이번 특강의 마지막 편이기도 하죠. 다음 글에선 한 번에 어떻게 두 군데에 동시에 있을 수 있는지 배워볼게요. ‘A/B 테스트’ 기대해주세요!

 

#31

아아아… 특강의 끝이로군요. 이제 진짜 시작이에요. 지금까지 30편의 글을 다 따라왔다면 새로 써먹어볼 도구가 엄청 생겼을 테니까요. 프로페셔녈 DX 디자이너가 되기 전에 하나만 더 배워봅시다. 뭐가 실제로 “더 나은지” 알 수 있을 거에요.

데이터로 디자인하기: A/B 테스트

****

제가 그림을 하나 먼저 그려볼게요. 

신발을 파는 페이지를 하나 디자인하고 싶다고 칩시다. 당연히 되도록 신발을 많이 팔고 싶겠죠. 신발을 더 많이 사게 하려면 어떻게 해야 될까요?

신발 동영상?

“구매” 누르기 전에 배송 정보 완성시키기?

신발 브랜드의 로고?

환불 보장?

여러분이라면 어떻게 고르시겠어요?

“사용자에게 물어보자!”라는 생각부터 들었다면, 뭐 나쁘지 않습니다. 하지만 이렇게 선택지가 모두 주관적일 때는 사람들에게 물어봐도 답도 중구난방이라는 것만 확인할 수 있을 뿐입니다.

그렇다면 이런 주관적인 것들을 놓고 어떻게 결정을 내려야 할까요? 마치 사장님처럼요?!

* 대답은.

죄다 디자인해버리세요! 그리곤 선택지 전부를 동시에 출시해버리는 겁니다. A/B 테스트로 말예요.

****

* A/B 테스트가 뭘까요?

A/B 테스트란 수천, 수백 만명의 방문자에게 어떤 선택지가 더 나은지 물어보는 방법이랍니다. 비교하고 싶은 선택지 전부를 디자인해서 모두 다 출시해버려요!

이 테스트는 각각의 순 방문자는 선택지 하나만 보도록 설계합니다. 테스트 결과가 충분히 모이고 나면, 어느 버전이 클릭 수가 많은지 확인할 수 있습니다. 물론 통계적으로 “신뢰도”도 측정해야 돼요. 그래야 언제 끝낼 지 아니까요. (너무 금방 멈추지 마세요!)

두 가지 버전으로도 할 수 있고 20가지 버전으로도 할 수 있습니다. 하지만 기억하세요. 전체 트래픽 중 일부만 버전 하나를 볼 수 있습니다. 그러니 동시 테스트할 버전이 많으면 트래픽이나 시간이 더 많이 필요해져요.

****

* 몇 가지 세부사항

1) A/B 테스트는 보통 무료에요. 테스트할 디자인과 페이지를 만드는 시간을 빼면요. 크게 보자면 그 결과는 엄청나게 가치있습니다. 그래서 A/B 테스트를 하는 데에 조금 드는 비용은 그 가치가 아주 충분하다 할 수 있어요.

2) 새로 만든 페이지를 출시하고 기존 페이지보다 나은지 살펴보는 것과는 같지 않아요. 두 가지 버전을 비교하는 유일한 방법은 둘을 동시에 돌려서, 각각 (거의) 같은 수의 사람들이 사용하게 하는 거에요.

3) A/B 테스트는 세부 사항 하나만 바꿨을 때 좀 더 신뢰도가 높아요. 다른 건 모두 똑같은데, 한 페이지는 링크가 빨간색이고 다른 페이지는 링크가 파란색이라면 좋아요. 그런데 이 둘이 메뉴 구성도 다르다면, 둘의 차이가 링크 색깔 때문인지 메뉴 구성 때문인지 알 방법이 없어요.

4) 완전히 다른 두 개의 페이지, 이를 테면 홈페이지와 결제 폼 같은 걸 테스트해봐야 전혀 소용 없어요. 그건 제대로 된 A/B 테스트가 아니죠.

****

이게 다에요! 31편 글 다 보셨다면 축하드립니다! 이제 여러분은 좀 더 다방면에서 디자인을 생각할 수 있게 됐고, 이번 특강에서 배운 걸 연습하면 기술 업계에서 굉장히 높게 찾고 있는 재능을 가진 사람이 될 거에요.

(끝) 

출처

https://thehipperelement.com/post/75476711614/ux-crash-course-31-fundamentals

https://imseongkang.wordpress.com/2014/04/28/uxcrash31korean/