화면이 복잡할 때 꺼내 읽기 좋은 UX 이야기
복잡함과 혼란스러움 구별하기
단순함은 좋은 가치다. 본질을 쉽게 파악할 수 있기 때문이다. 하지만 단순함 자체가 언제나 목표일 필요는 없다. 피아노 건반은 88개나 있지만 건반의 수를 줄여야 한다고 주장하는 사람은 드물다. 모든 건반을 다 활용해 연주를 하는 사람이 거의 없다 하더라도 말이다. 비행기 조종실의 복잡성 역시 이유가 있다. 조종사들은 뚜렷한 정보 체계와 명확한 구조를 통해 복잡함을 이해한다. 심리학에서 종종 거론되는 *테슬러의 법칙(Tesler's Law)은 이와 관련해 다음과 같이 말한다.
조종사들은 뚜렷한 정보 체계와 명확한 구조를 통해 복잡함을 다스린다.'모든 시스템에는 더 이상 줄일 수 없는 일정 수준의 복잡함이 존재한다.' 이를 내재된 복잡성이라고도 말한다. 우리가 매일 사용하는 카카오톡을 떠올려보자. 우선 메시지를 보내는 사람과 받는 사람이 존재하며, 메시지를 입력할 수 있는 키보드가 필요하다. 이메일 역시 수신자나, 제목 등을 제거한다면 큰 불편함이 따를 것이다. 테슬러의 이론을 곰곰이 들여다보면 복잡함은 완벽히 제거할 수 없는 세상의 일부처럼 보인다. 어떤 사람의 지저분한 책상에는 그 사람이 부여한 임의의 질서가 존재하는 것처럼 말이다. '디자인과 인간 심리'의 저자 도널드 노먼은 복잡함 자체는 좋은 것도 나쁜 것도 아니며 우리가 제거해야 할 대상은 바로 혼란스러움이라고 말한다. 노먼의 말에 따르면 UX 디자이너는 맹목적으로 덜 복잡함을 쫓기보다, 혼란스러움을 다스리는 사람에 가깝다. 즉, 사용자 경험을 디자인할 때 단순성 자체가 목표가 되어서는 안 된다는 것이다. 서비스에 남길 수 있는 최소한의 기능이 뭘까를 고려한 뒤 혼란스러움을 야기하는 요소를 하나 둘 제거해 나간다면 자연스럽게 단순함이라는 가치를 만날 수 있을 것이다.
*테슬러의 법칙(Tesler's Law) 복잡성 보존의 법칙이라고도 부른다. 1980년대 중반 제록스 파크에서 컴퓨터 과학자로 재직 중이었던 레리 태슬러가 인터랙션 디자인 언어를 개발할 때 발견했다.
복잡함을 다스릴 수 있는 수단, 질서
대표적인 예로 계산기가 있다. 아마 태어나 처음 계산기를 본 사람이 있다면 많은 양의 버튼 때문에 복잡하다고 느낄 것이다. 하지만 대부분의 성인들은 보편적인 계산기를 복잡하다고 느끼지는 않는다. 왜일까? 답은 바로 질서에 있다.
복잡하지만 질서가 느껴지는 계산기계산기를 들여다보면 가장 우측 세로 한 줄은 계산에 필요한 등식들이 배치되어 있다. 중간의 가장 많은 면은 숫자가 차지한다. 이러한 규칙성은 우리가 꽤 오래전부터 받아들여온 것이다. 만약 계산기에 이러한 규칙성이 느껴지지 않는다면 어떻게 될까. 아마 큰 혼란에 빠질 것이다. 즉, 사람들은 버튼이 많아도 스스로에게 익숙한 질서라고 받아들인다면 그리 어렵게 느끼지 않는 것이다. 더불어 많은 심리학자들이 주장하길 인간은 완벽히 단순한 것보다 약간의 복잡성을 바라는 경향이 있다고 말한다. 예를 들어 야구는 얼핏 보기에 단순해 보이지만 규칙을 모아놓은 책의 분량이 약 200쪽에 달한다. 야구를 사랑하는 사람들은 표면의 단순함 밑 수많은 규칙들이 부딪히며 만들어내는 관계의 미묘성을 즐기는 걸지도 모르겠다.
사회적 기표란?
세상에는 내가 태어나기 전부터 존재한 수많은 사회적 약속이 존재한다. 대표적으로는 문자 기호가 있다. 우리는 문자를 통해 타인과 심오한 커뮤니케이션을 할 수 있다. 신호등의 빨간불은 사람을 멈추게 하고 녹색불은 움직이게 한다. 놀이공원의 긴 줄은 꽤 오랜 시간을 기다리겠구나라는 암시를 준다. 시계는 12개의 큰 단위와 60개의 작은 단위로 나뉜다. 학자들은 시계에 맞춰 먹고 자는 것이 인간의 욕구 체계와 완벽히 일치하지는 않는다고 밝힌다. 떠올려보면 이러한 사회적 약속들은 지금은 쉽지만 어릴 때의 체득 과정이 그리 녹녹지 않았다는 사실을 알 수 있다. 개인도 그런데 한 사회에서 새로운 시스템을 받아들이는 과정은 또 얼마나 어려운 일일까.
도널드 노먼은 '복잡한 세상의 디자인'에서 세상이 보내오는 신호들을 '사회적 기표'라고 이름 붙인다. 기표는 쉽게 말해 의미를 전달해 주고 다음 할 일을 알려주는 지시자라고 할 수 있다. 문화적인 차이에 따라 같은 기표라도 다르게 해석되기도 한다. 예를 들어 한국과 일본에서 손가락 링 사인은 돈을 나타낸다. 미국에서는 OK로 해석되며 브라질에서는 외설적인 뜻으로 간주한다.
다행히 낯선 곳에서도 사회적 기표를 쉽게 체득할 수 있는 방법이 있다. 바로 다른 사람의 행동을 유심히 관찰하는 것이다. 예를 들어 처음 프랑스 여행을 가서 레스토랑에 방문했다면 우선 주변 사람들이 먹는 모습을 서서히 관찰해 보며 적응하는 것이다. 우리는 해당 과정을 통해 요리가 나오는 시점에 냅킨을 펴는 것과 샐러드나 빵은 나이프로 잘라먹지 않는 프랑스식 식사예절을 터득할 수 있다.
특정 행동을 유도하는 어포던스 (출처: medium.com/@thoughtbottler)UX 용어로 어포던스(Affordance)라고 부르는 개념이 있다. 쉽게 말해 어떤 행동을 유도하게끔 하는 요소로 '행동 유도성'이라고도 부른다. 손잡이는 문을 열게끔 유도하는 대표적인 어포던스다. 회원가입의 인풋 창은 정보를 입력하게 하며, 에디팅 화면의 버튼은 여태껏 썼던 글을 안전하게 저장하게끔 유도한다. UX 디자이너는 사회적 기표(질서)를 고려해 적당한 시점에 정확한 강도의 어포던스를 배치할 의무가 있다. 만약 혼란스러움이 느껴지는 사용자 경험이 있다면 어포던스의 강도가 맥락에 맞게 배치되었는지부터 확인하면 좋다.
익숙한 경험을 활용해 UX 설계하기
사회적 기표는 우리에게 다양한 정보를 제공해 준다. 지하철 승강장이 북적북적하다면 출근시간이라고 유추할 수 있다. 반면 승강장이 한가하면 지하철이 막 출발한 뒤라고 생각할 수도 있다. 헌책방에서 어떤 책의 특정 귀퉁이가 닳아있다면 책의 전주인이 선호했던 페이지라고 생각할 수 있다. 옆 집 문 앞에 택배 박스가 많이 쌓여있다면 휴가를 갔다고 유추해 볼 수 있다.
이처럼 세상은 우리에게 사회적 기표를 지속적으로 보내온다. 사용자 경험을 만드는 사람들은 이러한 사회적 기표 즉, 세상의 작동방식에 집중할 필요가 있다. 앞서 말한 혼란스러움은 실제 세계에서의 규칙들을 통해 많은 부분 해결할 수 있기 때문이다. UX에서의 혼란은 실제 세계의 규칙과 어포던스 사이의 불일치에서 주로 발생한다. 예를 들어 오프라인에서 활자를 읽는 진행 방향은 왼쪽에서 오른쪽인데 만약 온라인에서의 글 읽기가 반대라면 큰 불편함이 발생할 것이다. 도널드 노먼은 사회적 기표와 사용자 경험을 맵핑하는 과정을 개념적 모델(Conceptual model)이라고 명명한다. 즉, 실제 세계의 복잡 미묘한 질서는 디지털에서 새로운 경험을 만들 때 활용할 수 있는 훌륭한 소재가 될 수 있다. 지금부터는 이러한 개념적 모델을 활용해 실제로 디자인된 예시들을 살펴보자.
가장 대중적인 앱들에서 출발하기
본격적인 예시를 살펴보기 전 현재 가장 대중적인 앱들에서 생각을 시작해 보는 것도 좋다. 카카오톡의 채팅창, 쿠팡의 상품 리스트, 구글맵의 지도 검색, 토스의 송금 화면같이 대중성을 이미 획득한 앱들의 사용자 경험 자체가 개념적 모델이기 때문이다. 현재 새로운 프로덕트를 기획하고 있다면 진입할 카테고리 선두주자들의 사용자 경험을 면밀히 살펴볼 필요가 있다. 이런 서비스에 익숙한 사용자라면 새로운 앱 설치 전 자신에게 익숙한 사용자 경험을 예상할 가능성이 높기 때문이다. UX는 사용자의 예측 가능성과 실현된 것 사이의 적절한 간극 조절이라고도 할 수 있다. 지금부터는 개념적 모델을 프로덕트나 서비스에 실제 적용한 사례를 살펴보자.
지도와 구글맵
구글맵은 2005년 처음 탄생했다. 당시만 해도 온라인 지도가 어떤 모양으로 디자인돼야 할지 예상하지 못했다. 더불어 우리 일상에 어떤 영향을 미칠지도 가늠하기 어려웠다. 아래 그림은 구글맵의 초기 모습이다. 페이지가 넘어가지 않는 종이 지도의 모습을 그대로 재현하고 있다. 참고로 최초의 온라인 지도는 구글맵이 아니라 1994년 캐나다에서 탄생한 국립 지도라고 한다.
초기 구글맵의 모습 (출처: vox.com)카드놀이와 틴더 UX
세계적인 데이팅 앱 틴더를 오늘날의 위상으로 만든 건 다름 아닌 사용자 경험이다. 틴더의 핵심 사용자 경험은 매우 단순하다. 이성이 마음에 들면 오른쪽, 마음에 들지 않으면 왼쪽으로 넘긴다. 이 모습이 마치 카드게임을 할 때 넘기는 모습과 비슷하다고 해서 Card Swipe UI라고도 부른다. 실제로 포커나 솔리테어 같은 전통적인 카드게임에서 나온 개념이나 경험들은 독창적인 UX를 만드는데 단골 소재로 활용된다.
카드 게임이 연상되는 틴더의 UI (출처: markolazic.com)머릿속에 비교상 만들어주기
사람들은 비교를 통해 대상의 실체를 종종 확인한다. 혼자 있을 때 보다 비교할 수 있는 대상이 옆에 있을 때 가치를 더 명확히 느낄 수 있기 때문이다. 디자인에서 비교 기법이 널리 쓰이는 이유이기도 하다. 아래는 대표적으로 이러한 개념이 커머스에 활용된 예시다.
마켓컬리 상세 페이지에 활용된 비교 기법온라인에서 물건 구매 시 고민되는 부분 중 하나는 크기일 것이다. 수치로 크기가 설명되어 있기는 하지만 사실 잘 와닿지 않는 경우가 많다. 마켓컬리는 이러한 문제를 일상에서 자주 접하는 소품을 옆에 둠으로써 상품의 실제 크기를 짐작할 수 있게 했다.
이러한 비교 기법은 꼭 이미지로만 디자인될 필요는 없다. 아래는 온라인에서 수집한 두 가지 버튼이다. 노란색 버튼은 한 B2B 서비스에서 발견한 것이고 아래는 결혼 정보 회사에서 발견했다. 버튼 아래에는 해당 서비스를 이미 경험한 사람들을 숫자로 표시해 놓았다. 이를 통해 해당 서비스에 대한 정보가 없는 사용자라도 검증된 서비스라는 심리가 발동해 신뢰감을 확보할 수 있는 효과가 있다. 이를 사회적 증명(Social Proof) 심리라고도 한다.
사회적 증명 심리로 CTA 버튼 디자인하기감정 스티커와 무다
오프라인의 오브제들을 온라인으로 옮기는 것도 개념적 모델을 UX에 활용하는 방법 중 하나다. 무다는 매일 쓰는 일기에 감정이라는 요소를 시각화해 온라인으로 기록할 수 있도록 돕는 앱이다. 이러한 개념은 다이어리에 직접 붙일 수 있는 스티커에서 보아온 익숙한 개념이다.
좌측 감정 기록 다이어리 앱 '무다', 우측 '스트레스 컴퍼니'슬롯머신과 인스타그램의 당겨서 새로고침
당겨서 새로고침은 인스타그램이나 페이스북, 심지어 메일링 서비스에서도 활용되는 대중적인 인터페이스다. 주로 현재 보고 있는 피드를 완전히 새롭게 고치고 싶을 때 활용한다. 하지만 구글의 전 디자인 윤리학자 '트리스탄 해리스'는 당겨서 새로고침을 사용하는 사람들이 슬롯머신에서 느끼는 중독성을 거의 동일하게 느낀다고 밝힌다. 한 통계에 따르면 슬롯머신이 한 해 거두는 수익은 미국 내 영화, 야구, 테마 파크의 모든 수익을 합친 것보다 월등히 높다고 한다.
슬롯머신과 동일한 메커니즘을 가진 당겨서 새로고침 UI피드를 아래로 당기는 간단한 행동이 새로운 피드라는 가변적 보상 심리로 연결되는 것이다. 가변적 보상 심리의 대표적 예로는 스키너의 상자 실험이 있다. 프레드릭 스키너라는 심리학자가 고안한 것으로 상자에 장치를 해 쥐가 레버를 누르면 정기적으로 먹이가 나오는 패턴과 레버를 누르면 비정기적으로 먹이가 나오는 패턴을 관찰했다. 그랬더니 쥐는 즉시 먹이가 나오는 것보다 보상이 비정기적일 때 오히려 레버를 당기는 행위를 멈추기 어렵다는 사실을 발견했다. 즉, 동일하고 간단한 행동을 반복할 때 주어지는 보상이 랜덤 할수록 사람은 더 중독적으로 변하기 쉽다는 것이다. 사용자 경험을 설계하는 디자이너라면 이러한 사람의 심리를 잘 이해해 악의적으로 UX를 설계하지 않도록 주의해야 한다.
지금까지 복잡함과 혼란스러움의 구별에서 출발해 개념적 모델을 활용한 사용자 경험의 예시까지 살펴보았다. UX에서의 창의성이란 아예 없던 개념을 창조하는 것과는 거리가 멀다. 오히려 세상의 질서와 작동원리에 관심을 기울이고 그것을 활용해 사용자 머릿속에 명확한 구조를 만들어줄 때 발생한다. 내일은 세상에 조금 더 관심을 기울여보는 건 어떨까?
'익숙한 경험으로 더 나은 UX를 만들 수 있을까?' 끝
