[오아챌] uxui 디자이너가 알아야 할 심리학 원칙

🎁 10일차 주제: UX와 인지심리학
- UX를 지탱하는 가장 핵심 분야인 인지심리를 이용한 UX 설계 원리 및 사례를 알아보아요!
- 지각 단계 / 인지 단계 / 해석 및 평가 단계 / 실행 단계 등 여러 프로세스를 돕는 UX 설계 원칙들
- 인지 관점에서 좋은 디자인과 나쁜 디자인
- 기타 등등, 인지 기반 UX에 관한 아티클이라먄 무엇이든 좋아요.

---

이번 챌린지가 열리는 날 외부로 갈 일이 있어서 2일 정도 늦은 날에 하게 되었다 ㅠㅜ

 

uxui 디자이너가 알아야 할 심리학 원칙

https://brunch.co.kr/@zalhanilll/145

UX/UI 디자이너가 알아야 할 심리학 원칙

 

- 심리학은 앱 ux에 큰 영향을 끼친다
- 디자인이 어떻게 인지되는지 이해함으로써 사용자가 더 효과적으로 목표 달성할 수 있게 디자인 조정이 가능하다.


[사용자가 디자인을 어떻게 인지하는 지에 대한 몇 가지 디자인 원칙]

1. Von Restorff effect(고립효과)
- 같은 물체가 여러개 있고 다른 물체가 한개이면, 다른 한 개의 물체가 가장 기억에 남는다
- 클릭을 유도하는 버튼에 주로 쓰인다.


2. Serial position effect (서열 위치 효과)
- 처음과 끝에 위치한 항목을 더 잘 기억하는 것을 의미한다.
-> 대부분 앱들이 햄버거 버튼 사용 대신 상화좌우 끝에 가장 중요한 항목을 위치하는 이유이다

3. Cognitive load (인지 부하)
- 사람의 작업 기억에 사용되는 정신적 노력의 총량이다
- 기억할 정보의 양이 많아지는 것을 ‘인지 과부하’라고 한다.

- 인지 부하 이론은 세 가지 유형으로 구분된다
   
1) Intrinsic cognitive load(내재적 인지부하)
: 어렵거나 양이 많으면 사용자가 받아들이기 힘들다.(학습할 과제, 학습자 수준에 의해 발생)

  2) Extraneous cognitive load(외재적 인지부하) 
: 사용자에게 학습 방법 및 전략을 잘 제시해줘야 한다. (과제 난이도가 아닌 가르쳐주는 것에 따라 달라지는 부하)

  
3) Germane cognitive load (본질적 인지부하)
: 사용자 본인이 주체가 되어 생기는 부하이다
       
: 내재적, 외재적 부하를 잘 설계해서 본질적 인지부하를 잘 이끌어 내는 것이 필요하다. (학습자가 과제를 처리하기 위한 노력에서 생기는 부하)

-> 내재적 인지 부하가 낮으면(학습하기 쉬우면)
     본질적 인지부하를 이끌어낼 수 있어서(스스로 처리하려고 하기 때문에)
     외재적 인지부하가 발생해도(가르쳐주지 않아도 된다)
     문제 해결에 어려움이 없기 때문에 인지부하와 본질적 인지부하가 상대적으로 더 중요하다

4. Intrinsic Cognitive Load (내재적 인지부하)
- 과제의 난이도와 관련된다
- 짧은 문장이 UX에서 중요한 이유이기도 하다.
ex) 앱의 빈 화면에서는 사용자가 지침을 쉽게 따라갈 수 있게 짧고 간결한 문장으로 작성해야 한다.

 5. Germane Cognitive Load(본질적 인지부하)
- 사용자가 새로운 지식을 받아들이려는 것을 말한다
- 적절한 수준의 과제를 제공하면 사용자는 과제를 해결하기 위해 정신적인 노력을 기울인다

   -> 긍정적 현상이기 때문에 사용자에게 본질적 인지부하가 생기도록 유도할 필요가 있다

   -> 디자인 패턴을 사용하는 이유는 사용자가 익숙하게 받아들일 수 있기 때문이다.

   -> 이미 이해하고 있는 패턴 형식으로 만들면 새로운 것을 쉽게 받아들일 수 있다.
 
 6. Hick’s Law (힉스의 법칙)
- 개슈탈트 이론과 함께 가장 널리 사용되는 원리이다
- 선택의 수가 증가하면 상대적으로 의사결정 시간이 늘어난다.
- UX디자인에 적용되는 힉스의 법칙의 좋은 예시는 list이다.

 7. Law of Proximity (근접성의 법칙)
- 게슈탈트 이론 중 하나이며, 서로 가까이 있는 물체가 그룹화 되는 것을 말한다.
- 뇌는 서로 가까이 있는 물체를 쉽게 연결한다. (클러스터링은 인간이 정리하고 그룹화 하는 경향이 있기 때문에 발생한다)
 

 

[느낀점]
UX가 심리학과 연결이 되어 있기 떄문에 같이 공부해야 한다는 것은 인지하고 있었지만, 관련 아티클은 이번에 처음 읽게 되었습니다. 그래서 내용들이 흥미로웠습니다. 특히 3가지 인지 부하에서 본질적 인지부하와 내재적, 외재적 인지부하의 연결성이 흥미로웠습니다. 본질적 인지부하를 잘 이끌어내는 것이 중요하고, 이를 위해 사용자가 인지하기 쉬우면서도 적절히 고민할 수 있는 난이도를 주어야 한다는 것이 꽤나 인상 깊었습니다. 지나치면서 보거나 경험을 통해 알게 자연히 알게 되었던 것, 혹은 외웠던 것들이 모두 이런 심리학과 연관되어 디자인 되었다는 사실을 이제사 이해하게 되어 저에게는 유익한 아티클이었습니다.

 

 

---

참여자들의 공유 아티클

 

 

[도널드 노먼이 자신을 "인지 디자이너cognitive designer"라고 소개하는 영상]

https://youtu.be/NK7aaO7ixU8

노먼은 현재의 디자인 교육이 주로 예술/건축 전통에 기반을 두고 있다는 점에 대해 비판적인 견해를 밝혀왔는데요, 이런 문제의식이랑도 연결되는 내용이라고 생각했어요.

 

 

[UX디자인과 인간심리 - 게슈탈트 유사성의 원리]

https://brunch.co.kr/@nyeric/45

유사성의 원리란: 사람들은 유사한 것들 안에서 패턴을 찾는다. 

사람들이 인지하기 쉽도록 유사성을 높여준다면, 각 요소에 대한 목적을 쉽게 알 수 있도록 도와줄 수 있다. 형태 외에도 색, 사이즈, 드롭쉐도우, 코너 부분에 대한 라운딩 등 다양한 방법을 활용할 수 있다.
새

- 색상을 활용한 유사성 끌어올리기
EX. 마켓컬리 - 시그니처인 보라색 컬러를 버튼과 같이 Action(사용자 행동)과 관련된 요소 또는 사용자가 꼭 봤으면 하는 ‘Importance(중요도)’가 높은 부분에 적용합니다. 다른 요소 대비 보라색을 쓴 부분이 눈에 확 들어올 수 있도록 차별화하는 것입니다.

- 형태와 사이즈를 통해 시각적 우선순위 만들기
EX. 에어비앤비 - 상위의 ‘도시’카테고리는 모두 닫힌 형태의 타일 형식을 갖고 있고, 하위의 ‘숙박시설’카테고리에는 열린 형태의 타일 형식과 사이즈의 변화로 차이를 주었습니다.

이와 같이 형태와 사이즈의 유사성을 활용하면 사용자에게 시각적 우선순위가 형성되어 정보의 체계를 만들 수 있습니다. 또한 유사성이 있는 다른 그룹들에 대해 각각의 목적성을 부여할 수 있습니다.

—> 게슈탈트의 심리이론 중 유사성의 원리에 관한 아티클을 읽었어요. 저는 UI 레이아웃을 짤 때 정보의 그룹핑이 중요하다는 것을 생각하고 차별화를 준 카테고리를 디자인하긴 했지만 정작 왜 중요한지는 설명할 수 없었던 것 같아요. 유사성의 원리를 예시와 함께 보고 이해할 수 있었습니다.  앞으론 시각적 체계를 만드는 것이 사용자에게 각각의 목적에 맞는 정보를 효율적으로 전달 가능하기 때문이라고 정확히 인지하고 디자인 할 수 있겠어요! 😄

 

 

 

[UX 디자이너에게 인지 심리학 책을 추천하는 아티클]
https://story.pxd.co.kr/623

1. 스키너의 심리상자 열기
    * 현대 심리학의 중요한 전환점을 가져온 주요 실험, 연구 10가지를 다루고 있습니다.
    * ex. 스키너의 보상과 처벌에 관한 행동주의 이론 - 보상이 비정기적으로 이루어질 때 행동이 소멸되기 힘들다. 
2. 보이지 않는 고릴라
    * 주의, 기억, 지식, 원인 판단 등을 착각이라는 관점에서 설명하고 있습니다.
    * 영상 중간에 고릴라 분장한 사람이 등장하는 길거리 농구 영상을 보여주고 서로 몇 번의 패스를 주고 받는지 세라고 했을 때 아무도 고릴라를 발견하지 못했다는 실험 들어보신 적 있겠죠?
3. 상식 밖의 경제학
    * 심리학과 경제학이 맞닿은 부분을 다루고 있어 기초 심리학 보다 UX에 가깝기 때문에 흥미롭게 읽을 수 있다고 합니다.
4. 생각에 관한 생각
    * 상식으론 설명하기 힘든 사람들의 사고와 행동을 이해하는데 기초가 되는 개념을 많이 다루고 있습니다.
5. 설득의 심리학
    * 사람들의 행동 자체를 변화시키는 설득에 대해 다루고 있습니다.
6. 드라이브
    * 사람들의 행동에 큰 영향을 주는 동기에 대해 다루고 있습니다.
7. 미디어 방정식
    * CASA, 사람과 사람의 관계가 사람과 컴퓨터의 관계에도 적용된다는 개념을 다루고 있습니다.
    * 사람에 대한 심리학이 HCI로 확장되는 고리를 다루고 있습니다.
8. 생각의 지도
    * 문화나 환경에 따른 사람들의 차이가 어디에 바탕을 두고 있는지 다루고 있습니다.
9. 숨겨진 자원
    * 공간적 환경이 심리화 행동에 어떤 영향을 주는가에 대해 다루고 있습니다.
    * 읽어보지는 않았지만 최근 핫해진 AR 환경 등에서 참고가 될만한 내용이 있을지 궁금하네요.
10. 오래된 연장통
    * 인간의 심리적 메커니즘이 어떤 과정으로 만들어졌는지를 다루고 있습니다.

 

 

[UX/UI의 5가지 심리학 법칙]

1️⃣ 심미적 사용성 효과
✅ 사용자는 보기 좋은 디자인을 사용성이 더 뛰어난 디자인으로 인식한다.
✔️ 형태와 기능 모두 중요한데 형태가 뛰어나면 실제로 기능도 좋다고 믿음. 하지만 사용성 문제가 심각하면 형태가 아무리 뛰어나도 기능이 좋다고 생각하지 않음. 즉 형태와 기능은 함께 작동해야 함. 

2️⃣ 핏츠의 법칙
✅ 대상에 도달하는 시간은 대상까지의 거리와 대상의 크기와 함수 관계에 있다.
✔️ 빠르게 목적에 도달하려면 대상이 커야하고, 가까워야 한다. 

3️⃣ 힉의 효과
✅ 의사결정에 걸리는 시간은 선택지의 개수와 복잡성과 비례해 증가한다.
✔️ 점진적으로 정보를 알려주는 것이 중요. 정보의 양이 많으면 그룹핑을 지어줘야 함. 추천 기능. 

4️⃣ 제이콥의 법칙
✅ 사용자는 여러 사이트에서 대부분의 시간을 보낸다. 그래서 여러분의 사이트도 자신이 이미 알고 있는 다른 사이트들과 같은 방식으로 작동하길 원한다.
✔️ 사용자는 익숙한 것을 좋아한다. 새로운 패턴을 배우는 대신 목적을 빠르게 달성할 수 있는 사용자 경험을 설계해야 한다. 후발주자는 선발주자를 따라가다가 조금씩 개선한다. 

5️⃣ 공통 영역의 법칙
✅ 게슈탈트 법칙에 따르면 사람은 기본적으로 오브젝트를 인식할 때 패턴과 그룹으로 묶어서 인식하려는 경향이 있다.
✔️ 사람들은 머릿속에서 계산하는 것을 간단히 하려고 한다. 패턴지어 연결하려고 함.