Design

Tab bar (HIG)

2료일 2023. 6. 7. 15:14

- 탭바는 화면 아래에 탭 표시줄에 나타나 앱의 정보 또는 기능의 유형을 쉽게 이해할수 있도록 돕는다.

- 기본적으로는 반투명 상태. 뒤콘텐츠 나올때만 배경소재 사용. 뷰가 아래로 스크롤 되면 제거. 키보드가 화면에 있을때도 탭 표시줄이 숨겨짐.

  1. Use a tab bar only for navigation, not to help people perform actions네비게이션에 탭바가 사용되고 다른 사용자의 작업 수행에 도움을 주지 않는다. 
  2. Make sure the tab bar is visible when people navigate to different areas in your app사람들이 앱의 다른 영역으로 이동할 때 탭 바가 보이는지 확인하세요. 예외는 모달 뷰 내의 탭 바이다. 모달 뷰는 사람들이 끝났을 때 무시하는 별도의 경험을 제공하기 때문에, 뷰의 탭 바를 숨기는 것은 앱 탐색에 영향을 미치지 않는다.
  3. Use the minimun number of tabs required to help people navigate your app.탭의 개수가 늘어날수록 앱의 복잡도도 비례해서 올라간다. 3-5개 의 탭을 사용해라.
  4. Keep tabs visible even when their content is unavailable.ios 기기에 노래가 없더라도 현재 듣는 탭은 뮤직앱에 여전히 남아있다. 그리고 추천, 다운로딩뮤직도 남아있다.
  5. Use concrete nouns or verbs as tab titles.명확해라
  6. Be cautions of overcrowding tabs with functionality.5와 연관이 있는데 Home tab은 너무 광범위 하다. 좀더 기능을 명확히 해라. 여기서 joel의 말이 떠올랐는데 Home탭은 만들지 말라고 하셨다. 이 홈이 어떤 홈 즉 아이폰 홈으로 가는지 어디가는지 명확하지 않기 때문이다.

피트니스 앱을 통한 분석

탭바에 아이템이 두가지가 있다. 요약과 공유하기이다.

- 처음에는 탭바가 반투명 상태이고 맨끝까지 내리게 된다면 배경색인 검정색으로 바뀐다.

- 탭바 아이템들에는 요약과 공유하기로 명확하게 두가지로 나뉘어 있다. 역시나 홈탭이라 하지않고 요약탭이라고 만들어 놧다.

 

https://developer.apple.com/design/human-interface-guidelines/tab-bars

 

Tab bars | Apple Developer Documentation

Tab bars use bar items to navigate between mutually exclusive panes of content in the same view.

developer.apple.com