UX 디자인을 위한 사용성 휴리스틱(heuristics) 10가지

 

닐슨 노먼 그룹 제이콥 닐슨의 인터랙션 디자인을 위한 10가지 일반적인 원칙

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

 

요약: 인터랙션 디자인을 위한 제이콥 닐슨의 10가지 일반적인 원칙입니다. 원칙들은 특정한 사용성 지침이 아니라 광범위한 경험 법칙이기 때문에, "휴리스틱" 이라고 부릅니다.

 

제이콥 닐슨

1994년 4월 24일 작성, 2020년 11월 15일 업데이트

 

#1: 시스템 상태를 보여주십시오

디자인은 항상 적절한 시간 내에 적절한 피드백을 통해, 진행 상황에 대한 정보를 사용자에게 제공해야 합니다.

사용자가 현재 시스템 상태를 알면, 이전 인터랙션의 결과를 알게되고 다음 단계를 결정합니다. 예측 가능한 인터랙션은 브랜드뿐만 아니라 제품에도 신뢰를 부여합니다.

 

#1번째 사용성 휴리스틱의 예:

쇼핑몰 맵의 "현재 위치" 표시기는 사람들이 다음에 어디로 가야할지 이해하는데 도움을 주기 위해, 현재 어디에 있는지 보여줘야 합니다. 

 

팁

- 시스템 상태를 사용자에게 명확하게 전달하세요. 사용자에게 알리지 않고 영향을 미치는 조치를 취하면 안됩니다.

- 사용자에게 최대한 신속하게 피드백을 제공합니다 (즉시가 이상적임).

- 개방적이고 지속적인 커뮤니케이션을 통해 신뢰를 구축합니다.

 

더 배우기

- 전체 기사: 시스템 상태의 가시성

- 가시성 휴리스틱에 대한 3분 동영상

 

 

#2: 시스템과 실제 세계를 일치하세요.

디자인은 사용자의 언어로 말해야 합니다. 내부 전문용어 대신 사용자에게 익숙한 단어, 구와 개념을 사용하세요. 정보를 자연스럽고 논리적인 순서로 표시하면서, 실제 관례를 따르십시오.

 

디자인 방법은 특정 사용자에 따라 매우 달라집니다. 사용자와 동료에게 완벽하게 분명한 용어, 개념, 아이콘과 이미지는 사용자에게 낯설거나 혼동될 수 있습니다.

 

디자인 제어가 실제 관례에 따르고 원하는 결과(자연스러운 대응)과 일치하면, 사용자는 인터페이스의 작동 방식을 배우고 기억하기가 더 쉽습니다. 이것은 직관적인 느낌을 주는 경험을 쌓는데 도움이 됩니다.

 

#2번째 사용성 휴리스틱의 예:

가스레인지 제어기가 가열 요소의 레이아웃과 일치하면, 사용자는 어떤 제어기가 어떤 가열 요소에 해당되는지 빠르게 이해할 수 있습니다.

 

팁

- 사용자가 단어의 정의를 찾지 않아도 의미를 이해할 수 있도록 합니다.

- 단어나 개념에 대한 이해가 사용자의 이해와 일치한다고 추정하지 마세요.

- 사용자 조사는 사용자에게 익숙한 용어와 중요한 개념에 대한 멘탈 모델을 파악하는 데 도움이 됩니다.

 

더 배우기

- 전체 기사: 시스템과 실제 세계를 일치하세요

- 2분 동영상: 시스템과 실제 세계를 일치하세요

 

 

 

#3: 사용자 제어와 자유도

사용자가 실수로 작업하는 경우가 많습니다. 그들에게는 긴 과정을 거치지 않고 원치 않는 행동을 끝내기 위해 명확하게 표시된 "비상구"가 필요합니다.

 

사람들이 절차에서 물러서거나 행동을 취소하는 것이 쉬울 때, 자유와 자신감이 늘어납니다. 출구를 통해 사용자가 시스템을 제어해서 막히거나 좌절하지 않게 할 수 있습니다.

 

 

#3번째 사용성 휴리스틱의 예:

디지털 공간에는 물리적 공간처럼 신속한 "비상구"가 필요합니다.

 

팁

- 실행 취소와 다시 실행을 지원하세요.

- 취소 버튼처럼 현재 인터랙션을 종료할 수 있는 명확한 방법을 보여주세요.

- 종료 기능에 라벨이 부착되어 있고 찾을 수 있는지 확인하십시오.

 

더 배우기

- 전체 기사: 사용자 제어와 자유도

- 2분 동영상: 사용자 제어와 자유도

 

 

#4: 일관성과 표준

사용자는 다른 단어, 상황이나 행동이 같은 것을 의미하는지 궁금해할 필요가 없습니다. 플랫폼과 업계는 규칙을 따라야 합니다.

 

제이콥의 법칙은 사람들이 대부분의 시간을 당신의 제품이 아닌 다른 디지털 제품을 사용하는 데 보낸다고 말합니다. 이러한 다른 제품에 대한 사용자의 경험으로 기대가 형성됩니다. 일관성을 유지하지 못하면, 사용자가 새로운 것을 학습하도록 강요하게 되어 사용자의 인지 부하가 증가할 수 있습니다.

 

#4번째 사용성 휴리스틱의 예:

체크인 카운터는 일반적으로 호텔 앞쪽에 있습니다. 이러한 일관성은 고객의 기대를 충족시킵니다.

 

팁

- 내부와 외부 두 가지 유형의 일관성을 유지하면 학습 능력이 향상됩니다.

- 단일 제품 또는 제품군 내에서 일관성을 유지합니다 (내부 일관성).

- 정해진 업계 관습 (외부 일관성) 을 따릅니다.

 

더 배우기

- 전체 기사: 일관성과 표준

- 3분 동영상: 일관성과 표준

 

 

#5: 오류 방지

좋은 오류 메시지도 중요하지만, 가장 좋은 디자인은 초기에 문제가 발생하지 않도록 주의 깊게 예방해야 합니다. 오류가 발생하기 쉬운 조건을 제거하거나, 오류를 확인하고 사용자가 작업을 수행하기 전에 확인 옵션을 제시하세요.

 

오류에는 두 가지 종류가 있습니다: 우연과 실수. 우연은 부주의로 인한 무의식적인 오류입니다. 오류는 사용자의 멘탈 모델과 디자인 간의 불일치에 기초한 의식적인 오류입니다.

 

#5번째 사용성 휴리스틱의 예:

커브가 많은 산길의 가드 레일은 운전자가 절벽에서 떨어지지 않게 막습니다.

 

팁

- 노력 우선순위: 비용이 많이 드는 오류를 먼저 방지한 다음에, 적은 좌절감을 방지하십시오.

- 유용한 제한과 좋은 기본값을 제공하여 실수하지 않게 합니다.

- 메모리 부담을 없애고 실행 취소를 지원하며 사용자에게 경고하여 오류를 방지합니다.

 

더 배우기

- 전체 기사: 사용자 오류 방지

- 3분 동영상: 오류 방지

 

 

#6: 기억보다 인식을 활용합니다.

요소, 작업과 옵션을 표시하여 사용자의 기억 부하를 최소화합니다. 사용자는 인터페이스의 한 부분에서 다른 부분으로 정보를 기억할 필요가 없습니다. 디자인을 사용하는데 필요한 정보 (예: 필드 라벨이나 메뉴 항목) 는 필요할 때 쉽게 찾거나 볼 수 있어야 합니다.

 

인간은 제한된 단기 기억을 가지고 있습니다. 인식을 촉진하는 인터페이스는 사용자에게 필요한 인지 노력을 줄입니다.

 

#6번째 사용성 휴리스틱의 예:

대부분의 사람들이 국가의 수도를 기억하는 것보다, 알아보는게 더 쉽습니다. 사람들은 리스본이 포르투갈의 수도라는 질문에 더 정확하게 대답할 가능성이 높습니다. 포르투갈의 수도가 어디지요? 라는 질문보다 낫습니다.

 

팁

- 사람들이 정보를 기억할 필요 ("호출") 없이 인터페이스로 인식할 수 있도록 합니다.

- 사용자에게 외울 수 있는 긴 설명서를 제공하는 대신, 상황에 맞는 도움말을 제공합니다.

- 사용자가 기억해야 하는 정보를 줄입니다.

 

더 배우기

- 전체 기사: UX에서의 인식 대 기억

- 3분 동영상: 인식 대 기억

 

#7: 유연성과 효율성

초보 사용자에게는 보이지 않는 바로 가기는 미숙한 사용자와 숙련된 사용자 모두에게 적합하도록 디자인이 전문가 사용자의 상호 작용을 가속화할 수 있습니다. 사용자가 자주 수행하는 작업을 조정하게 해줍니다.

 

유연한 과정은 다양한 방법으로 수행될 수 있으므로, 사람들은 자신에게 맞는 어떤 방법이든 선택할 수 있습니다.

#7번째 사용성 휴리스틱의 예:

일반 경로는 지도에 표시되지만, 지역에 대한 지식이 더 많은 주민은 지름길로 갈 수 있습니다.

 

팁

- 바로 가기 단축키와 터치 동작 같은 가속기를 제공합니다.

- 개별 사용자에 대한 콘텐츠와 기능을 맞춤화하여 개인화를 제공합니다.

- 사용자가 제품의 작동 방식을 선택할 수 있도록, 사용자 지정을 허용합니다.

 

더 배우기

- 전체 기사: 유연성과 효율성

- 3분 동영상: 유연성과 효율성

 

 

#8: 미적이고 간결한 디자인

인터페이스는 관련이 없거나 거의 필요하지 않은 정보를 포함해서는 안됩니다. 인터페이스의 모든 추가 정보 단위는 관련 정보 단위와 경쟁하고 상대적인 가시성을 감소시킵니다.

 

이러한 경험적 접근은 플랫 디자인을 사용해야 한다는 것을 의미하는 것이 아닙니다. 컨텐츠와 시각 디자인을 필수 요소에 초점을 맞추도록 하는 것입니다. 인터페이스의 시각적 요소가 사용자의 기본 목표를 지원하는지 확인합니다.

 

#8번째 사용성 휴리스틱의 예:

화려한 주전자는 손잡이가 불편하거나 노즐을 세척하기 어려운 등 사용성에 방해가 될 수 있는 과도한 장식이 있을 수 있습니다.

 

팁

- 사용자 인터페이스 컨텐츠와 시각 디자인을 필수 요소에 초점을 맞춥니다.

- 불필요한 요소가 사용자에게 필요한 정보로부터 사용자의 주의를 분산시키지 않도록 합니다.

- 주요 목표를 지원하기 위해 콘텐츠와 기능의 우선 순위를 지정합니다.

 

더 배우기

- 3분 동영상: 미적이고 간결한 디자인

 

 

#9: 사용자가 오류를 인식, 진단 및 복구할 수 있도록 지원하세요.

오류 메시지를 일반 언어 (오류 코드 없음) 로 표시하고, 문제를 정확하게 나타내며 건설적으로 해결책을 제시해야 합니다.

 

오류 메시지는 사용자가 이를 인식하고 인지하는데 도움이 되는 시각적인 방법과 함께 제공되어야 합니다.

 

 

 

#9번째 사용성 휴리스틱의 예:

도로의 진입 금지 표지판은 운전자들에게 잘못된 방향으로 가고 있다는 것을 알려주고, 멈추라고 요구합니다.

 

팁

- 오류 메시지에 전통적인 시각 요소 (예: 굵고 빨간 텍스트) 를 사용합니다.

- 사용자가 이해할 수 있는 언어로 무엇이 잘못되었는지를 설명합니다. 전문 용어는 피하십시오.

- 오류를 즉시 해결할 수 있는 바로 가기 같은 해결책을 사용자에게 제공합니다.

 

더 배우기

- 2분 동영상: 사용자가 오류를 극복하록 지원하기

 

 

#10: 도움말과 문서

시스템에는 추가 설명이 필요 없는 것이 가장 좋습니다. 그러나 사용자가 작업을 완료하는 방법을 이해하는데 도움이 되는 문서를 제공해야 할 수도 있습니다.

 

도움말과 문서 내용은 검색하기 쉽고 사용자의 작업에 집중해야 합니다. 간결하게 유지하고 수행해야 하는 구체적인 단계를 나열하십시오.

 

 

 

#10번째 사용성 휴리스틱의 예:

공항의 정보 키오스크는 쉽게 알아볼 수 있으며, 상황에 속한 고객의 문제를 즉시 해결합니다.

 

팁

- 도움말 문서를 쉽게 검색할 수 있도록 합니다.

- 가능하다면, 사용자가 문서를 필요로 하는 시점에 문서를 상황별로 제시합니다.

- 수행할 구체적인 단계를 나열합니다.

 

더 배우기

- 전체 기사: 도움말과 문서

- 3분 동영상: 도움말과 문서

 

 

제이콥 닐슨의 언급

저는 원래 1990년에 롤프 모리치(Rolf Molich)와 협력하여 휴리스틱 평가를 위한 휴리스틱을 개발했습니다. 4년 후, 저는 249개의 사용성 문제에 대한 요인 분석을 기반으로 휴리스틱을 개선했습니다. 최대한의 설명으로 일련의 휴리스틱을 도출했고, 그 결과로 휴리스틱을 개정했습니다.

 

2020년에 우리는 이 기사를 업데이트하여 더 많은 설명, 예제, 관련 링크를 추가하였습니다. 우리가 정의된 언어를 약간 다듬는 동안, 10가지 휴리스틱 자체는 1994년 이후로 적절하고 변하지 않았습니다. 26년 동안 어떤 것이 사실이라면, 그것은 미래 세대의 사용자 인터페이스에도 적용될 것입니다.

 

출처: 닐슨 노먼 그룹