Sign In

사용자 인터페이스 디자인을 위한 10가지 사용성 휴리스틱

BBO
  1. Translated Article
제이콥 닐슨의 인터렉션 디자인을 위한 10가지 일반 원칙
구체적인 사용성 가이드라인이 아닌 일반적인 경험 법칙이기 때문에, "휴리스틱"이라고 불립니다.

1. 시스템 상태의 가시성

•
디자인은 적절한 시간 내에 적절한 피드백을 통해
사용자에게 무슨 일이 일어나고 있는지 항상 알려야 합니다.
•
예시
◦
쇼핑몰 지도의 '당신이 여기에 있습니다' 표시기는
사람들이 현재 어디에 있는지 보여주어 다음에 어디로 가야 할지 이해하는 데 도움을 줍니다.
•
팁
◦
사용자에게 시스템 상태를 명확하게 전달하세요.
사용자에게 알리지 않고는 결과를 초래할 수 있는 어떠한 조치도 취해서는 안 됩니다.
◦
가능한 한 빨리(이상적으로는 즉시) 사용자에게 피드백을 제공합니다.
◦
개방적이고 지속적인 의사소통을 통해 신뢰를 구축하세요.

2. 시스템과 현실 세계의 일치

•
디자인은 사용자의 언어로 표현되어야 합니다.
내부 전문 용어보다는 사용자에게 친숙한 단어, 구문, 개념을 사용하세요.
실제 관례를 따라 정보를 자연스럽고 논리적인 순서로 표현하세요.
•
디자인의 컨트롤이 실제 세계의 관습을 따르고 원하는 결과와 일치할 때(자연스러운 매핑),
사용자는 인터페이스 작동 방식을 더 쉽게 배우고 기억할 수 있습니다.
이는 직관적인 사용자 경험을 구축하는 데 도움이 됩니다.
•
예시
◦
스토브(가스레인지) 상단 제어 장치가 가열 요소(버너)의 레이아웃(위치)과 일치하면
사용자는 어떤 제어 장치가 어떤 가열 요소에 매핑되는지 빠르게 이해할 수 있습니다.
•
팁
◦
사용자가 단어의 정의를 찾아보지 않고도 의미를 이해할 수 있도록 하세요.
◦
사용자가 이해하는 단어나 개념이 자신이 이해하는 단어나 개념과 일치할 것이라고 가정하지 마세요.
◦
사용자 조사를 통해 사용자에게 친숙한 용어는 물론, 중요한 개념에 대한 사용자의 정신 모델도 파악할 수 있습니다.

3. 사용자 제어 및 자유

•
사용자는 종종 실수로 작업을 수행합니다.
따라서 불필요한 작업을 처리하기 위해 긴 과정을 거치지 않고도
원치 않는 작업을 중단할 수 있는 명확하게 표시된 "비상구"가 필요합니다.
•
사람들이 프로세스에서 쉽게 빠져나오거나 작업을 취소할 수 있을 때, 자유와 자신감이 생깁니다.
종료 기능을 통해 사용자는 시스템을 계속 제어할 수 있고, 막히거나 좌절감을 느끼는 것을 피할 수 있습니다.
•
예시
◦
디지털 공간에도 물리적 공간과 마찬가지로 빠른 비상구가 필요합니다.
•
팁
◦
실행 취소 및 다시 실행을 지원합니다.
◦
취소 버튼과 같이 현재 상호작용을 종료하는 명확한 방법을 보여줍니다.
◦
출구에 명확한 라벨이 붙어 있고 쉽게 찾을 수 있는지 확인하세요.

4. 일관성과 표준

•
사용자는 서로 다른 언어, 상황 또는 동작이 같은 의미를 갖는지 궁금해할 필요가 없습니다.
플랫폼 및 업계 관례를 따르세요.
•
제이콥의 법칙에 따르면 사람들은 대부분의 시간을 다른 디지털 제품을 사용하는 데 소비합니다.
다른 제품 사용 경험은 사용자의 기대치를 결정합니다. 일관성을 유지하지 못하면
새로운 것을 배우도록 강요하여 사용자의 인지 부하를 증가시킬 수 있습니다.
•
예시
◦
체크인 카운터는 일반적으로 호텔 앞쪽에 있습니다. 이러한 일관성은 고객의 기대를 충족합니다.
•
팁
◦
내부적, 외부적 일관성을 모두 유지하여 학습성을 개선합니다.
◦
단일 제품 또는 제품군 내에서 일관성을 유지합니다.(내부 일관성)
◦
기존 산업 관례를 따릅니다.(외부 일관성)

5. 오류 방지

•
좋은 오류 메시지는 중요하지만, 최고의 디자인은 애초에 문제 발생을 예방하는 데 중점을 둡니다.
오류가 발생하기 쉬운 조건을 제거하거나, 오류를 확인하고 사용자가 작업을 실행하기 전에 확인 옵션을 제공하세요.
•
오류에는 실수(slips)와 실수(mistakes) 두 가지 유형이 있습니다.
실수는 부주의에 인해 발생하는 무의식적인 오류입니다.
실수는 사용자의 멘탈 모델과 디자인 간의 불일치로 인해 발생하는 의식적인 오류입니다.
•
예시
◦
구불구불한 산길에 가드
•
팁
◦
노력의 우선순위를 정하세요. 먼저 비용이 많이 드는 실수를 예방하고, 그 다음에 사소한 좌절을 예방하세요.
◦
유용한 제약 조건과 적절한 기본값을 제공하여 실수를 방지하세요.
◦
메모리 부담을 제거하고, 실행 취소를 지원하고, 사용자에게 경고하여 실수를 방지 하세요.

6. 기억보다는 인식

•
요소, 동작, 옵션을 눈에 띄게 표시하여 사용자의 기억 부담을 최소화하세요.
사용자는 인터페이스의 한 부분에서 다른 부분으로 이동하며 정보를 일일이 기억할 필요가 없어야 합니다.
디자인 사용에 필요한 정보(예:필드 레이블이나 메뉴 항목)는 필요할 때 눈에 띄거나 쉽게 찾을 수 있어야 합니다.
•
인간의 단기 기억력은 제한적입니다.
인식을 촉진하는 인터페이스는 사용자에게 필요한 인지적 노력을 줄여줍니다.
•
예시
◦
대부분의 사람들은 국가의 수도를 기억하는 것보다 인식하는 것이 더 쉽습니다.
사람들은 "포르투갈의 수도는 어디인가요?"라는 질문보다
"리스본이 포르투갈의 수도인가요?"라는 질문이 더 쉽습니다.

7. 사용의 유연성 및 효율성

•
초보자에게 보이지 않는 단축키는 숙련된 사용자의 상호작용 속도를 높여
경험이 부족한 사용자와 숙련된 사용자 모두를 만족시킬 수 있도록 디자인되었습니다.
사용자가 자주 사용하는 동작을 맞춤 설정할 수 있도록 하세요.
•
유연한 프로세스는 다양한 방식으로 수행될 수 있으므로,
사람들은 자신에게 적합한 방법을 선택할 수 있습니다.
•
예시
◦
일반적인 경로는 지도에 표시되어 있지만,
해당 지역에 대한 지식이 있는 현지인은 지름길을 이용할 수 있습니다.
•
팁
◦
키보드 단축키, 터치 제스처 등의 가속 기능을 제공합니다.
◦
각 사용자에게 맞게 콘텐츠와 기능을 맞춤화하여 개인화를 제공합니다.
◦
사용자 정의가 가능 하므로 사용자는 원하는 대로 제품을 작동시킬 수 있습니다.

8. 미적이고 미니멀한 디자인

•
인터페이스에는 관련성이 없거나 거의 필요하지 않은 정보가 포함되어서는 안 됩니다.
인터페이스에 추가되는 모든 정보 단위는 관련 정보 단위와 경쟁하여 상대적인 가시성을 떨어뜨립니다.
•
이 경험적 원칙은 플랫 디자인을 꼭 사용해야 한다는 것을 의미하지 않습니다.
콘텐츠와 시각적 디자인이 핵심에 집중되도록 하는 것입니다.
인터페이스의 시각적 요소가 사용자의 주요 목표를 지원하는지 확인하세요.
•
예시
◦
화려한 주전자에는 사용하기 불편한 손잡이나 씻기 어려운 노즐 등
과도한 장식 요소가 있을 수 있으며, 이는 사용성을 방해할 수 있습니다.
•
팁
◦
UI의 콘텐츠와 시각적 디자인을 필수 요소에 집중 하세요.
◦
불필요한 요소로 인해 사용자가 실제로 필요한 정보를 놓치는 일이 없도록 하세요.
◦
주요 목표를 지원하기 위해 콘텐츠와 기능의 우선순위를 정합니다.

9. 사용자가 오류를 인식하고 진단하고 복구하도록 지원

•
오류 메시지는 일반 언어로 표현되어야 하며(오류 코드가 없어야 함),
문제를 정확하게 나타내야 하며, 건설적으로 해결책을 제안해야 합니다.
이러한 오류 메시지는 사용자가 알아차리고 인식할 수 있도록 시각적으로 표현되어야 합니다.
•
예시
◦
도로 위의 역방향 표지판은 운전자에게 잘못된 방향으로 가고 있음을 상기시키고 멈추라고 요청합니다.
•
팁
◦
굵은 빨간색 텍스트와 같은 전통적인 오류 메시지 시각적 표현을 사용하세요.
◦
사용자에게 문제가 무엇인지 그들이 이해할 수 있는 언어로 알려주세요. 기술적인 전문 용어는 피하세요.
◦
사용자에게 오류를 즉시 해결할 수 있는 바로가기 등의 솔루션을 제공합니다.

10. 도움말 및 문서

•
시스템에 추가 설명이 필요하지 않은 것이 가장 좋습니다.
하지만 사용자가 작업 완료 방법을 이해하는 데 도움이 되는 설명서를 제공해야 할 수도 있습니다.
•
도움말 및 문서 콘텐츠는 검색하기 쉽고 사용자의 작업에 초점을 맞춰야 합니다.
간결하게 작성하고, 수행해야 할 구체적인 단계를 나열하세요.
•
예시
◦
공항의 정보 키오스크는 쉽게 인식할 수 있으며 고객의 문제를 상황에 맞게 즉시 해결해줍니다.
•
팁
◦
도움말 문서를 쉽게 검색 할 수 있도록 하세요.
◦
가능하다면 사용자에게 필요한 바로 그 순간에 상황에 맞는 문서를 제공하세요.
◦
수행할 구체적인 단계를 나열하세요.
출처
10 Usability Heuristics for User Interface Design
what_the_bbo
Subscribe to 'what_the_bbo'
Subscribe to my site to be the first to receive notifications and emails about the latest updates, including new posts.
Join Slashpage and subscribe to 'what_the_bbo'!
Subscribe
👍
Open channel