Notice
Recent Posts
Recent Comments
Link
Tags
- IOS
- HIG
- 스위프트
- Combine+UIKit
- UIKit
- CollectionView
- Keychain
- WWDC
- lineBreakMode
- UILabel
- github
- 디자인패턴
- iPad
- 앱개발
- orthogonalScrollingBehavior
- TOSS
- Accessibility
- 전달인자 레이블
- DiffableDataSource
- Apple
- Human Interface Guidelines
- Split View
- 야곰아카데미
- LanguageGuide
- Swift
- iTerm
- lineBreakStrategy
- GOF
- 애플
- 애플사이다
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- Today
- Total
애플사이다의 iOS 개발 일지
[Apple HIG] Human Interface Guidelines 시리즈 - Sidebars 본문
iOS/영문 공식문서 뜯어보기-iOS
[Apple HIG] Human Interface Guidelines 시리즈 - Sidebars
Applecider 2022. 2. 8. 00:01안녕하세요. 애플사이다입니다.
iPad 앱을 살펴보면 화면 왼쪽에 List 형태로 된 Sidebars를 자주 사용하고 있습니다.
그리고 Sidebars는 Split Views에서 매우 많이 사용합니다.
Apple의 공식 문서인 Human Interface Guidelines를 통해 Sidebars를 알아보겠습니다.
✅ HIG를 처음 들어봤다면 Human Interface Guidelines를 왜 읽어야 할까? 포스팅을 꼭 읽어주세요.
Sidebars
✅ Sidebar를 통해 앱 수준의 탐색 (navigation), 최상위 컨텐츠에 대한 빠른 접근이 가능하다.
Sidebar의 item을 선택하면 특정 컨텐츠를 확인할 수 있다.
예를 들어 Mail 앱을 보면, 왼쪽의 Sidebar를 통해 메일함의 List를 한눈에 표시한다.
사용자는 특정 메일함을 선택해서 관련된 메일 메시지에 접근할 수 있고, 메시지를 선택하여 컨텐츠 보조화면에 나타낼 수 있다.
✅ Split View의 기본 column에다가 sidebar를 배치하면 된다.
*Split View에 대한 내용은 Human Interface Guidelines 시리즈 - iPad의 Split Views 포스팅 참고
- Apply the correct appearance to a sidebar.
UICollectionLayoutListConfiguration.Appearance를 참고하여 적절한 sidebar appearance를 사용한다.
*Sidebar의 appearances 종류는 plain, grouped, insetGrouped, sidebar, sidebarPlain이 있다.
- Use a sidebar to organize information at the app level.
사용자가 한눈에 컨텐츠 계층구조 (hierarchy)를 파악할 수 있으므로 Sidebar를 통해 사용자에게 앱의 구조를 보여줄 수 있다.
ex. 최상위 수준의 정보인 카테고리, modes, 폴더, playlists 등을 표시하기에 적합하다. - Whenever possible, let people customize the contents of a sidebar.
사용자가 Sidebar에 들어갈 컨텐츠를 선택할 수 있으면 좋다.
ex. Favorite (즐겨찾기) 항목을 통해 사용자에게 중요한 정보를 사용자 스스로 정할 수 있게 한다. - Don't prevent people from hiding the sidebar.
사용자가 Sidebar를 hide/show 할 수 있으면 좋다. edge swipe 제스처를 활용할 수 있다.
default로 hide하는 것은 피해야 한다. - Keep titles in the sidebar clear and concise.
ex. Mail 앱에서 각 메일함의 title을 표시할 때, "Messages" 보다 "Flagged", "Drafts" 같은 명확한 단어를 쓴다.
- In general, refrain from exposing more than two levels of hierarchy within a sidebar.
계층구조는 최대 2개 단계로 나타낸다.
그보다 더 깊은 구조를 표현하고 싶으면 Split View의 보조 column의 List view를 활용하면 된다.
List View를 구현한다면 CollectionView의 UICollectionLayoutListConfiguration를 참고하면 된다.
- Reference
- Apple Developer Documentation > Human Interface Guidelines > iOS
- Apple Design > Human Interface Guidelines > iOS > Bars > SideBars
- Apple Design > Human Interface Guidelines > iOS > Views > Split Views
- Blog > Creating Lists with Collection View (Sidebar의 appearances 종류)
🍎 포스트가 도움이 되었다면, 공감🤍 / 구독🍹 / 공유🔗 / 댓글✏️ 로 응원해주세요. 감사합니다.
'iOS > 영문 공식문서 뜯어보기-iOS' 카테고리의 다른 글
[인디 앱개발] Apple의 App Store 심사지침 요약 - 헬스케어 기능에도 민감하다 (0) | 2022.05.22 |
---|---|
[iOS] UISplitViewController - 코드 예시 및 공식문서 요약 (0) | 2022.02.11 |
[WWDC 2017] Size Classes and Core Components - 다양한 화면크기에 대응하는 방법 (0) | 2022.02.08 |
[Apple HIG] Human Interface Guidelines 시리즈 - Split Views (0) | 2022.02.07 |
[Apple HIG] Human Interface Guidelines를 왜 읽어야 할까? - iOS 앱 설계 기준 / Modality & Navigation (0) | 2022.01.04 |
Comments