brunch

You can make anything
by writing

C.S.Lewis

by 김준범 Nov 22. 2020

큰 사이드바의 메뉴를 읽기 쉽게 하는 방법

큰 사이드바 메뉴는 메뉴 아이템이 배치된 모습에 따라 사용자를 불편하게 할 수 있다. 모든 메뉴가 똑같은 모습으로 놓여있으면 메뉴 아이템을 스켄하기가 어려워지며, 사용자가 내비게이션을 하는 속도를 느리게 만들게 된다.



이러한 문제는 모든 아이템에 텍스트나 아이콘을 똑같이 적용했을 때 발생한다. 사용자가 원하는 아이템을 찾기 위해 스캔할 때, 사용자의 시선은 모든 메뉴들 위로 흩어지게 된다. 사용자의 주의를 끌 수 있는 계층구조가 없기 때문이다.

주요 아이템에 사용자의 주의가 집중되게 하여 메뉴를 스캔하기 쉽게 만들어라. 그러기 위해서는 다음과 같이 중요한 아이템을 강조해야 한다.




Primary Item Icons

모든 메뉴 아이템에 아이콘을 배치하는 것 대신, 주요 메뉴에만 아이콘을 적용하라. 주요 메뉴를 시각적으로 강조함으로써 사용자의 주의가 주요 메뉴에 먼저 닿도록 할 수 있다. 사용자는 아이콘이 없는 부수적인 메뉴를 그다음으로 보게 된다.




Slightly Larger Icons

모든 메뉴에 아이콘을 적용하고 싶다면, 주요 아이템의 아이콘을 약간 크게 만들어라. 아이콘이 약간만 커도 스캐닝할 때 큰 차이를 만든다. 아이콘을 인지하기도 쉬워지고, 각 항목들의 행간도 넓어지기 때문이다.






원문 출처 : https://uxmovement.com/navigation/3-small-ways-to-make-large-sidebar-menus-scannable/


작가의 이전글 List vs. Grid View
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari