사용자에게 강렬한 인상을 남기거나 복잡한 개념을 간단하게 설명할 수 있는 방법을 고민해보자.
[1] 최소한의 컨텐츠를 제시하자.
인지과학 Insight 💫
무의식적으로 할 수 있는 일이 아니라면 사용자는 피로감을 느끼기 쉽다. 이렇게 집중과 정신적인 차원의 노력이 필요한 일들을 (무의식적으로 이루어지는 인지 활동과 대비해) '통제된' 인지활동이라고 한다. '통제된' 인지활동 중 하나인 암산을 예로 들어보자. 주변에 시끄러운 소음으로 간섭을 받는 와중에 암산을 해야한다면 당연히 수고롭고 피로감을 느낄 것이다.
첫 줄의 '초록 빨강 파랑'을 읽는 것보다 두번째 줄의 '파랑 빨강 초록'을 읽는데 더 오랜시간이 걸리고 잘못 말하는 경향이 생긴다. 무의식적인 인지활동을 억제하면서 통제된 인지활동에 집중해야 하기 때문이다.
(스트룹 간섭 효과, Stroop interference Effect)
이처럼, 사용자의 주의는 작은 자극에도 쉽게 분산된다. 실생활을 포함한 웹사이트 환경에서도 사용자의 주의를 해치는 다양한 방해요소가 산재해 있다. 사용자가 3번의 클릭을 할 동안 자신이 원하는 정보를 얻지 못하면 그 사이트를 떠난다는 쓰리클릭의 법칙(Three-Click Rule) 있다. 하지만 이 법칙을 믿고 모든 정보를 3 depth 이내로 표시하기 위해 너무 많은 효과를 포함 시킨다면, 효과적으로 이목을 집중시킬 수 없게 된다.
💬 최소한의 컨텐츠를 제시해서, 단순하고 간결한 인터페이스를 구성해야 한다.
💬 일부 정보들은 적극적으로 다른 페이지에 제시한다.
주변 둘러보기 👀
탈잉 웹사이트를 살펴보자. 정말 강조하고 싶은 정보는 랜딩페이지에 진입했을 때, 팝업 창이 아닌 모달창으로 제시할 수 있다. 예상하지 못한 모달창으로 사용자가 느낄 불편함을 최소화하기 위해 오늘 하루 그만보기 옵션을 제공하고 있다. 또 카카오톡 UI를 재현해서 사용자 친화적인 이미지로 내용을 저달하고 있다. 랜딩페이지도 시선이 지나치게 분산되지 않는 선에서 다양한 컨텐츠를 제공하고 있다.
리디북스 웹사이트의 경우, 화면 중앙에 캐러셀 애니메이션을 사용했는데, 캐러셀의 중앙에 표시되는 컨텐츠를 강조하되, 좌우 색상을 흐리게 표시해서 중앙의 컨텐츠에 사용자의 시선이 더 효과적으로 집중되도록 하고 있다.
한편, 우측 사진의 밀리의 서재 앱의 랜딩페이지는 이미 구독한 사용자를 대상으로 만든 페이지이다. 많은 옵션, 많은 컨텐츠를 담기 보다는 시원시원한 여백을 활용해서 서비스에서 추구하는 감성을 효과적으로 전달하고 있다. 랜딩페이지에서부터 구매전환을 유도해야하는 다른 페이지들에 비해, 조금 더 천천히 사용자에게 다가가는 느낌을 준다. 원하는 컨텐츠에만 시선을 집중시키기 상대적으로 수월하여, 의도한 사용자경험을 효과적으로 만들어내고 있다.
[2] 다양한 방식으로 전달하자.
인지과학 Insight 💫
Moreno & Mayer의 미디어를 활용한 인지 및 정서적 학습 이론(Cognitive Affective Theroy of Learning with Media)와 같은 연구는 사용자는 텍스트로만 이루어진 자료보다 텍스트와 이미지가 혼합된 정보를 더 잘 소화할 수 있다는 사실을 뒷받쳐주고 있다. 전달되는 정보의 양이 많더라도, 여러 경로를 통해 인지 처리 과정이 일어나도록 한다면 인지 과부화도 방지할 수 있다.
💬상황에 맞는 시각자료와 청각자료를 골고루 활용하자.
주변 둘러보기 👀
[3] 감정을 이끌어내자.
인지과학 Insight 💫
심리학자 슈테만 하만(Stephan Hamann)의 실험에서, 실험자들은 감정을 자극하지 않은 낱말/이미지보다 감정을 자극하는 낱말/이미지를 두 배 이상 기억해냈다. 감정은 부정적이든, 긍정적이든 기억 작용에 매우 중요하다. 단, 너무 강렬한 감정일 경우 편도는 해마를 억제해 기억이 강화되는 것을 방해한다.
💬온건한 정도의 감정을 이끌어내면 사용자는 서비스를 더 잘 기억하게 된다.
💬긍정적인 감정일 때 뇌에 저장된 정보는, 이후 긍정적인 감정일 때 떠오른다. (vice versa)
주변 둘러보기 👀
작년에 친구들과 '1일1답' 이라는 iOS 앱을 만들 때, 앱의 이미지를 잘 나타낼 수 있는 스플래시 화면을 만들기 위해 고민한 경험이 있다. 스플래시 화면(Splash Screen)은 게임이나 앱 등에서 시작되는 동안 이미지, 로고 및 소프트웨어의 현재 버전을 포함하는 창으로 화면을 말한다. 앱의 첫 화면에서 감성적인 이미지를 통해 잊고 있던 소중함을 상기시키고, 앱 서비스에 긍정적인 감정을 불러일으키기 위함이었다.
airbnb의 랜딩페이지는 와이드 일러스트레이션을 전면에 내세우고 있다. 사용자는 바쁜 도시생활을 벗어나 자연에서 평화로운 시간을 보내는 상황을 보며, 여행과 여유가 주는 긍정적인 감정을 떠올리게 된다. 이렇게 '좋아보이는' 일러스트레이션으로 사용자에게 긍정적인 인상을 암묵적으로 심어주면서 사용자로 하여금 긍정적인 감정을 갖도록 유도할 수 있다.
[4] 반복해서 제시하자.
인지과학 Insight 💫
독일의 심리학자 헤르만 에빙하우스(Hermann Ebbinghaus)에 따르면, 인간의 기억은 다음과 같은 망각 곡선을 따른다. 단, 최초 학습 후 새로운 학습과 너무 비슷한 경험을 한다면 최초학습을 잊기 쉬울 수 있다. (간섭현상)
💬기억해야할 정보는 다양한 방식으로 반복해서 제공하는 것이 좋다.
참고도서
사용자를 유혹하는 UX의 기술(최고의 경험을 만드는 33가지 디자인 원칙) - 리브 당통 르페브르 지음, 구영옥 옮김
'UX ⁄ UI' 카테고리의 다른 글
| [UX 발견하기] 매력적인 스토리로 눈길 끌기 (0) | 2021.05.24 |
|---|---|
| [UX 발견하기] 최고의 경험 제공하기 (0) | 2021.05.19 |
| [UX 발견하기] 파악하기 쉬운 디자인 (1) | 2021.04.27 |
| [UX 발견하기] 가독성 높은 텍스트 (2) | 2021.04.18 |
| [UX 발견하기] 화면 구성의 원칙 (0) | 2021.04.10 |
