thumbnail
2. 피츠의 법칙
UI/UX
2021.10.17.

이 포스트는 UX/UI의 10가지 심리학 법칙 (존 야블론스키 저)에서 소개된 10가지 법칙을 소개하는 페이지입니다 .

각각의 내용에 보다 자세한 내용은 책을 참고 바라며 저자의 웹 사이트 https://lawsofux.com 에서 해당 법칙들에 대한 소개글을 볼 수 있습니다.


“대상에 도달하는 시간은 대상까지의 거리와 대상의 크기와 함수 관계에 있다.”

핵심

  • 터치 대상의 크기는 사용자가 정확하게 선택할 수 있을 정도로 충분히 커야 한다.
  • 터치 대상 사이에 충분한 거리를 확보해야 한다.
  • 터치 대상은 인터페이스상에서 쉽게 도달할 수 있는 영역에 배치해야 한다.

개요

  • 사용성(Usability)이란 말은 좋은 디자인을 이루는 요소로서, 사용하기 편하다는 의미와, 인터페이스가 이해하기 쉽고, 탐색하기 쉬워야 함을 의미한다.
  • 인터랙션에 있어서 인터랙티브 요소를 사용하고 움직이는데 드는 시간은 중요한 요소다.
    • 크기와 위치, 선택 가능 영역, 입력 방식 등 고려해야할 부분이 많다.
  • 피츠의 법칙에 의하면 대상이 커지면 대상 선택에 드는 시간이 줄어들며, 대상 선택을 위해 움직이는 거리가 줄면 대상을 선택하는 시간도 줄어든다.

기원

  • 피츠의 법칙은 1954년 미국의 심리학자 폴 피츠가 터치 대상까지 움직이는 데 드는 시간을 대상까지 거리와 대상 너비 간의 비율에 고나한 함수를 통해 예측하면서 나왔다.
  • 대상 선택 작업의 난이도(ID)를 정량화 하는 측정 기준은 다음과 같다.
    • 대상 중심까지의 거리(D)는 신호(signal)로, 대상의 허용 오차 혹은 너비(W)는 잡음(noise)으로 간주한다. ID=log2(2D/W)ID = log_2(2D/W)

사례

  • 폼 텍스트 레이블은 피츠의 법칙을 보여주는 흔한 예로, 텍스트 레이블 요소와 입력을 연결하면 레이블을 탭하거나 클릭해도 입력이 선택된다.
    • 즉, 조준의 정확도가 떨어져도 입력 표면적이 확장되기 때문에 사용자는 입력에 집중할 수 있다.
  • 폼 전송 버튼 역시 예가 될 수 있다. 일반적으로 폼 전송 버튼은 마지막 입력 폼 근처에 배치한다.
    • 이렇게 함으로써 두 종류의 입력이 시각적으로 연결되어 보이며, 마지막 폼 입력에서 전송버튼까지의 거리도 줄어든다.
  • 인터랙티브 요소 사이의 간격도 중요 요소다.
    • 너무 가까우면 다른 입력을 누를 가능성이 높아져서 피로도가 높아지고, 너무 멀면 입력 거리가 멀어지기 때문에 시간이 오래걸린다.
  • 아이폰의 경우 아이폰 6 플러스 모델을 도입하면서 한 손사용의 불편을 완화하는 화면 상단 간편 접근 기능을 도입했다.
    • 간단한 제스처로 화면을 하단으로 내림으로써 접근하기 어려웠던 영역에도 한 손으로 쉽게 접근할 수 있게 되었다.

정리

  • 인터페이스로 인해 사용자의 주의가 분산되거나, 사용하고자 하는 의지가 꺾이면 안된다.
    • 특히 모바일 인터페이스는 화면이 작기 때문에 피츠의 법칙을 각별히 유념해야 한다.
    • 요소의 크기, 간격을 적절히 배치하는 것이 중요하다.

© 2022 Developer Abel, Powered By Gatsby.