brunch

You can make anything
by writing

C.S.Lewis

by UX 컨설턴트 전민수 Dec 22. 2017

햄버거 메뉴는 언제 사용하는가?

UX 디자인 배우기 #133

Today UX 아티클


오늘은  햄버거 메뉴 사용 시기에 대해 애기하고자 합니다.

Nich Babich의 원문을 번역한 글입니다


햄버거 메뉴. 라인 세 개가 쌓여있는 모양의 아이콘으로 마치 빵 사이에 고기가 들어있는 모양과 비슷해 붙여진 이름이죠. 주로 메뉴를 나타낼 때 사용됩니다. 이 아이콘을 클릭하거나 탭 하게 되면 내비게이션 옵션이 보입니다. 


햄버거 메뉴를 주제로 쓰인 글을 보면 햄버거 메뉴에 반대론을 펼치는 글을 많이 볼 수 있습니다. 주로 디자이너들이 쓴 글이죠. 그런 글을 한 번도 본 적이 없으시다면 NN그룹의 Hidden Navigation Hurt UX Metrics를 읽어보세요. 간단히 말해, 이 문제는 햄버거 아이콘 자체의 문제라기 보단 아이콘 뒤에 내비게이션을 숨기는 것에 대한 문제라는 요지의 글입니다. 


하지만 어떤 경우에는 햄버거 메뉴를 사용하는 것이 좋은 선택이 될 수 있습니다.



보조 내비게이션으로 사용하는 햄버거 메뉴


햄버거 메뉴의 주요 단점이 낮은 발견 가능성이기 때문에 주 내비게이션 메뉴에 사용하는 것은 권장하지 않습니다. 하지만, 보조 내비게이션 옵션을 디자인할 때는, 이 패턴이 적절한 솔루션이 될 수 있습니다. 주 내비게이션 옵션이 행동 유도 버튼이나 다른 형태로 스크린상에 보인다면, 햄버거 메뉴에는 다른 모든 보조 내비게이션 기능을 담으면 좋습니다.


아래의 우버(Uber) 앱 스크린을 보십시오.


지도와 검색(우버스크린에서 가장 중요한 두 가지 네비게이션 요소)은 항상 볼 수 있습니다.


주 화면에 대한 모든 것이 ‘차 부르기’를 위해 디자인되었기 때문에 ‘히스토리’나 ‘설정’과 같은 보조 옵션은 햄버거 메뉴 뒤에 숨길 수 있습니다(이런 기능들은 앱을 여는 사람이 항상 쓰는 기능은 아닙니다). 


여기서 햄버거 아이콘은 유저가 태스크를 수행하는 데 방해가 되지 않으면서도 보조 기능으로 접근할 수 있게 해 줍니다. 


이 경우에, 내비게이션 요소가 적다는 것은 유저가 앱을 사용할 때 방해하는 요소가 적다는 뜻입니다. 내비게이션 요소를 최소화하면 유저가 태스크를 완수하는 데 집중할 수 있습니다. 


햄버거 메뉴를 사용할지 말지 고민하고 있다면 “80% 룰” 생각해보시길 바랍니다. 햄버거 아이콘 뒤에 숨기려고 하는 내비게이션 옵션들이 주 사용 빈도로 따졌을 때 하위 80%에 해당하는 옵션들인가요? 만일 그렇다면, 햄버거 메뉴 뒤에 그 기능을 숨기는 것은 괜찮습니다. 


결론


히든 내비게이션이 대게는 유저에게 해롭지만, 어떤 디자인 의사결정이든 앱의 목적이라는 맥락 안에서 내려져야 합니다. 다른 말로 하면, 세상에 단순히 ‘좋은 패턴’이나‘나쁜 패턴’은 존재하지 않습니다. 맥락이 가장 중요한 거죠. 





라이브 클래스 PM VOD 패키지(리서치/분석/전략/설계)


178여개 UX 강좌(총 300시간) PM VOD 패키지 98% 할인 이벤트!!!! 매일 하루에 딱 한명만!!!! 선착순 1명!!!! 

https://ebprux.liveklass.com/



매거진의 이전글 디자인의 메타포와 아놀로지

작품 선택

키워드 선택 0 / 3 0

댓글여부

afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari