온보딩, 햄버거 메뉴, 링크, 고급 설정, 메뉴 UI/UX

'시작하기' 팁은 닫기 쉽게 만든다

• '시작하기' 안내 혹은 '신규 사용자를 위한 팁'을 보도록 강요하는 것은 좋지 않다.

• 온보딩을 필수가 아닌 선택으로, 그리고 끄기 쉽게 만든다.

• UI에 대해 너무 자세히 설명하지 않아도 된다.

• 사용자가 한번에 알기 어려운 UI는 수정해야 할 사항이다.

항목들을 '햄버거' 메뉴 속에 숨기지 않는다

• 햄버거 메뉴는 사용자의 검색 시간을 늦춘다.

• 태스크의 체감 난이도를 높인다.

• 태스크 완료 시간을 지연시킨다.

• 햄버거 메뉴는 항목들을 감추고 있기 때문에, 사용자가 원하는 정보를 한번에 찾기 어렵다.

• 웹이나 앱에서 사용자는 자신이 어디에 있는지에 대한 감을 잡기 어렵다.

• 햄버거 메뉴를 대체할 수 있는 패턴
  - bottomNavigation : iOS 앱에서 널리 사용되며, 4~5개 의 주요 기능을 하단 고정 메뉴에 담을 수 있고, 마지막 항목은 '펼쳐지게'해서 고급 도구에 접근 가능하게 만들 수 있다.

  • 탭 내비게이션: 뷰 하단 내비게이션을 뒤집은 것으로 안드로이드 앱에서 주로 사용되며, 항목이 화면 상단에 위치한다.
  • 세로 유형: 내비게이션을 뷰 왼쪽으로 고정시키고 글자를 수직으로 위치시킨다.
    • 항목이 6~7개 보다 적다면 햄버거보다는 세로 유형이 낫다.

• 모바일에서는 웬만하면 피하고, 데스크톱에서는 절대 햄버거 메뉴를 사용하지 않는다.

• 햄버거 메뉴를 반드시 사용해야 한다면, '삼선' 아이콘만 덩그러니 배치하지 말고 메뉴라는 레이블을 붙인다.

링크를 링크처럼 보이게 만든다

• 링크는 페이지의 다른 텍스트와 확연히 구분될 필요가 있다.

• 링크가 아닌 것을 링크처럼 보이게 하지 않는다.

메뉴 항목을 하위 섹션으로 나눠서 사용자가 긴 목록을 기억할 필요가 없게 한다.

• 메뉴를 섹션으로 그룹핑하거나 옵션의 복잡도를 줄여서 사용자가 이것들을 기억해 내고자 애쓰지 않게 해야 한다.

• 유사한 항목들을 섹션으로 묶는다.

대부분의 사용자에게는 '고급' 설정을 감춘다

• 메뉴 옵션 중 복잡한 것들은 고급 설정으로 분리한다.

• 복잡한 설정을 숨김으로써 앱이 덜 어려워 보이게 만든다.