본문 바로가기
Kor/UX&UI

[UI/UX] (5)일관성 및 표준 - Consistency and standards

by PD Miles 2019. 12. 1.
반응형

 

 

일관성 및 표준

사용자 인터페이스 디자인에 대한 10 가지 휴리스틱 중 하나는 일관성을 유지하고 표준을 준수하는 것이다.

 

이 주제의 내용을 간단하게 설명하자면 사용자가 인터페이스를 예측하고 학습할 수 있도록 하는 것이다.

사용자가 인터페이스를 경험하면서 다른 단어, 상징, 상황 또는 행동이 같은 것을 의미하는지 궁금해 할 필요가 없게 만들어야 한다.

 

UX 디자인에는 내부 일관성과 외부 일관성이라는 두가지 유형의 일관성이 적용된다

 


내부일관성이란?

내부 일관성은 제품이나 제품군 내에서 일관성을 유지하는 것을 말합니다.

예를 들어, 시각 디자이너가 특정 주황색 음영을 사용하여 콜 투 액션 버튼과 같은 실행 가능한 요소를 강조하기로 결정했을 수 있다.

 

Call to Action 버튼을 주황색으로 통일

 

그러다가 갑자기 제목 요소를 강조하기 위해 콜 투 액션과 같은 주황색을 사용하기로 결정한 경우, 내부 일관성이 손상될 수 있다.

 

강조를 위해 Call to Action 버튼과 같은 색을 사용하면 일관성이 흐트러진다.

 

왜냐하면 이미 콜 투 액션에 쓰기로 정해진 주황색의 확립된 의미를 위반하기 때문이다.

내부적으로 확립된 의미가 위반되는 순간 사용자는 인터페이스의 어떤 요소가 실행 가능한지 결정하는데 혼란을 겪을 수 있다.

 


외부일관성이란?

외부 일관성은 제품 외부의 일관성을 유지하는 것을 말한다.

당신은 회사에서 UI/UX 규칙을 정했거나, Material design이나 HIG 혹은 그 외의 것들처럼 일반적인 UI/UX 규칙을 사용 했을 수 있다.

 

예를 들어 대부분의 전자 상거래 사이트에는 카트 기능이 있다.

사람들은 전자 상거래 사이트를 사용할 때마다 카트 기능을 볼 수 있기 때문에 이 기능에 익숙하다.

많이 쓰고 많이 보기 때문에 해당 기능의 작동 방식과 배치되어 있는 위치에 대한 예상(일반적으로 화면의 오른쪽 상단에 위치한다.)을 가지고 있다.

 

카트 모양의 장바구니 기능

 

장바구니 모양의 장바구니 기능

 

 

Jakob의 법칙에 따르면 "사람들은 대부분의 시간을 당신의 서비스 이외의 장소에서 보낸다."라고 이야기한다.

그 말인 즉, 다른 서비스가 일관된 규칙을 따를 때, 당신의 서비스가 해당 규칙을 위반하는 경우,

사용자들에게는 새로운 것을 배우도록 강요하게 되는 것이다.

(예시로 올해 초에 카카오톡의 업데이트 이후 최근사진과 과거 사진의 방향이 반대로 설정되어서 많은 불편을 야기했던 적이 있었다.)

 

때로는 이렇게 새로운 것을 배우도록 강요하는 것이 좋을수도 있다. 물론 당신이 새롭고 더 나은 패턴을 알아 냈다면 말이다.

 

사용자들은 새로운 것을 배울 때마다 인지 부하가 추가되는 것을 기억해야한다,

따라서 꼭 필요한 경우에만 수행해야 한다.

 

대부분의 경우, 내부와 외부 일관성을 유지하는 것이 가장 좋다.

일관성이 유지된다면 당신의 제품에 대한 사용자의 학습도가 향상될 것이다.

반응형