top of page

ux/ui의 10가지 심리학 법칙


 

UX/UI디자인에 대해 잘 알지는 못하지만 막연히 배워보고 싶다, 알아보고 싶다는 생각이 들어 관련 도서부터 찾아보게 되었다. UX디자인 수업을 듣고 싶지만 들을 수 있을지 미지수인 상황에서 강의계획서에 있는 추천도서 중 가장 먼저 접하게 된 책은 존 야블론스키의 <UX/UI의 10가지 심리학 법칙> 이다.

제목에 충실하게, 말그대로 10가지 심리학 법칙에 입각하여 사용자 친화적 인터페이스를 디자인한 사례를 소개한 이 책은 UX/UI에 대해 문외한인 나에게 일종의 감을 주었다.



1. 제이콥의 법칙

사용자는 여러 사이트에서 대부분의 시간을 보낸다. 그래서 여러분의 사이트도 자신이 이미 알고 있는 다른 사이트들과 같은 방식으로 작동하길 원한다.

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

  • 기존의 멘탈 모델을 활용하면 사용자가 새 모델을 익히지 않아도 바로 작업에 돌입할 수 있는 뛰어난 사용자 경험이 완성된다.

  • 변화를 꾀할 때는, 사용자에게 익숙한 모델을 한시적으로 이용할 권한을 부여해서 불협화음을 최소화하라.

  • 멘탈 모델 부조화 사례: 스냅챗의 2018년 리디자인

2. 피츠의 법칙

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

  • 터치 대상의 크기는 사용자가 정확하게 선택할 수 있을 정도로 충분히 커야 한다.

  • 터치 대상 사이에 충분한 거리를 확보해야 한다.

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

  • 사례: 폼 텍스트 레이블, 폼 전송 버튼의 위치

3. 힉의 법칙

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

  • 의사결정 시간이 반응 시간에 큰 영향을 받을 때는 선택지의 개수를 최소화하라.

  • 인지 부하를 줄이려면 복잡한 작업을 잘게 나눠라.

  • 추천 선택지를 강조해서 사용자의 부담을 줄여라.

  • 신규 사용자의 인지 부하를 줄이려면 온보딩을 점진적으로 진행하라.

  • 추상적이라고 느껴질 정도로 단순화하지 않도록 주의하라.

  • 사례: TV리모콘의 인터페이스 단순화, 슬랙의 점진적인 온보딩 절차

4. 밀러의 법칙

보통 사람은 작업 기억에 7(+-2)개의 항목밖에 저장하지 못한다.

  • "마법의 숫자7"을 내세워서 불필요한 디자인 제약을 정당화하지 마라.

  • 사용자가 쉽게 처리하고 이해하고 기억할 수 있게 콘텐츠 덩어리를 작게 나눠 정리하자.

  • 단기 기억 용량은 사람에 따라, 그리고 기존 지식과 상황적 맥락에 따라 달라진다는 것을 기억하자.

  • 사례: 덩어리화- 전화번호 구성 방식, 뉴스 헤드라인, 웹사이트

5. 포스텔의 법칙

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

  • 사용자가 어떤 동작이나 입력을 하든지 공감하는 태도로 유연하고 관대하게 대처해라.

  • 인터페이스의 안전성과 접근성을 보장하되, 입력, 접근성, 성능 면에서 만반의 준비를 하자.

  • 다양한 가능성에 대해 잘 예측하고 대비할수록 디자인 회복탄력성은 좋아진다.

  • 사용자의 가변적인 입력을 수용해서 기계가 이해할 수 있는 방식으로 해석하라. 입력의 한계를 정의하고 사용자에게 명확한 피드백을 제공하라.

  • 사례: 입력 폼(HCI 철학과 유사한 방식으로 )- 정보의 양을 보수적으로, 페이스아이디- 비밀번호 / ID없이 잠금해제 가능, '반응형 웹디자인', 아마존닷컴- 글꼴 크기 수정 적응

6. 피크엔드 법칙

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

  • 사용자 여정 중 가장 강렬한 순간과 마지막 순간을 세심하게 신경 쓰자.

  • 제품이 사용자에게 가장 큰 도움을 주는 순간, 혹은 가장 중요하게 여겨지는 순간, 가장 큰 즐거움을 주는 순간 등을 알아내라.

  • 사람들은 긍정적인 순간보다 부정적인 순간을 더 생생하게 기억한다는 사실을 명심하자.

  • 사례: 메일침프(Mailchimp), 우버 익스프레스 풀- 대기시간에 대한 거부감 해소,

  • 여정지도 ( 렌즈 - 경험 - 통찰 )

7. 심미적 사용성 효과

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

  • 보기 좋은 디자인은 인간의 뇌에 긍정적 반응을 일으켜서 사용자로 하여금 제품이나 서비스의 사용성이 뛰어나다는 생각이 들게 한다.

  • 제품이나 서비스의 디자인이 보기 좋으면, 사용자는 사소한 사용성 문제에 비교적 관대해진다.

  • 시각적으로 만족스러운 디자인은 사용성 문제를 가리고 사용성 테스트 중에 문제가 드러나는 것을 방해할 수 있다.

  • 사례: 브라운 (Braun) -> 애플에 영향 (미니멀리즘의 미학)

8. 폰 레스토프 효과

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

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

  • 시각적 요소를 강조할 때는 제한을 두어서, 각 요소 간 경쟁을 피하고 가장 중요한 항목이 광고로 오인되지 않게 하라.

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

  • 움직임을 활용하여 대비를 전달할 때는 움직임에 민감한 사용자를 주의 깊게 고려하라.

  • 사례: Dropbox- 추천하는 요금제 강조, 뉴스- 추천 콘텐츠 크기 키워 강조

9. 테슬러의 법칙

복잡성 보존의 법칙이라고도 알려진 테슬러의 법칙에 따르면, 모든 시스템에는 더 줄일 수 없는 일정 수준의 복잡성이 존재한다.

  • 모든 프로세스에는 디자인 시 처리할 수 없는 기본적인 복잡성이 존재하므로, 시스템이나 사용자 중 한쪽이 감당해야 한다.

  • 내재된 복잡성을 디자인과 개발 과정에서 처리하면 사용자의 부담을 최소로 줄일 수 있다.

  • 추상적으로 느껴질 정도로 인터페이스를 단순화해서는 안된다.

  • 사례: 메일- 보내는/받는 사람 필수. 그러나 맥락에 맞는 간단한 답변 몇 가지를 제안하는 스마트답장 기능도 있음., 유비쿼터스 결제 프로세스/ 애플 페이 - 결제 단순화, 주소 자동화 등. 아마존 고 - 매장을 나서면 아마존 고 앱 계정에서 자동 결제

10. 도허티 임계

컴퓨터와 사용자가 서로를 기다리지 않아도 되는 속도(0.4초 이내)로 인터렉션하면 생산성은 급격히 높아진다.

  • 사용자의 주의가 분산되는 것을 막는 동시에 생산성도 향상시키려면 시스템 피드백을 0.4초 이내에 제공하라.

  • 반응 시간을 개선하고 체감 대기 시간을 줄이려면 체감 성능을 활용하라.

  • 애니메이션은 로딩이나 프로세싱이 진행되는 동안 사람들의 시선을 끄는 한 가지 방법이다.

  • 설사 정확하지 않다고 해도 진행표시줄을 보여주면 사용자는 대기시간에 좀 더 관대해진다.

  • 실제 작업이 훨씬 빨리 완료되더라도, 의도적으로 작업 완료를 늦게 알리면 체감 가치를 높이고 신뢰를 형성하는 데 도움이 되기도 한다.(페이스북 보안 점검 프로세스- 스캔이 철저하게 이루어진다는 신뢰 심어줌)

  • 사례: 뼈대 화면, 블러 업, 진행표시줄, 인스타그램 - 게시가 완료되기 전 사진에 대한 댓글 표시(빠르게 반응하는 것처럼 보임)

11. 힘에는 책임이 따른다

기술이 인간의 마음에 영향을 끼치는 사례

  • 간헐적이고 불규칙한 보상 - 행동 형성

  • 무한 루프 ( 다음 콘텐츠 자동 로딩, 재생 등 ) - 사이트 체류 시간 증가

  • 사회적 확증 - 좋아요, 긍정 댓글

  • 기본 설정 - 사용자들이 잘 바꾸지 않음

  • 방해 요소 제거 - 아마존 대시: 웹사이트나 앱 방문 없이 버튼눌러 자주 사용하는 제품 구매, 습관 형성

  • 호혜성 - 보답심리로 체류시간 증가

  • 다크패턴- 필요이상 구매, 불필요한 정보 공유 등 의도치 않은 행동 유도(ex. 재고 상태 표시)

"기술로 인한 윤리적 책임"이 중요하다. 기업의 목표와 최종 사용자인 인간의 목표는 대체로 일치하지 않으므로 디자이너가 이 둘을 연결하는 역할을 해야 한다. 그 방법들은 다음과 같다.

  • 행복 경로를 뛰어넘어 생각하라.

  • 다양한 팀 구성원과 사고방식을 가져라.

  • 데이터 너머를 보라.

사람들의 삶에 긍정적인 영향을 미치도록 사용자와 대화를 나누고 정성적 피드백을 얻으며 책임감 있게 디자인 업무를 수행해야 한다.

최근 게시물

전체 보기

그림으로 이해하는 비전공자를 위한 딥러닝

윤준호 저 딥러닝에 대한 도서를 접하고 싶어 도서관에 갔는데 원하던 책이 없어 대신 고르게 된 책이었다. 아직 머신러닝과 딥러닝, 인공지능에 대한 정확한 개념을 알지 못하여 관련 개념에 입문을 할 도서를 찾던 도중 쉽고 이해가 잘 되게 설명한 이...

Comentarios


bottom of page