From Design pattern
Jump to: navigation, search

Tab bar는 현재 컨텐츠와 이동 가능한 컨텐츠 제목으로 이루어진 bar 메뉴로, 컨텐츠 간 이동을 돕는 인터랙션 패턴이다. 주로 화면 상단에 위치하며 highlight를 이용하여 현재의 페이지를 표시한다. Tab bar에 있는 페이지 제목을 tap하여 지정된 컨텐츠로 이동하며, 보통 유사한 성격의 페이지들로 이루어져 있다.

With this pattern, we can solve...

많은 양의 컨텐츠를 효과적으로 보기 위해 데이터 간 이동을 간소화하는 패턴이 필요하다. Tab bar는 따로 이동 메뉴를 불러올 필요 없이 화면에서 항상 메뉴가 제공되어, 다른 컨텐츠로 바로 이동할 수 있다. 반복적으로 왔다갔다 하기에 용이하며, 현재 위치를 파악할 수 있는 기능을 제공한다.

  • Tab bar는 현재의 컨텐츠를 표시해주며, 다른 컨텐츠가 존재할 것이라는 시각적 힌트를 제공한다.
  • 다른 페이지로 이동한 뒤에도 원래 페이지는 초기화되지 않고 그대로 유지된다.
  • Tab bar는 다른 종류의 데이터 및 카테고리로 되어있으며, 동일한 데이터를 가지고 이를 분류하는 방식에 따라 구성을 바꾸거나 필터링 하는 것은 Segmented control에 해당한다.

Example : Android_Phone


iOS_NPRNews

iOS_JetSetter

Android_Tumblr

Android_GoNFC

Android_Auction

Android_PlayStore

iOS_ipad appstore

  • 하단의 Tab bar를 이용하여 화면을 이동한다.

iOS_Microsoft Onenote