UX/UI의 10가지 심리학 법칙: 사용자의 마음을 읽는 인간 중심 제품과 서비스 디자인 - 존 야블론스키를 읽고 정리한 글

디자인을 결정할 때 프로젝트 이해관계자에게 좋은 디자인에 대한 근거로 사용하기 좋은 법칙들을 모아놨다.

1. 제이콥의 법칙

사용자는 다른 웹사이트를 통해 축적된 경험을 바탕으로 디자인 관례에 대한 기대치를 형성하는 경향을 보인다.

사용자는 새로운 시스템을 접할 때 기존의 경험을 활용한다.
따라서 기존에 경험했던 것과 비슷한 시스템이라면 큰 노력 없이 시스템이 어떻게 작동하는지 알 수 있지만, 기존에 경험했던 것이 아니라면 어떻게 작동하는지 노력을 들여 알아내야 한다.

기존에 통상적으로 사용되는 디자인을 사용하는 것이 사용자 경험이 좋다고 느낀다.
또 기존 디자인에서 다른 디자인으로 리디자인할 경우, 사용자가 거부감을 느끼지 않도록 점진적으로 바꾸거나 기존 디자인도 선택할 수 있도록 선택지를 주는 것이 좋다.

2. 피츠의 법칙

사용자가 대상을 사용하기까지 걸리는 시간은 대상의 크기와 대상까지의 거리와 연관이 있다.

대상이 작아지고 멀어질수록 선택하는 데 많은 시간이 든다.
또, 대상 사이에 충분한 거리가 있어야 한다.

  • 터치 대상의 최소 권장 규격
회사/조직 권장 규격
휴먼 인터페이스 가이드라인 (애플) 44 × 44 pt
머터리얼 디자인 가이드라인 (구글) 48 × 48 dp
웹 콘텐츠 접근성 가이드라인 (WCAG) 44 × 44 CSS px
닐슨 노먼 그룹 1 × 1 cm
  • 터치 대상 간의 거리 최소 권장 규격
    8 dp (구글 머터리얼 디자인 가이드라인)

위 가이드라인에 따라 대상이 너무 작아지거나 대상끼리 너무 가까이 있지 않도록 디자인해야 한다.
스마트폰의 경우 사용자는 화면 중앙을 가장 터치하기 편하다고 느끼기 때문에 이를 고려해서 디자인해야 한다.

3. 힉의 법칙

선택지의 개수가 늘면 의사결정에 걸리는 시간이 증가한다.

선택지의 개수를 최소화해서 인지 부하를 줄여야 한다.
선택지가 많을 경우 추천 선택지를 표시해서 사용자의 부담을 줄일 수 있다.
인터페이스를 지나치게 단순화하면 사용자가 어떤 의미인지 파악하지 못해 혼란스러울 수 있으므로 지나친 추상화를 피해야 한다.

4. 밀러의 법칙

보통 사람은 한번에 7개 정도의 정보를 기억할 수 있다.
그리고 그 정보의 단위는 정보의 기본 단위인 비트가 아니라 정보 덩어리(chunk)이다.

인간은 덩어리화(chunking)를 활용해 정보를 암기한다.
글자 7개든 단어 7개든 암기하기 위해 노력하는 비용은 비슷하다.

콘텐츠 덩어리를 적절하게 나눠 시각화하면 사용자가 쉽게 이해할 수 있다.
그 덩어리의 내부 항목은 길어도 사용자 경험이 크게 감소하지 않지만 덩어리의 개수는 7개 이하로 제한하는 게 가독성이 좋다.

5. 포스텔의 법칙

견고함의 원칙
자신이 행하는 일은 엄격하게, 남의 것을 받아들일 때는 너그럽게.

사용자의 다양한 동작, 다국어 서비스에 의한 텍스트 변화, 사용자의 기본 글꼴 크기 변화 등 다양하고 복잡한 요구사항이 발생한다.
다양한 가능성을 잘 예측하고 대비해 견고한 디자인을 만들어야 한다.

6. 피크엔드 법칙

인간은 경험 전체의 평균이나 합계가 아니라, 절정의 순간과 마지막 순간에 느낀 감정을 바탕으로 경험을 판단하는 경향이 있다.

사람들은 긍정적인 순간보다 부정적인 순간을 더 잘 기억한다.
서비스 중 부정적인 감정이 발생할 만한 부분에서 유쾌한 디자인을 사용하면 부정적인 감정을 줄일 수 있다.

7. 심미적 사용성 효과

사용자는 보기 좋은 디자인을 사용성이 더 뛰어난 디자인으로 인식한다.

서비스의 디자인이 보기 좋으면 사용자는 사소한 사용성 문제에 관대해진다.
이런 점 때문에 디자인이 좋은 서비스의 사용성 테스트를 진행할 때 사용성 문제가 드러나지 않을 수도 있으므로 주의해야 한다.

8. 폰 레스토프 효과

비슷한 사물이 여러 개 있으면 그 중에서 가장 차이가 나는 한가지만 기억할 가능성이 크다.

사용자는 시각적으로 대비되는 요소에 빠르게 주의를 빼앗긴다.
따라서 시각적 강조를 활용해 사용자가 어떤 부분에 집중할 지 관리할 수 있다.
하지만 너무 많은 부분을 강조하면 사용자가 필요한 정보를 찾기 어려워진다.

중요한 정보나 핵심 동작은 시각적으로 강조하되, 너무 많은 동작을 강조시키지 않는다.
광고처럼 보이거나 광고 근처에 있으면 사용자가 무시할 수 있으므로 주의한다.

특정 요소를 색상으로만 강조한다면 색맹, 저시력 사용자가 배제될 수 있다.
움직임을 활용해서 강조할 때는 움직임에 민감한 사용자를 고려해야 한다.

9. 테슬러의 법칙

복잡성 보존의 법칙
모든 시스템에는 더 이상 줄일 수 없는 일정 수준의 복잡성이 존재한다.

모든 시스템에는 더 이상 줄일 수 없는 기본적인 복잡성이 존재하며, 이 복잡성은 시스템이나 사용자 둘 중 하나가 감당해야 한다.
다르게 말하면 개발자 혹은 디자이너가 감당한다면 사용자가 편해진다는 뜻이다.

기본적인 복잡성을 디자인, 개발 과정에서 처리해 사용자의 부담을 줄일 수 있다.
예를 들어, 이메일을 송신할 때 보낸 사람을 자동으로 채워주고 받는 사람은 추천하는 등 기술적으로 감당할 수 있다.

하지만 복잡성을 줄이기 위해 너무 추상적으로 느껴질 정도로 인터페이스를 단순화하면 안된다.
단순화하기 위해 아이콘을 사용할 때 글자도 같이 삽입하는 것이 사용자가 이해하기 편하다.

10. 도허티 임계

컴퓨터와 사용자가 서로를 기다리지 않아도 되는 속도(0.4초 이하)로 상호작용하면 생산성이 높아진다.

사용자는 처리 시간이 0.1초 이내일 때 즉각적이라고 느낀다.
0.1초 ~ 0.3초 사이의 지연은 맨눈으로 감지된다.
처리 시간이 0.4초를 넘어간다면 사용자에게 처리 시간에 대한 피드백을 주는 것이 좋다.

사용자의 체감상 처리 시간을 줄일 수 있는 방법은 다음과 같다.

  • 뼈대 화면(skeleton screen)을 사용해 콘텐츠 자리 미리 확보하기
  • 블러 업(blur up)을 사용해 이미지 영역 미리 확보하기
  • 진행표시줄 혹은 애니메이션을 사용해 사용자의 시선 끌기

대기 시간이 10초를 넘어가면 사용자는 집중을 잃기 쉽다.
이럴 때는 프로세스가 완료하기까지의 예상 대기 시간, 현재 수행중인 작업에 대한 설명을 추가로 제공해 사용자를 지루하지 않게 하는 것이 좋다.

또한 낙관적 UI(optimistic UI) 기법을 사용해 프로세스가 완료되지 않았음에도 미리 완료된 것처럼 가정하여 표시해 체감 대기 시간을 줄일 수 있다.

보안 관련 프로세스 등 작업 속도가 너무 빠르면 신뢰를 잃는 프로세스는 작업이 끝나더라도 일부러 사용자를 대기시켜 신뢰를 얻을 수 있다.