본문 바로가기
🍎 iOS/H.I.G ( Human Interface Guideline )

H.I.G: Human Interface Guideline(스위프트 하이) - Modality(1)

by @Eddy 2022. 5. 8.
728x90

HIG: Human Interface Guideline (=사용자 인터페이스 지침서)

즉, 절대적으로 이 지침을 따라야 한다는 것이 아니라 앱 개발과 디자인에 있어 "권장"하는 내용이다.

무분별한 백지개발로 퀄리티가 낮은 앱이 개발되는 것을 예방하고, 어느 정도 일정한 패턴과 형식을 가진 앱을 개발하기를 바라는 마음에서 만들어진 지침이다.

 

https://www.youtube.com/playlist?list=PLLFDewH7eSVxGMERS4CrwkDXXYZoE5mVZ 

 

온라인 독서모임

 

www.youtube.com

오늘 공부한 내용은 '스위프트 하이 유튜브 온라인 독서모임' 'Onboarding', 'Loading', 'Modality'이다.

현재 개발 중인 앱에서 고려했던, 앞으로 고려해야할 내용들이기에 우선적으로 공부하게 됐다.

 

ModalIty는 분량이 많다.

 

<요약>

1,5. Modality는 temporary(일시적인 화면), simple, short, focus해야하는 화면에서 사용해라. 

2. Modal은 Sheet(부분화면)와 FullScreen(전체화면)으로 구분되고, 모달이 나타나면 뒷화면은 흑백처리가 되며 누를 수 없다.

3. 사용자 경험을 극대화할 수 있는 순간에만 Modal을 사용해라.

4. Alert는 사용자의 이용경험을 intrupt(방해)하고 dismiss(종료)하기 위한 탭이 필요하기 때문에 유저들이 그 ‘방해(instrusion)’가 합당하다고 느끼는 것이 중요하다. 

 

<Modality>

애플 HIG공식문서 중 Alert이미지
애플 HIG 공식문서 중 Modal View이미지

1. Modality는 앱에서 현재의 context(문맥, 상황)에서 벗어난 temporary Mode(일시적인 모드)를 말한다. 그 예로 Alert, Activity View(or Share sheet)(=공유버튼), and Action Sheet(사진 촬영/ 앨범 선택 중 택1을 고르게 하는 등의 시트)가 있다.

 

2. Modal은 Sheet(부분화면)와 FullScreen(전체화면)으로 구분되고, Modal이 생성되면 뒷화면(이전 화면)과의 Interaction(상호작용)이 단절된다. 

  (모달이 나타나면 뒷화면은 흑백처리가 되며 누를 수 없다는 의미.)

 •Sheet: 몰입하지 않는 컨텐츠에 사용한다.

 •Fullscreen: 

   - 우리에게 익숙한 형태이며, 종료하기 위해 별도의 종료버튼이 필요하다. 

   - 몰입형 컨텐츠에 사용. : Video, Photo, Camera 등.

   - 풀스크린을 사용하는 게 유리한, 복잡한 Task일 때 사용하는 게 좋다. (사진편집, 문서 마킹 등)

 

3. 필요한 순간에만 Modal을 사용해야 한다.

 •현재 Task에서 (성격이) 다른 Task를 수행하거나 선택할 때.

 •사용자의 주의를 집중시켜야 할 때. 

 •반드시 진행 후 넘어가야하는 할 때.

 •모달을 사용했을 때 확실한 이점이 있을 때.

 

4. Alert: 사용자에게 필수적이고 완전하게 실행할 수 있는 정보를 전달하기 위해 사용한다.

  (Reserve alerts for delivering essential and ideally actionable information.)

 - 일반적으로 Alerts는 문제가 생겼을 때 나타나는데, 그 이유는 Alert가 사용자의 이용경험을 방해하고 종료하기 위한 탭이 필요하기 때문이다. 유저들이 그 ‘방해(instrusion)’가 합당하다고 느끼는 것이 중요하다. 그러므로 웬만하면 사용하지 않는 것을 권장한다. 사용자 행동의 결과를 매번 Alerts로 보여주면 안 된다.(매번 그러면 사용자가 딥빡할 수 있다)  Alert는 문제가 생겼을 때에 사용하는 것을 권장한다. 알림을 줘서 미안하지만 이건 꼭 확인하고 넘어가야해! 라는 느낌으로 사용하자.

 - 스위프트 하이에서 인상적이었던 예시. 과거 한남대교를 지나다보면 3G통신이 잘 되지 않는 지역이 있는데, 네비게이션을 이용해 가는 중 화면 한 가운데에 3G연결이 끊겼습니다. (연결) 이라는 화면이 나와서 운전중인데 나보고 어쩌라고 라는 불편함을 받았다고 한다.

 - 그러므로, 화면을 반드시 가려야 할 정도로 중요한 게 아니라면 다른 위치에 표시하는 것도 한 방법이 될 수 있다.

 

5. Modal은 심플하고, 짧고, 집중해아할 때 이용된다.

  (Keep modal tasks simple, short, and narrowly focused.)

그러므로, 앱 내부에 앱을 만드는 것은 지양해라.(메인을 Modal로 해서 그 안에서 여러 task를 수행하지 않게 만들어라.) Modal이 너무 복잡해지면 사용자들은 기존에 하려던 task를 잊는다. 만약 Modal task가 subview를 포함해야만 한다면, 단 하나의 명확한 경로를 제공해라. 여러 계층(hierarchy)을 만들지마라. Done버튼은 전체 task를 완료하는 용도 외에는 사용을 지양해라. 

 

 

 

분량이 많아 내 글임에도 읽기 불편해서 포스팅을 나눴다.

 

이어서 <H.I.G: Human Interface Guideline(스위프트 하이) - Modality(2)> 보기

https://developer-eddy403.tistory.com/28

 

H.I.G: Human Interface Guideline(스위프트 하이) - Modality(2)

HIG: Human Interface Guideline (=사용자 인터페이스 지침서) 즉, 절대적으로 이 지침을 따라야 한다는 것이 아니라 앱 개발과 디자인에 있어 "권장"하는 내용이다. 무분별한 백지개발로 퀄리티가 낮은

developer-eddy403.tistory.com

 

<HIG공식문서링크 - Modality>

https://developer.apple.com/design/human-interface-guidelines/ios/app-architecture/modality/

 

Modality - App Architecture - iOS - Human Interface Guidelines - Apple Developer

Modality Modality is a design technique that presents content in a temporary mode that requires an explicit action to exit. Presenting content modally can: Help people focus on a self-contained task or set of closely related options Ensure that people rece

developer.apple.com

 

반응형

댓글