brunch

You can make anything
by writing

C.S.Lewis

by 직장인 K Mar 15. 2021

[UX/UI의 심리학 법칙] 책 정리

프로덕트 디자이너가 심리학을 알아야 하는 이유는 무엇일까요?

프로덕트 디자이너는 사용자가 목표를 쉽고 빠르게 달성할 수 있도록 도와야 해요.

이때 사람들이 대략적으로 어떻게 행동 할것이라는 청사진을 가지고 디자인을 하는데,

심리학을 공부하면 이러한 청사진을 더 정확하게 그려나갈 수 있기 때문에 심리학이 필요하답니다.



'디자인을 할 때는 관습을 따라라' / 제이콥의 법칙

사용자는 자신에게 익숙한 제품을 통해 구축한 기대치를, 그와 비슷해 보이는 다른 제품에도 투영해요.

그래서 기존의 멘탈 모델을 활용하면 사용자가 새 모델을 익히지 않아도 되어 뛰어난 사용자 경험이 완성됩니다.


*멘탈 모델

시스템의 작동 방식에 관해 알고 있다고 생각하는 바를 가리킴. 디자이너와 사용자의 멘탈 모델 사이의 거리를 줄이는 건 디자이너에게 주어진 중요한 과제.

이를 위해서 사용자 인터뷰, 페르소나, 여정 지도, 공감 지도 등 여러 방법 써야 함


익숙하다는 건 엄청 큰 가치예요. 처음 접하는 디지털 제품이나 서비스더라도 디자인이 익숙하면 사람들은 사용법을 금세 깨우치기 때문이에요. 요구되는 정신적 노력이 줄면 인지부하는 확실히 감소하는데요. 인터페이스를 익히는데 드는 정신적 에너지가 줄어들수록, 사용자가 목표 달성에 투자할 에너지는 늘어납니다.


그래서 제이콥은 디자이너들이 일반적인 디자인 관습을 따를 것을 권장합니다.

왜냐하면 사용자가 사이트의 콘텐츠나 메시지, 제품에 더욱 집중할 수 있기 때문이에요.



'사용자가 대상을 사용하기까지 걸리는 시간은 대상의 크기와 대상까지의 거리와 연관이 있다' / 피츠의 법칙

사용하기 편하다는 의미는 인터페이스가 이해하기 쉽고, 탐색하기도 쉬운 것을 의미해요.

탐색하기 쉽다는 것은 해당 요소를 손쉽게 선택할 수 있다는 것인데요, 이를 위해서 3가지가 필요합니다.  

터치 대상의 크기는 사용자가 정확하게 선택할 수 있을 정도로 충분히 커야 해요.(최소 44*29px)

터치 대상 사이에 충분한 거리를 확보해야 해요. (최소 8px)

터치 대상은 인터페이스상에 쉽게 도달할 수 있는 영역에 배치해야 해요.



'의사결정에 걸리는 시간은 선택지의 개수와 복잡성과 비례해 늘어난다' / 힘의 법칙

목표 달성을 위해 무엇을 해야 할지 덜 고민할 수 있다면, 목표를 성취할 확률은 더 높아집니다.

그렇기 때문에  

선택지의 개수를 최소화하고, 추천 선택지를 강조해서 사용자의 부담을 줄여야 해요.

인지 부하를 줄이기 위해 복잡한 작업을 잘게 나눠야 해요.

추상적이라고 느껴질 정도로 단순화하지 않도록 주의해야 합니다.

*인지부하

인터페이스를 익히고 인터랙션 하는 데 필요한 정신적 자원의 양



'콘텐츠를 적절한 크기의 덩어리로 나눠 정리해두면 사용자가 정보를 쉽게 처리하고 이해하고 기억하는데 도움이 된다' / 밀러의 법칙

정보를 덩어리로 만들면 정보를 더욱 효과적으로 암기할 수 있을뿐더러 정보를 쉽게 처리할 수 있답니다.

때문에 인터페이스에서 제목과 부제 서식을 추가하기도 하고 콘텐츠 섹션 사이에 여백을 두기도 해요.



'사용자는 절정의 순간과 마지막 순간에 느낀 감정을 바탕으로 경험을 판단하는 경향이 있다' / 피크 엔드 법칙

제품이나 서비스를 다시 사용할지, 아니면 다른 이에게 추천할지 좌우하는 건 경험에 대한 기억에 따라 달라집니다.

경험을 판단할 때에는 경험 전반을 통해 느낀 감정이 아닌 감정적 절정의 순간과 마지막 순간에 느낀 감정의 평균을 가지고 경험을 판단해요. 때문에 이런 순간을 포착해 좋은 인상을 남기는 것이 중요합니다.


이를 위해서는 사용자 여정 지도를 그려보는 방식이 있어요.

마이리얼트립의 사용자 여정 지도 (출처 : https://deep-wide-studio.tistory.com/15)



'사용자는 보기 좋은 디자인을 사용성이 더 뛰어난 디자인으로 인식한다' / 심미적 사용성 효과

막장 A/S 정책과, 애플 페이가 안되어도... 애플을 사용하는... 나....

보기 좋은 디자인은 인간의 뇌에 긍정적 반응을 주어 디자인이 아름다우면 사용자는 긍정적인 감정 반응을 얻고, 인지 능력이 향상되며, 사용하기 편하다는 인식을 받고, 프로덕트에 대한 신뢰도 높아져요. 또한 사소한 사용성 문제에 비교적 관대해진답니다.



'비슷한 사물이 여러 개 있으면 그중에 가장 차이가 나는 한 가지만 기억할 가능성이 크다' / 폰 레스토프 효과

폰 레스토프 효과를 활용해 알람 배지로 주의를 끄는 사례

중요한 정보나 핵심 동작은 시각적으로 눈에 띄게 해야 해요.

특정 요소를 강조할 때 색상에만 의존하면 색맹이나 저시력인 사용자가 배제된다는 사실을 유념하세요.


배너 무시 효과

중요한 정보를 강조할 때 배너 무시 효과를 주의해야 해요.

배너 무시 효과란 광고를 무시하는 법을 배운 사용자가, 전통적으로 광고가 있다고 간주되는 위치에 나타나는 정당한 콘텐츠를 광고라고 인식하거나 디자인적으로 광고와 비슷할 때 무시하는 것을 말해요.

웹을 사용할 때 사용자들은 1)차지하는 위치, 2)시각적 위협으로 광고라고 인식하고 무시합니다.


1. 차지하는 위치

A)2018년 시선추적 연구에서, 일부 참가자들이 구글 검색 결과 상단에 나타난 광고를 지나쳤다고합니다. 시각 디자인이 전통적인 배너 광고와 멀더라도 이러한 현상은 일어나요. B)데스크탑 광고는 일반적으로 페이지 상단이나 오른쪽 레일에 나타나기 나는데 웹 사용자들은 가끔씩 그곳에 있는 컨텐츠를 무시하고 페이지에 있는 텍스트를 읽어요.



2. 시각적인 위협

광고가 페이지 상단이나 오른쪽 레일에 나타나지 않아도 무시할 수 있어요.

최근에 나온 광고들은 웹페이지 내부의 어느 곳에서나 (컨텐츠 영역안의 광고) 나올 수 있고 사용자들은 이 사실을 알고 있습니다.

광고는 둘러싸고 있는 페이지 콘텐츠와 아주 다르기 때문에 광고라고 더욱 인식이 잘 된다고 합니다.


1. 텍스트 중앙에 있는 작은 직사각형 모양

2. 끌리는 문장

3. 흰색 페이지와 대조되는 컬러 (파란색) 배경

4. 이미지에 텍스트를 내장함

제공된 광고 특성들은 직사각형이 배너라는 점을 사용자들에게 알려주어요. 그래서 이 실험에서 사용자들은 확신을 갖고 배너를 무시할 수 있었습니다.



광고가 컨텐츠를 오염시키지 않는 방법은 어떤것이 있을까요?

1. 사용성 테스트를 실시해서 사용자들이 상단 배너나 오른쪽 레일에 위치한 중요한 컨텐츠를 실제로 보는지 확인하세요.

2. 컨텐츠를 광고처럼 만들지 말라. 컬러, 종류, 배경, 전체적인 컨텐츠 스타일을 조심해서 선택한다. 사이트 나머지 부분과 다르게 보이도록 하는 것이 중요성을 증가시킬 거라고 생각할 수도 있지만, 정반대의 효과를 내어요.



모바일은 어떨까요?

웹 사용자처럼, 모바일 사용자도 광고를 피하려고 해요. 하지만 모바일 인라인 광고는 여러 이유 때문에 피하기가 어렵습니다.

1) 한번에 보이는 정보가 적어서, 주요 컨텐츠와 다르게 보이는 요소들을 확인하기가 어려워요.
(페이지에 나타나는 컨텐츠가 너무 적기 때문)

2) 모바일 광고는 화면 크기 비율에 비해 너무 커요. 사용자들은 쓸어 내리면서 광고를 피할 수 없습니다. 그래서, 광고는 사람들이 광고를 알고 분명히 보고 싶지 않더라도 본질적으로 시선을 잡아내어요.




배너 무시 효과 출처: www.nngroup.com/articles/banner-blindness-old-and-new-findings/

출처: UXUI의 10가지 심리학 법칙

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari