brunch

라이킷 22 댓글 2

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 우잉 Jun 19. 2023

Chapter.1 사용성, 누구냐 너!

프로덕트 디자이너가 요약한 <사용자를 생각하게 하지마!> 첫 번째 장

[머리말] 책 요약에 들어가며...

시선을 사로잡는 강렬한 제목을 가진 <사용자를 생각하게 하지마!> 책은 IT 분야에서 20년 이상 스테디셀러를 유지하고 있는 고전으로 IT 분야의 필독서입니다. 책의 저자인 스티브 크룩은 사용성을 폭넓게 알린 인물로 10년 이상 컨설턴트로 일하며 체득한 인사이트를 이 책에 담아냈습니다. 사용성에 대한 상식과 사용자에 대한 이해를 주로 말하고 있어 사용성에 관한 그의 통찰과 애정을 여실히 느낄 수 있죠.

책은 2000년에 출판된 이후 2013년에 마지막으로 개정되었습니다. 모바일 UX에 대한 개념이 풍부해진 오늘날에 비해 책은 웹 기반의 내용이 많고 어쩌면 당연하게 느껴질 만한 이야기를 하고 있습니다. 그럼에도 불구하고 20년간 스테디셀러 자리를 유지하고 있는 이유는 당연한 이야기의 원리를 담고 있기 때문일 것입니다. IT 분야는 답습되는 것들이 많기 때문에 설계를 설득하기 위해선 원리와 본질을 파악하고 있는 것이 매우 중요합니다. 만약 사용성에 관한 질문에 답하기 어려웠거나 추상적으로만 알고 있었다면 제가 요약한 아티클 시리즈가 큰 도움이 될 것 같습니다.

책은 총 13 챕터로 구성되어 있습니다. 저는 13 챕터를 3 챕터로 핵심만 간추려 요약했습니다. 이에 대한 기준은 웹과 앱을 모두 아우를 수 있는 내용으로 삼았습니다. 각 챕터는 읽는데 약 10분이 소요됩니다.

▶︎ Chapter.1 <사용성, 누구냐 너!> : https://brunch.co.kr/@shc9500/20

▷ Chapter.2 <여긴 어디? 나는 누구?> : https://brunch.co.kr/@shc9500/21

▷ Chapter.3 <사용성 테스트, 어서 오고> : https://brunch.co.kr/@shc9500/22

아티클을 읽고 책 한 권을 읽은 것과 같은 효과를 낼 수 있도록 재구성에 많은 신경을 썼습니다. 사용성에 대한 유의미한 지식을 얻어 가는 기회가 되셨으면 좋겠습니다. 그럼 즐겨주세요. :)

- 목차 -

1. 좋은 서비스를 만들기 위해 가장 중요한 것

2. 사용성을 고려해야 하는 '진짜' 이유

3. 사용자에 대한 진실

4. 좋은 사용자 경험을 만드는 방법

5. 사용성 다음으로 고려해야 할 것

1. 좋은 서비스를 만들기 위해 가장 중요한 것

편리하고 사용하기 좋은 웹 사이트나 앱 서비스를 만들기 위해 가장 중요한 것은 무엇일까요? 답은 사용자를 고민에 빠뜨리지 않는 것입니다. 그렇다면 사용자를 고민에 빠뜨리지 않기 위해서는 어떻게 하는 게 좋을까요? 답은 모든 화면이 최대한 자명하게 제작되면 됩니다. 여기서 자명하다는 것은 설명 없이도 사용 방법을 보자마자 알 수 있게 만든다는 의미로 사용 방법이 무엇인지 고민할 필요가 없도록 설계하는 것을 뜻합니다. 우리가 말하는 사용성을 갖춘다는 것은 이러한 의미를 말합니다.

이를 조금 더 쉽게 설명하기 위해 여러분이 취준생이라는 가정으로 두 가지 상황을 예로 들어 설명해 보겠습니다. 먼저 첫 번째로 여러분이 특정 회사에 취업하기를 간절히 원한다고 해봅시다. 공채가 시작됐다는 소식을 들은 여러분은 해당 회사의 웹사이트에 들어가 '채용' 탭을 찾는 과정을 거치게 될 것입니다. 이때 아래 세 가지 버튼 중 하나가 제시된다고 해봅시다.

위 세 가지 버튼 중 어떤 버튼이 여러분이 원하는 결과가 노출될 것 같은가요?

두 번째로 여러분이 채용 과정을 잘 거쳐 면접까지 치렀다고 해봅시다. 합격 발표날이 다가왔고 결과를 확인하라는 문자 메시지를 받은 여러분은 '결과보기' 버튼을 누르려고 합니다. 이때 아래 세 가지 버튼 중 하나가 제시된다고 해봅시다.

위 세 가지 버튼 중 어떤 버튼이 가장 먼저 눈에 들어오셨나요?

대부분의 여러분은 '채용' 버튼과 '1번 결과보기' 버튼을 선택하셨을 겁니다. 앞서 이야기한 최대한 자명하게 만든다는 것은 이와 같습니다. (1) 직관적이며 (2) 헷갈리지 않고 (3) 다음 결과를 예상할 수 있어야 합니다. 혹시 '취업 기회', '직업전시관' 단어를 읽었을 때 뜻을 해석하느라 잠깐 멈칫하지 않으셨나요? 혹은 '2번 결과보기', '3번 결과보기' 버튼이 눈에 띄지 않아 찾는 데 오래 걸리지 않으셨나요? 모든 멈칫의 순간, 고민의 순간은 컴퓨터와 상호 작용하는 인간에게 인지적 부하를 더하는 원인이 됩니다. 이러한 사소하고 작은 주의 분산 요소들은 서비스를 사용하는 사용자에게 무의식적으로 경험의 잡음을 만들어냅니다. 이러한 좋지 않은 경험은 회사 브랜드 신뢰도에 영향을 끼치며 서비스 이탈 요인으로 작용합니다. 따라서 멈칫의 순간, 고민의 순간을 없애는 것은 좋은 사용성을 갖춘 서비스를 만드는데 가장 중요한 첫 번째 핵심 요소라 할 수 있습니다.

2. 사용성을 고려해야 하는 '진짜' 이유

그런데 버튼 한 개, 클릭 한 번에 서비스의 생사가 결정 날까요? 고민의 순간, 멈칫의 순간을 느낀 사용자는 짜증을 내며 곧장 다른 서비스로 옮겨갈까요? 80억 인구(적어도 대한민국 5000만 인구)의 모든 사용자가 매번 변독스러운 것은 아닙니다. 불편함에 익숙해질 대로 익숙해진 사용자는 사용성이 좋지 않은 서비스에서 생각보다 잘 이탈하지 않습니다. 또는 대체 서비스를 찾거나 새롭게 서비스에 가입하는 것을 귀찮아할 수도 있고 공공기관, 사내 인트라넷 같이 대체할 서비스가 없는 경우도 있습니다.

그렇다면 어째서 사용성을 고려해야 할까요? 사용자들이 인내심을 갖고 서비스를 사용한다면 특별히 사용성을 고려하지 않아도 괜찮은 것 아닐까요? 그럼에도 불구하고 사용성을 고려해야 하는 궁극적인 이유는 다수의 사람들이 화면을 읽지 않고 훑어보기 때문입니다. 실제로 사용자는 기획자, 디자이너, 개발자의 피 땀 눈물이 들어간 하나의 페이지를 보는데 매우 적은 양의 시간을 소비합니다. 그러므로 우리가 원하는 정보를 효과적으로 전달하기 위해선 사용자를 고민에 빠뜨려서는 안 됩니다.

3. 사용자에 대한 진실

보통 디자이너는 화면을 설계할 때 사용자가 영역 구석구석을 세심하게 살펴본다고 생각합니다. 그러나 사용자는 마치 '시속 95km로 달리는 차 안에서 보는 광고판'에 가깝게 화면 속 정보를 읽습니다. 이러한 과정에서 본인이 찾는 내용과 비슷한 단어나 흥미를 끄는 문장을 취사선택해 소비하는 거죠. 물론 사용자가 하려는 작업의 종류, 급박함의 정도, 제공된 정보의 종류에 따라 결과는 달라질 수 있습니다. 그러나 한 가지 명확한 사실은 사용자는 우리의 기대와 다르게 질서 정연하고 합리적인 방식으로 서비스를 이용하지 않는다는 것입니다. 이 같은 사실을 조금 더 구체적으로 정리하면 다음과 같습니다.

1) 사용자는 화면 속 정보를 훑으며 매우 적은 시간을 할애한다

사용자는 왜 정보를 읽지 않고 훑을까요? 이는 사용자가 웹과 앱 서비스를 목표 달성을 위한 하나의 수단이자 도구로 여기기 때문입니다. 인간은 자신의 목적에 부합하는 요소 외의 것은 필요 없는 것으로 치부하는 경향이 있습니다. 이러한 행태는 야생 동물의 사냥 본능과 비슷합니다. 즉, '정보의 냄새(scent of information)'가 강한 선택지를 선택하면 '먹잇감(what you want)'을 발견할 확률이 높아진다는 것을 무의식적으로 아는 거죠.

2) 사용자는 모든 선택지를 고민하는 게 아닌 합리적이라 판단한 첫 번째 안을 선택한다

사용자는 왜 최적의 선택지를 찾지 않는 걸까요? 이는 선택이 틀렸을 때 발생하는 불이익이 없기 때문입니다. 웹과 앱 서비스는 잘못된 선택을 하더라도 뒤로 가기 버튼을 누르면 이전 상황으로 쉽게 돌아올 수 있습니다. 또한 최적의 선택을 하는 일은 시간이 오래 걸리는 일이기 때문에 특정 목표를 달성하는데 비효율적인 방식입니다. 반대로 추측한 선택이 만족스러운 결과를 가져왔다면 이는 작업 시간이 단축되었을 뿐만 아니라 운이라는 요소가 개입했기 때문에 사용자는 '재미'라는 감정을 느끼게 됩니다.

3) 사용자는 서비스 작동 방식을 모르거나 완전히 반대로 이해해도 일정 수준 이상으로 사용할 수 있다

사용자는 왜 작동 원리를 이해하려 하지 않을까요? 이는 목표를 달성하는데 지장만 없다면 작동 방식을 이해하지 못해도 아무런 문제가 없기 때문입니다. 이러한 현상의 원인은 지적인 능력이 부족해서가 아닌 관심이 없어서 발생합니다. 더 좋은 방법을 우연히 발견하는 게 아닌 이상 본래 목적을 달성했다면 굳이 더 좋은 방법을 찾지 않는 것이죠.

4. 좋은 사용자 경험을 만드는 방법

앞서 우리는 사람들이 화면을 읽지 않고 훑어보기 때문에 사용성이 필요함을 배웠습니다. 그렇다면 실제 설계에 있어서 좋은 사용자 경험을 만들려면 어떻게 디자인해야 할까요? 이에 대해 구체적으로 알아보도록 하겠습니다.

1) 표준화된 디자인 패턴을 사용한다

디자인 관례(디자인 패턴)는 다양한 도메인에서 여러 종류의 문제를 맞닥뜨리며 진화해 온 결과물입니다. 통용된 디자인은 사용자의 서비스 이해도를 높입니다. 창의적이고 혁신적인 방법, 심미적인 디자인은 환영받아야 마땅하지만 관례에 비해 더 좋은 경험을 주지 못한다면 지양하는 게 좋습니다.

2) 시각적 계층구조를 효과적으로 구성한다

노출된 페이지에서 가장 중요한 정보를 선별하고 영역 간 관계를 이해할 수 있도록 시각적 단서를 제공합니다. 사용자는 무의식적으로 시각적 계층 구조를 분석합니다. 특히 모바일 기기는 화면이 작기 때문에 제약 사항이 더 큽니다. 때문에 디자이너는 콘텐츠를 한눈에 파악하기 쉽도록 우선순위를 세심히 고려해 사용자의 인지 비용을 줄일 수 있어야 합니다.

3) 내용을 훑어보기 좋은 방식으로 구성한다

사용자는 내용을 훑는 방식으로 서비스를 사용합니다. 따라서 콘텐츠를 훑어보기 좋게 구성한다면 사용자는 원하는 내용을 보다 쉽고 빠르게 찾을 수 있습니다. 내용을 훑어보기 좋은 방식으로 구성하는 방법은 다음과 같습니다.

(1) 제목 만들기

: 사려 깊게 잘 지은 제목은 내용의 개요 역할을 하며 사용자의 호기심을 자극할 수 있습니다.

(2) 단락 짧게 유지하기

: 사용자는 짧은 단락을 여러 개 훑는 것보다 긴 단락 한 개를 훑는 것을 훨씬 어려워합니다. 따라서 긴 내용은 최대한 짧게 나눠서 제공하도록 합니다.

(3) 주요 용어 강조하기

: 사용자의 시선이 머무르는 곳은 중요한 단어나 문구입니다. 따라서 중요한 단어는 굵기를 달리 표현하거나 언더라인을 사용하도록 합니다.(너무 자주 사용하면 효과가 떨어지니 잦은 사용은 지양합니다)

(4) 불릿 사용하기

: 불릿('•')으로 만들 수 있는 항목은 불릿 목록을 만들어 제공합니다.

4) 클릭 or 탭 할 수 있는 요소를 명확히 표현한다

클릭 or 탭 할 수 있는 요소를 찾는 행위는 서비스 활동의 가장 큰 부분을 차지합니다. 특히나 앱 서비스는 커서와 호버 기능이 없기 때문에 탭할 수 있는 요소를 다른 요소와 쉽게 구분이 되도록 매우 직관적으로 디자인해야 합니다.(이는 어포던스(Affordance)라 불리며 행동을 유도한다는 뜻으로 '행동유도성'이라 합니다)

5) 주의를 흩뜨릴 만한 요소를 제거한다

사용자의 주의력에는 명백한 한계가 존재합니다. 특히나 시각적 잡음은 내용 이해를 방해하는 주요 요인 중 하나입니다. 따라서 정보를 시각적으로 구성하는 것에 주의를 기울일 필요가 있습니다. 이에 대한 방법은 다음과 같습니다.

(1) 중요한 내용'만' 강조합니다.

: 한 화면에 지나치게 많은 내용과 디자인 요소를 노출하지 않도록 합니다. 사용자에게 전달하고 싶은 핵심 메시지를 찾고 이들을 안내할 수 있는 가장 중요한 요소가 무엇인지 고려합니다.

(2) 정갈한 레이아웃을 갖춥니다.

: 도둑이 다녀간 것처럼 무질서한 정보 배열은 사용자를 혼란스럽게 만듭니다. 규칙성을 갖고 영역을 구성해 사용자에게 시각적 계층 구조의 단서를 제공합니다.

5. 사용성 다음으로 고려해야 할 것

사용성을 갖춘 서비스는 사용자 스스로 똑똑함을 느끼게 합니다. 막힘없이 본인이 원하는 것을 찾고 복잡해 보이는 기능을 척척 사용할 수 있기 때문이죠. 사용자는 본인이 똑똑하게 느껴지는 서비스에 재방문할 확률이 높고, 반대로 본인이 멍청하게 느껴지는 서비스는 다시 찾지 않을 가능성이 높습니다. 따라서 사용자가 매우 짧은 시간 동안 정보를 훑더라도 원하는 내용을 쉽고 빠르게 찾을 수 있도록 화면이 설계돼야 합니다. 이를 위해 디자이너는 서비스의 일관된 맥락을 이해할 수 있도록 정보의 시각 위계를 갖추고 텍스트와 디자인 요소 간의 관계를 세심히 고려해야 합니다.

그렇다면 사용성 다음으로 중요한 것은 무엇일까요? 사용성 다음으로 중요한 것은 목적지로의 이동입니다. 앞서 언급했듯 사용자는 서비스를 특정 목표를 달성하기 위해 사용합니다. 따라서 서비스는 사용자가 목적지에 잘 도달할 수 있도록 안내를 잘할 의무가 있습니다. 그렇다면 웹과 앱 서비스에서 목적지로의 효과적인 이동을 위해 구체적으로 무엇이 필요할까요? 다음 챕터에서는 서비스에서 이동을 위해 무엇이 필요한지 살펴보도록 하겠습니다.