Skip to content

UX UI의 10가지 심리학 법칙 #

Find similar titles

2회 업데이트 됨.

Edit

UX/UI의 10가지 심리학 법칙 #

제이콥의 법칙 #

특징 #

  • 사용자는 자신에게 익숙한 제품을 통해 구축한 기대치를 그와 비슷한 다른 제품에도 투영함.
  • 기존의 멘탈 모델을 활용하면 사용자가 새 모델을 익히지 않아도 바로 작업에 뛰어들 수 있는 사용자 경험이 완성됨.
  • 변화를 꾀할 때는, 최대한 사용자에게 익숙한 모델을 한시적으로 이용할 권한을 부여해서 불협화음을 줄여야 함.

설명 #

  1. 관례로 쓰이거나 일반적인 디자인 패턴을 사용하여 디자인을 진행함을 통해 사용자가 새로운 인터페이스에 적응하는 데 걸리는 시간을 최소한으로 한다.
  2. 제이콥의 법칙: 디자이너들이 일반적인 디자인 관습을 따를 것을 강조함. 그래야 사용자는 콘텐츠나 메시지에 집중할 수 있음.
  3. 만약 관습과 다른 인터페이스를 제공하며 사용자는 ‘이 버튼을 누르면 이렇게 작동할 것이다.’ 라는 기대를 저버리게 됨. 그 결과 사용자는 서비스를 떠나게 됨.
  4. 멘탈 모델: 어떤 시스템에 대해 그 작동 방식을 알고 있다고 생각하는 바를 가리킴. 시스템 작동 방식에 대한 모델을 만들고 다른 서비스에 적용함.
  5. 멘탈 모델 부조화: 디자인이 멘탈 모델과 어긋나면 해당 서비스를 이해하는 속도가 현저히 낮아짐. 익숙한 제품이 달라질 때 주로 일어남.
  6. 사용자 페르소나: 대상 사용자를 명확히 하지 않으면 디자이너마다 대상 사용자를 제각각 설정함. ‘사용자'의 포괄적인 니즈가 아닌 현실적인 니즈를 바탕으로 디자인 결정을 내릴 수 있는 틀이 됨. 대상 사용자는 사용자의 데이터를 바탕으로 제작됨.

피츠의 법칙 #

Image

특징 #

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

Image

설명 #

  1. 사용성: 사용하기 편하다는 의미로서 인터페이스를 이해하기 쉬우면서 탐색하기도 쉬워야함. 인터렉션은 최소한의 노력으로 불편 없이 간단히 이뤄져야 함.
  2. 피츠의 법칙: 사용자가 대상을 사용하기까지 걸리는 시간이 대상의 크기와 대상까지 거리와 연관이 있음. 즉 대상이 커지면 대상 선택에 걸리는 시간이 줄고 대상이 작아지면 대상 선택에 걸리는 시간이 늠.
  3. 성인의 지문 면의 평균 면적은 10~14mm이고 손끝 평균 면적은 8~10mm임. 따라서 터치 대상 바깥도 일부 건드림. 따라서 다른 터치 영역이 있으면 엉뚱한 터치로 불편함을 제시함.
  4. 구글 머터리얼 디자인에서는 최소 8dp이상 버튼 사이 거리를 확보하여 사용성을 적정 수준으로 유지하라고 함.
  5. 사람들이 선호하거나 터치하기 쉬운 영역은 모바일 기기 중앙부이고 모서리로 갈 수록 정확도가 낮음.

힉의 법칙 #

Image

특징 #

  • 의사결정에 걸리는 시간은 선택지의 개수와 복잡성과 비례해 늘어남.
  • 의사결정 시간이 반응 시간에 큰 영향을 받을 때는 선택지 개수를 최소화함.
  • 인지 부하를 막으려면 복잡한 일을 잘게 나눔.
  • 추천 선택지를 강조하여 사용자의 선택 부담을 줄임.

설명 #

  1. 디자이너가 제품이나 서비스의 목표나 제약을 잘 모를 때 혼란이 야기됨. 사용자의 목표를 정확히 이해하고 이를 방해하는 요소를 없애는 것을 궁극적인 목적으로 삼아야 함.
  2. 사용자가 인터페이스와 인터렉션하는 시간은 인터렉션할 선택지 개수와 직접적인 상관관계를 보임. 인터페이스가 복잡하게 얽혀 있으면 사용자는 선택지를 파악하고 자신의 목표와 가장 관련 있는 것을 가려내는 작업부터 해야 함.
  3. 인지 부하: 사용자는 인터페이스를 처음 접할 때 다양한 기능을 체험하고 학습한다. 그러면서 자신의 목적을 잊지 말고 가져가야 함. 이는 정신적 자원이 소모됨으로 이 정신적 자원의 양을 인지 부하라 부름.
  4. 지나친 단순화: 아이콘을 통해 의미를 전달하려고 할 때 사용자마다 해당 아이콘이 담긴 의미를 다르게 생각하면 여러 인지 부하가 생김.

카드 분류 #

Image

  1. 참가자에게 제시할 주제를 정함. 핵심 콘텐츠를 대표하는 주제를 찾아서 각기 다른 카드에 적음. 단 하나의 단어를 여러 주제에 적으면 안 됨.
  2. 주제를 정리함. 참가자는 주제를 한 번에 하나씩 차례로 그룹에 넣음. 여기서 참가자에게 자기 생각을 표출하게 유도함. 사고 과정을 통해 귀중한 통찰을 얻을 수 있음.
  3. 카테고리에 이름을 붙임. 각 그룹을 잘 설명하는 단어를 골라 그룹의 이름으로 붙임. 정보 아키텍쳐 카테고리 이름을 정하는 데도 도움이 됨.
  4. 참가자의 보고를 들음. 참가자들이 그룹을 나눈 근거를 설명하게 유도함. 왜 이런 결정을 내렸고 어떤 부분이 분류하는데 어려웠는지 분석함.

밀러의 법칙 #

Image

특징 #

  • 보통 사람들은 작업 기억에 7+(2)만 기억함.
  • ‘마법의 숫자 7’을 앞세워 불필요한 디자인 정당화하지 마라.
  • 사용자가 쉽게 처리하도록 기억할 수 있도록 콘텐츠를 덩어리로 작게 나눠 정리함.
  • 단기 기억력은 사람의 상황적 맥락, 사람에 따라 다름.

설명 #

  1. 7의 의미를 7비트가 아닌 7개의 덩어리까지 기억할 수 있다는 의미. 덩어리의 크기는 중요하지 않음.
  2. 콘텐츠를 적절한 덩어리로 나누면 도움이 됨. 대표적인 예시는 핸드폰 번호가 있음.
  3. 덩어리화는 콘텐츠 이면에 형성된 관계와 정보 체계를 이해하고자 하는 사람에게 도움이 됨.
  4. 단기 기억은 한계가 있고 정보 비트를 유의미한 덩어리로 정리하면 단기 기억을 최적화할 수 있음.

포스텔의 법칙 #

특징 #

  • 자신이 행하는 일은 엄격하게, 남의 것을 받아들일 때는 너그럽게
  • 사용자가 어떤 동작이나 입력하든지 공감하는 태도로 유연하고 관대하게 대처해야 함.
  • 인터페이스의 안정성과 접근성을 보장하되 입력, 접근성, 성능 면에서 만반의 준비를 함.
  • 다양한 기능성에 대해 잘 예측하고 대비할수록 디자인 회복탄력성은 좋아짐.

설명 #

  1. 사용자의 입력은 포맷이나 입력 메커니즘을 막론하고 무조건 수용해야 함.
  2. 기기의 크기나 기능, 입력 메커니즘, 보조 기술, 연결 속도까지 누구에게나 작동하는 인터페이스를 제공해야 함.
  3. 컴퓨터는 인간의 다양한 입력을 받아들이고 그 입력을 이해하는 데 그치지 않고 컴퓨터가 읽을 수 있는 형식으로 처리할 만큼 견고해야 함.

피크엔드 법칙 #

특징 #

  • 인간은 경험 전체의 평균이나 합계가 아니라 절정의 순간과 마지막 순간에 느낀 감정을 바탕으로 경험을 판단하는 경향이 있음.
  • 사용자 여정 중 가장 강렬한 순간과 마지막 순간에 신경을 써야 함.
  • 사용자에게 가장 도움을 주는 순간, 가장 중요하게 여기는 순간, 가장 큰 즐거움을 주는 순간 등을 알아냄.
  • 사람들은 긍정적인 순간보다 부정적인 순간을 더 잘 기억함

설명 #

  1. 긍정적이든 부정적이든 인간은 인생 경험을 포괄적인 타임라인이 아니라, 일련의 스냅 사진처럼 기억함.
  2. 감정적으로 가장 강렬한 순간과 마지막 순간의 느낌이 경험에 대한 평균값을 정할 뿐만 아니라 더 할 의향이 있는지 아니면 다른 사람에게 추천할 생각인지 정할 때도 지대한 영향을 미침.
  3. 인지 편향: 판단에 기여하는 사고나 이성에 발생하는 계통 오차를 뜻함. 상황을 철저히 분석하기보다 신속하게 결정을 내려주는 일종의 지름길. 다시 말해 의사결정을 할 때마다 철저한 분석을 바탕으로 행동하기보다 무의식적인 자동 반응으로 일을 처리하고 버거운 정신적 노동은 필요할 때만 하는 것.
  4. 확증 편향: 인간은 기존 신념을 지키기 위해 이를 지지하는 정보에만 집중하고 이에 반하는 정보는 무가치하다고 여김.
  5. 기억 편향: 자신의 감정을 자극하는 사건을 더 잘 기억함.

심미적 사용성 효과 #

특징 #

Image

  • 사용자는 보기 좋은 디자인을 사용성이 더 뛰어난 디자인으로 인식한다.
  • 보기 좋은 디자인은 뇌에 긍정적인 반응을 일으켜서 사용자로 하여금 제품이나 서비스의 사용성이 뛰어나다는 생각이 들게 한다.
  • 제품이나 서비스의 디자인이 보기 좋으면 사용자는 사소한 사용성 문제에 관대해진다.
  • 시각적으로 만족스러운 디자인은 사용성 문제를 가리고 테스트 중에 문제가 발생하는 것을 방해할 수 있다.

설명 #

  1. 인간은 자동 인지 처리를 통해 대상의 아름다움을 본능적으로 파악하는데 디지털 인터페이스를 접할 때도 마찬가지다.
  2. 외형적 사용성은 내재한 사용 편의성보다 외형적 아름다움과 더 연관이 있음.
  3. 자동 인지 처리: 모든 사물을 조심스럽게 처리하는 것은 비효율적임. 의식적으로 주의를 기울이기에 앞서 이전 기억을 바탕으로 정보를 처리하고 판단함.
  4. 디자인이 아름다우면 사용성도 더 좋게 느끼지만 사용성 문제를 간과할 가능성이 있음. 따라서 사용자가 사용할 때 의견을 경청하고 어떻게 사용하는지 지켜봐야 함.

폰 레스토프 효과 #

Image

특징 #

  • 비슷한 사물이 여러 개 있으면 그중에서 가장 차이가 큰 한 가지만 기억할 가능성이 높음.
  • 중요한 정보는 시각적으로 눈에 띄게 해야 함.
  • 시각적 요소를 강조할 때는 제약을 걸어서 각 요소 간 경쟁을 피하고 가장 중요한 항목이 광고로 오인하지 않게 해야 함.
  • 특정 요소를 강조할 때 색상에만 의존하면 색맹이나 저시력인 사용자가 배제된다는 사실을 유념해야 함.

설명 #

  1. 사용자는 시각적으로 대비되는 요소에 빠르게 주의를 뺏김. 너무 많은 대비는 어디에 집중해야 할지 모르게 만듦. 색상, 형태, 크기, 위치, 움직임 등은 주의를 빼앗기는 요소임.
  2. 인간은 다른 요소와 시각적, 개념적으로 분리된 것을 잘 기억함.
  3. 선택적 주의력: 주변 사물을 집중하는 능력은 한계와 주의 집중할 수 있는 시간적 양이 정해져 있기 때문에 우리와 관련 없는 정보는 희생함.
  4. 배너 무시: 선택적 주의력의 한 사례로 광고라고 인식하는 요소를 무시하는 경향이 있음. 그래서 최대한 중요한 기능은 광고처럼 보이게해서는 안 됨.
  5. 변화 무시: 시각적 단서가 충분하지 않거나 주의력이 다른 곳으로 분산되어 있을 때 사람들이 변화를 눈치채지 못함.
  6. 절제와 접근성: 시각적 차별화를 적용할 시점은 명확한 목적이 있을 때만 사용해야 함. 그리고 자신이 의도한 시각적 차별화가 사용자에게 어떤 영향을 미칠지 항상 생각해야 함.

테슬러의 법칙 #

특징 #

  • 복잡성의 보존 법칙이라고도 알려짐. 모든 시스템에는 더 줄일 수 없는 일정 수준의 복잡성이 존재함.
  • 모든 프로세스에는 디자인이 처리할 수 없는 일정 수준의 복잡성이 존재함. 시스템이나 사용자 중 한쪽이 감당해야 함.
  • 내재된 복잡성을 디자인과 개발 과정에서 처리하면 사용자의 부담을 최소로 줄일 수 있음.
  • 추상적으로 느껴질 정도로 인터페이스를 단순화하면 안 됨.

도허티 임계 #

특징 #

  • 컴퓨터와 사용자가 서로 기다리지 않아도 되는 속도(0.4초 이하)로 인터렉션하면 생산성이 급격하게 높아짐.
  • 사용자의 주의가 분산되는 것을 막으려면 시스템 피드백을 0.4초 이하로 지정해야 함.
  • 애니메이션은 로딩이나 프로세싱이 진행되는 동안 사람들의 시선을 끄는 하나의 방법임.

설명 #

Image

Image

Image

  1. 제품이나 서비스를 처음 로딩하는데 걸리는 시간, 인터렉션에 반응해 피드백을 제공한 속도, 다음 페이지를 로딩하는 데 걸린 시간 등 시스템 반응 속도는 사용자 경험에 큰 영향을 미침.
  2. 반응이 즉각적이다고 느끼려면 0.1초 이하, 맨눈으로 관찰할 수 있는 반응은 0.1초에서 0.3초 이하임. 이는 해당 시스템이 자신의 통제에서 벗어나고 있다고 느낌. 그 이외의 시간은 사용자의 주의력을 상실시킴.
  3. 블러 업: 로딩 시간을 최적화시킴. 이미지가 웹, 앱을 느리게 하는 주범이라는 점에서 착안해서 이미지에 집중시킴.
  4. 로딩 표시줄: 사용자가 관대하게 받아들임. 요청한 작업이 처리되고 있고 사용자가 기다리는 동안 볼거리를 제공함.

참고도서 #

  • UX/UI의 10가지 심리학 법칙 / 존 아블론스키 지음 / 이미령 옮김
0.0.1_20240214_1_v81