HIG OverView
✅ HIG(Human Interface Guidelines)
H.I.G 문서는 애플리케이션을 개발할 때 필요한 디자인과 동작을 포함한 여러 규칙을 통하여 사용자 인터페이스를 어떻게 구성하는 방법에 대한 지침을 제시합니다. H.I.G 문서의 가이드라인을 따라 인터페이스를 작성하면 사용자들로 하여금 새로운 애플리케이션을 처음 접하더라도 대부분의 iOS 사용자에게 익숙한 환경을 제공할 수 있습니다. 좋은 인터페이스를 사용자에게 제공하는 것은 애플리케이션의 사용자를 더 많이 끌어들일 수 있는 하나의 포인트가 될 수 있습니다.
🤷🏻♀️ 왜 HIG 문서를 읽어야하나요?
- 애플리케이션을 설계할 때 사용자와 상호작용에 관해 생각하고 설계할 수 있습니다.
- 개발자가 아닌 사용자의 입장에서 애플리케이션을 바라보고 설계할 수 있습니다.
- 애플리케이션의 일관성을 유지할 수 있습니다.
- 기획자, 디자이너 등 협업에 있어 기준점을 제시하여 협업의 효율을 높일 수 있습니다.
- 이미 사용자에게 익숙한 환경을 제공하여 새로운 애플리케이션 사용의 진입장벽을 낮출 수 있습니다.
- 이미 검증된 사용자 경험을 이해하고 그것을 토대로 조금 더 유연한 사용자 경험을 설계할 수 있습니다.
- H.I.G 문서는 프로그래머뿐만 아니라 디자이너, 기획자, 테스터 등 iOS 애플리케이션 개발에 참여하는 모든 사람이 읽어보는 것을 추천합니다.
🧐 H.I.G의 내용 구성
Overview
- iOS 플랫폼 테마의 특징과 인터페이스 요소에 관한 개요
- iOS의 버전이 업데이트 되면 새로운 iOS 버전의 특징과 변화에 관해서도 설명합니다.
App Architecture
- 애플리케이션 아키텍처 설계 시 고려해야 할 사항을 설명합니다.
User Interaction
- 애플리케이션이 사용자와 상호작용하는 동작 설계 시 고려해야 할 사항을 설명합니다.
System Capabilities
- 시스템이 지원하는 여러 시스템 기능과 각 기능에 대해 설계 시 고려해야 할 사항을 설명합니다.
Visual Design
- 애플리케이션의 시각적인 요소 설계 시 고려해야 할 사항을 설명합니다.
Icons and Images
- iOS에서의 이미지, 아이콘, 시작화면에 관한 내용과 지침에 관한 내용을 설명합니다.
Bars
- iOS에서 사용하는 바의 각 역할과 용도에 관한 설명과 각 바를 구현할 때 고려해야 할 사항에 관한 내용입니다.
Views
- 뷰의 종류와 역할에 관해 설명하고 뷰 설계 시 고려해야 할 사항에 관한 내용입니다.
Controls
- 여러 가지 컨트롤 요소들에 관한 소개와 설계 시 고려해야 할 사항들에 관한 내용입니다.
Extensions
- 여러 가지 확장기능을 소개하고 확장 기능을 사용하는 애플리케이션 설계 시 고려해야 할 사항들에 관해 설명합니다.
Technologies
- 여러 기술을 구현할 수 있는 Kit에 관해 설명하고 해당 Kit 사용 시 설계지침에 관한 내용입니다.
Resources
- OS를 포함한 애플의 플랫폼들에 대한 자원 제공에 관한 내용
✅ iOS Design Themes
Clarity
- 모든 사이즈에서 글자를 읽을 수 있어야 한다. 그러니 읽었을 때 정보가 없는 문자들은 다 빼라.
- 아이콘은 정확하고 이해하기 쉬워야 한다.
- 여백이 남는것을 두려워하지 말라. 기능의 날카로운 포커스를 맞춰라.
Deference
- 사용자는 콘텐츠를 쓰기 위해 앱을 쓰는거다. UI가 콘텐츠를 해치치 않게 해라.
- UI는 콘텐츠가 잘 보이도록 돕는 용도다.
- 콘텐츠는 일반적으로 전체 화면을 채우지만 반투명도와 흐림 효과는 종종 더 많은 것을 암시합니다.
사진 앱 하단 탭을 반투명하게 만들어 밑에도 컨텐츠(사진)가 있다는 걸 나타냄.
스크롤을 끝까지 내리면 투명효과가 사라지며 끝을 알린다.
Depth
- 전환은 콘텐츠를 탐색할 때 깊이감을 제공합니다.
사진 앱에서 공유 버튼 눌렀을 시 뒤에 뷰가 있다는걸 알려주도록 깊이감을 제공한다.
✅ Design Principles
Aesthetic Integrity
- 앱의 모양과 동작이 앱의 성격에 부합해야 된다.
Consistency
- 일관된 앱은 시스템 제공 인터페이스 요소, 잘 알려진 아이콘, 표준 텍스트 스타일 및 통일된 용어를 사용하여 친숙한 표준과 패러다임을 구현합니다.
- 앱은 사람들이 기대하는 방식으로 기능과 동작을 통합합니다.
Direct Manipulation
- 사용자가 직관적인 조작이 가능해야 된다.
- 직관적인 조작을 통해 즉각적이고 가시적인 결과를 배출해야 된다.
Feedback
- 내장된 iOS 앱은 모든 사용자 작업에 대한 응답으로 인지 가능한 피드백을 제공해야 된다.
- 진행률 표시, 애니메이션과 사운드 등을 활용하여 사용자에게 행동에 대한 결과 그리고 정보를 제공해야 된다.
- 예를 들면 문자 보낼 때의 소리, 동영상을 로딩할 때의 로딩 아이콘 등
Metaphors
- 사람들은 앱의 가상 객체와 동작이 실제 세계에 뿌리를 두고 있든 디지털 세계에 뿌리를 두고 있든 친숙한 경험에 대한 은유일 때 더 빨리 배웁니다.
- 아이콘, 드래그, 스와이프 등 사용자가 Action을 단 번에 알 수 있어야 된다.
User Control
- 앱이 의사 결정을 내리기 보단 사용자가 앱을 제어해야 된다.
- 이미 진행 중인 작업을 취소하는 것 과 같이 사용자가 통제하고 있다는 느낌을 주어야 된다.
✅ Interface Essentails
- 대부분의 iOS 앱은 공통 인터페이스 요소를 정의하는 프로그래밍 프레임워크인 UIKit의 구성 요소를 사용하여 빌드된다.
- UIKit을 사용하여 앱은 시스템 전체에 일관된 모양을 나타내 어떤 앱이든 사용자에게 친숙함을 제공한다.
- 커스텀을 하지 않고 UIKit의 기본 뷰를 사용하면 시스템 모양이 변경될 때 자동으로 업데이트 된다. 그러니 커스텀을 적절한 곳에 사용하자.
Bars
사람들에게 앱 내 위치를 알리고 탐색을 제공하며 작업을 시작하고 정보를 전달하기 위한 버튼 또는 기타 요소를 포함할 수 있습니다.
Views
텍스트, 그래픽, 애니메이션, 대화형 요소와 같이 사람들이 앱에서 보게 되는 주요 콘텐츠를 포함합니다. 보기는 스크롤, 삽입, 삭제 및 정렬과 같은 동작을 활성화할 수 있습니다.
Controls
행동을 시작하고 정보를 전달하십시오. 버튼, 스위치, 텍스트 필드 및 진행 표시기는 컨트롤의 예입니다.
iOS의 인터페이스를 정의하는 것 외에도 UIKit은 앱이 채택할 수 있는 기능을 정의합니다. 예를 들어 이 프레임워크를 통해 앱은 터치스크린의 제스처에 응답하고 그리기, 접근성 및 인쇄와 같은 기능을 활성화할 수 있습니다.
iOS 는 Apple Pay, HealthKit 및 ResearchKit과 같은 다른 프로그래밍 프레임워크 및 기술 과도 긴밀하게 통합되어 놀랍도록 강력한 앱을 디자인할 수 있습니다.
