UI & UX, UX & Design

‘본다’라는 행동에 대한 잡담 ①

사용자는 우리가 만든 서비스를 사용합니다. 사용하기 위해선 관련 정보를 얻어야 하고 그 정보 대부분은 시각을 통해 얻게 되죠. 사용자는 우리의 디자인을 봅니다. 우리가 색상, 문자, 위치나 형태를 잘못 사용하면 사용자도 잘못 이해하게 됩니다. ‘어떤 부분이 먼저 눈에 들어올까?’, ‘시선의 흐름은 어떻게 진행될까?’,  ‘우리도 눈이 달렸으니 우리가 보는 것과 비슷하겠지’라는 생각도 할 수 있겠죠. 물론, 이건 부분적으로 잘못된 생각이에요. ‘디자인 잡담’에서는 책을 보고 얻은 유용한 정보를 공유하고자 합니다.

본다는 것은 무엇일까?

우리의 행동은 의식과 무의식으로 구분합니다. 그 기준은 제어가 가능한지에 달려있다고 말합니다. 예를 들어 우리는 땀이 흐르는 것을 의지만으로 멈출 수 없습니다. 심장 박동이 빨라져도 늦출 수 없습니다. 이런 부분은 의식이 아닌 영역이죠. 그런데 의식과 무의식 모두에 양다리를 걸친 부분도 있습니다. 호흡이 그렇습니다. 우리는 의식하지 않아도 숨을 쉬지만, 의식적으로 멈출 수 있죠. 공기를 더 많이 흡입할 수도 있고 짧고 빠르게 숨을 쉴 수 있습니다.

그렇다면 시각은 어떨까요? 눈의 홍채는 빛의 양에 따라 스스로 조절을 합니다. 우리는 의지로 눈에 들어오는 광량을 컨트롤할 수 없습니다. 그러나 눈꺼풀을 이용해 빛을 차단할 수는 있죠. 그런데 빛을 차단했다고 해서 ‘본다’라는 행동이 멈춰진 것은 아닙니다. 빛이 차단된 눈꺼풀의 안쪽을 보고 있는 상태거든요. 해석에 따라 조금 달라질 수도 있는데, 정보(명암, 색이 가진 파장)를 차단할 수는 있지만 시신경 자체를 차단할 수는 없습니다. 이렇게 생각하면 무의식이라고 생각해도 되지 않을까요?

눈으로 보는 것이 아니라 뇌로 본다

그런데 이 과정은 빛이 눈을 통과해 시신경으로 뇌에 전달되는 과정일 뿐입니다. 뇌에서 정보를 해석하는 과정이 빠진 거죠. 사실 이 부분이 ‘본다’는 행위의 핵심입니다. 시신경은 단지 세상으로부터 얼마나 많은 빛이 들어왔는지, 그 파장은 어느 정도 길이인지에 대한 정보만 줄 뿐입니다. 본다는 것을 이해하려면 눈이라는 기관을 통해서는 기본적인 메커니즘 빼고 그다지 얻을 수 있는 것이 없습니다. 적어도 제가 궁금하게 여기는 부분에서는요. 눈이 정보를 어떻게 받아들이는지보다 어떻게 보이고 해석되느냐가 더 중요하다고 생각합니다. 그래서 우리가 더 알아봐야 할 부분은 바로 ‘뇌의 해석과 활동’입니다.

중심시와 주변시

그래도 눈에 대해 조금만 얘기하고 넘어가죠. 중심시와 주변시입니다. 왼쪽은 중심시 영역을, 오른쪽은 주변시 영역을 임의로 표시한 이미지입니다

중심시와 주변시

중심시

중심시의 영역은 우리가 생각하는 범위보다 매우 좁아질 수 있습니다. 위의 사진에서 사람 한 명까지 좁아질 수 있습니다. 어쩌면 그 사람이 들고 있는 가방, 우산까지도 좁아집니다. 이건 어떤 부분에 주의를 기울였느냐에 따라 변합니다. 그리고 이 주의는 의식적일 때도 있지만 무의식적일 때도 있습니다.

우리가 주의할 점은 메이커(기획자, 디자이너, 개발자 등)로서 보는 시각은 의식적인 경우가 많고 사용자는 무의식적으로 보는데 그 간극 때문에 오류를 범하게 된다는 것입니다. 그리고 의식이 만들어낸 논리들이 그럴듯하게 느껴져서 의견으로 받아들여질 때가 많죠.

의식적 시각과 무의식적 시각의 차이를 느꼈던 경험이 있었습니다. 면접을 위해 전자상거래 웹사이트를 분석할 때였죠. 타이포그래피나 색상 및 레이아웃 같은 디자인 요소를 중심으로 보고 있는 과정에서 관심 있는 상품을 발견한 순간 관점이 바뀌어 버렸고 저는 그 사실을 전혀 느끼지 못했습니다. 결제를 하고 기억을 되짚어 보고 나서야 디자인 요소는 제쳐두고 상품의 정보만을 찾고 있었던 저를 발견했던 것입니다. 의식적인 시각에서 무의식적인 시각으로 전환된 순간이었습니다.

그 순간은 디자인이 ‘예쁜가 예쁘지 않은가’가 중요하지 않았습니다. 제가 찾는 정보가 얼마나 눈에 띄었는지가 중요했죠. 그리고 그걸 찾기 어려웠을 때 스트레스가 발생했습니다. 아마 기억을 되짚어 보지 않았다면 깨닫지도 못했을 겁니다. 이 점이 바로 사용자와 서비스 제공자의 시각차라고 생각합니다.

예전부터 많은 디자이너와 기획자가 모바일 내비게이션 바를 접어 두려는 시도를 많이 했습니다. 화면이 답답하다는 이유였습니다. 이 의견에 저도 완전히 부정하지는 않습니다. 다만 뭐가 중요한지는 판단을 더 해봐야 할 문제인데, 단지 화면이 답답하다는 이유로는 부족합니다. 그렇게 생각하는 이유는 위 이미지에서 A의 시각으로 바라봤기 때문입니다. 우리는 전체를 바라보며 판단할 경우가 많습니다. 그리고 사용자도 그렇게 바라볼 것으로 생각하죠. 하지만 콘텐츠에 집중하고 있을 때 중심시의 영역은 굉장히 좁습니다.

화면에서 보이는 여러 요소에 한꺼번에 주의를 기울일 수 없습니다. 예외 케이스라고 말할 수 있는 경우는 콘텐츠 크기가 너무 큰 나머지 사용자가 화면에서 보기 편한 위치로 잦은 스크롤을 통해 조작해야 하는 경우입니다. 그러나 이런 경우도 기우라고 생각되네요. 왜냐하면 이런 불만을 사용자에게서 들어본 적은 거의 없거든요. 전부 메이커가 늘어놓는 불만이었습니다. 더군다나 항상 손쉽게 접근해야 하는 내비게이션 바를 숨겨놓는 것에 개인적인 우려가 있습니다. 이런 경우는 인지 비용과 인터랙션 비용이 늘어납니다.

1) 순간적으로 내비게이션 메뉴를 찾으려 탐색한다.

2) 스크롤로 내비게이션 바를 펼친다.

물론 그 비용은 매우 적습니다. 크게 문제가 되지 않을 수도 있고요. 그런데 그 비용이 순간순간 계속 쌓인다면 어떻게 될까요? 개인적으로는 안정성이 깨질 수도 있는 상황을 무척 경계하기에 조심스럽습니다.

중심시의 움직임은 파악하려는 정보의 맥락에 따라 달라진다

Yarbus, A. (1967). Eye movements and vision (B. Haigh & L. A. Riggs, Trans.)

주변시

개인적으로는 주변시의 특징이 흥미로웠습니다. 왜냐하면 이 영역은 색을 인지하지 못하기 때문이죠. 대부분 이 말을 들었을 때 의구심이 들었을 것이라 생각합니다. 분명 지금 이 화면을 주시하면서도 주변의 색을 느낄 수 있기 때문입니다. 하지만 이것은 이미 중심시가 주변 스캔을 했고 뇌가 그것을 보완하고 있는 상태입니다.

주변시는 색을 인지하지 못하지만 중심시가 빠르게 스캔한 정보를 뇌가 계속 보완해주고 있다

우리는 느끼지 못하지만, 우리의 눈은 잠시도 쉬지 않고 움직이고 있습니다. 시선 추적(Eye tracking)에서 나타나는 움직임은 굉장히 빠르고 우리도 모르게 일어나는 현상입니다. 흔히 말하는 ‘동공 지진’은 일상적으로 일어나고 있는 것입니다. 위기에 몰리면 더 많은 정보를 찾기 위해 더 열심히 움직이기 때문에 잘 보이는 경우겠죠. 깜짝 놀라는 경우에 눈이 커지는 현상 또한 위험한 상황에 생존을 위해 더 많은 정보를 얻기 위해 발생하는 무의식적인 현상입니다. 이 안구 운동의 중요성은 움직임이 멈췄을 때 나타납니다. 안구를 움직이게 하는 근육을 마취시켰을 때 일정 시간이 지나면 실험 대상자들은 세상이 흑백으로 보인다고 말했습니다. 그리고 시간이 더 흐르면 시각을 완전히 잃어버립니다.

이렇게 중심시가 열심히 움직여준 덕분에 우리는 모든 시각 영역에서 색을 인지할 수 있습니다. 이것도 간단한 실험으로 확인할 수 있습니다. 먼저 크레용 같은 색이 있는 작은 물건을 준비합니다. 친구에게 정면을 바라보라고 하고 시야 한쪽 옆에 그 물건을 들고 색을 물어보세요. 잠깐이라도 눈동자를 돌리지 않았다면 색을 얘기할 수 없을 겁니다. 하지만 시야 중심으로 움직이면 색을 맞출 수 있습니다. 그런데 흥미로운 점은 정면에서 측면으로 이동하면 시야의 구석으로 옮겨도 계속 그 색을 인지할 수 있다는 점입니다. 이미 뇌가 색을 인지하고 그 정보를 보완하기 때문입니다. 하지만 주변시는 움직임에 굉장히 민감합니다.

넓은 모니터를 사용해도 화면 구석에 뜨는 알림에 반응하게 됩니다. 주변시가 반응하는 범위에 있기 때문입니다.

모니터가 아무리 크더라도 주변시의 범위 안에 있다면 우리는 그 움직임을 민감하게 인지합니다. 보고 싶지 않아도 알림 팝업이 뜨면 시선이 움직입니다. 주변시가 반응하는 범위에 있기 때문입니다. 그래서 너무 잦으면 짜증을 유발하기도 합니다. ‘주의’를 방해하니까요. 이것은 주변의 위험으로부터 자신을 지키기 위해 진화한 결과입니다. 사냥감에 집중하면서도 주변에서 다가오는 맹수의 위협도 감지해야 생존에 유리하죠. 그래서 주변시는 움직임에 굉장히 민감하게 진화했습니다. 주의를 끌어 자세히 보게 만들고 판단하게 합니다.

이런 중심시와 주변시의 특성 때문에 발생하는 부작용은 당연히 인지 비용의 증가입니다. 뇌는 잠시도 쉬지 않고 정보를 받아들이며 이를 해석하려고 합니다. 모든 것은 무의식적인 과정입니다. 다만 익숙한 정보라면 기존의 기억을 바탕으로 해석을 넘겨버리지만 잘 모르는 형태 등 특이점이 발견되면 그것을 해석하기 위해 뇌는 평소보다 많은 에너지를 사용하게 되죠. ‘모른다’는 것은 과거부터 생존에 큰 위협이었기 때문입니다. 익숙한 형태면 쉽게 인지하고 익숙하지 않으면 어렵게 인지합니다. 그래서 우리는 익숙한 곳에 가면 편안하고 낯선 곳에 가면 쉽게 피로해지게 됩니다.

‘뇌는 복잡한 자극보다 약간 정형화 또는 단순화된 패턴의 자극을 좋아한다. 사실 자연은 아주 무작위하고 복잡하다. 그런 자연을 있는 그대로 판단하고 기억하기란 힘들다. 그래서 뇌는 그 속에 숨겨진 패턴을 찾아 단순화시키려고 노력한다.’

<감각, 착각, 환각> 최낙언 저

다양한 UI vs 단조로운 UI

많은 서비스가 한 페이지에서 다양한 UI를 제공하려는 성향을 갖고 있습니다. 특히 이커머스 분야에서는 일부 콘텐츠 소비형 서비스도 그런 현상이 발견됩니다. 대부분 지루하기 때문입니다. 메이커는 UI에 신경을 쓰지만, 사용자는 콘텐츠를 봅니다. 앞서 말했듯 콘텐츠를 담는 UI의 패턴이 다양해지면 뇌는 무의식적으로 그 형태와 맥락을 이해하려고 소모하게 되는 에너지양이 많아지고, 그 에너지 소모는 스트레스로 전환됩니다. 그래서 사용자에겐 다양함보다는 차라리 지루함이 더 낫습니다. 반복된다는 것은 한 가지만 알면 나머지는 저절로 풀리기 때문이죠.

인간은 크게 도움이 되지 않는 곳에 에너지 소모하는 것을 굉장히 꺼리니 주의해야 합니다. ‘이득’보다는 ‘손실’에 굉장히 민감하게 반응하기 때문입니다. 서비스를 이용하는데 인지 비용이나 인터랙션 비용이 많이 발생한다면 사용자는 그 서비스를 이용하지 않으려 할 것입니다. 더 큰 가치를 발견하기 전까지는 말이죠.

일정한 패턴이 계속 반복되면 지루해지는 것은 동의합니다. 그런데 그것은 UI의 단조로움에서 오는 것이 아니라 콘텐츠의 단조로움에서 온다고 생각합니다. 때로는 약간의 스트레스가 활력을 불러오기도 합니다. 아무 소리도 들리지 않은 밀폐된 공간보다 생활 소음이 있는 카페가 더 좋을 수도 있기 때문입니다.

단조로움과 변화의 비율이 8:2 혹은 9:1 정도의 범위에서 벗어난다면 단순함의 의미는 사라질 수도 있습니다. 모든 것은 균형의 문제입니다. 그런데 실무에서 설득하기 어려운 이유는 이런 이야기를 간단하게 설명하기가 너무 어렵고 잘 받아들여지지 않기 때문입니다.


참고자료

[1] 인지심리학 | 하코다 유지, 츠즈키 타카시 외 2명 저 | 강윤봉 역 | 한국뇌기반교육연구소 | 2014.03.10

Author
임용태

임용태

데일리호텔 프로덕트 디자이너. 쿠팡 UX디자이너로 일하면서 정성적•정량적 관점의 업무 방식을 배웠습니다. 다른 회사에 다니면서 업무방식에 대해 관심이 생겼고 뇌과학과 인지심리학을 통해 디자인을 이해하려고 노력하고 있습니다. imyongtai@gmail.com

Comments
  • digitla-insight-202102-offline-ads-pentabreed
© DIGITAL iNSIGHT 디지털 인사이트. 무단전재 및 재배포 금지

뉴스콘텐츠는 저작권법 제7조 규정된 단서조항을 제외한 저작물로서 저작권법의 보호대상입니다. 본 기사를 개인블로그 및 홈페이지, 카페 등에 게재(링크)를 원하시는 분은 반드시 기사의 출처(로고)를 붙여주시기 바랍니다. 영리를 목적으로 하지 않더라도 출처 없이 본 기사를 재편집해 올린 해당 미디어에 대해서는 합법적인 절차(지적재산권법)에 따라 그 책임을 묻게 되며, 이에 따른 불이익은 책임지지 않습니다.

Related Posts