[Swift] HIG 알아보기

H.I.G 란 ?

Human Interface Guide 

---

iOS의 3가지 핵심 가치

•  Clarity (명확성)
  - 가독성 높은 테스트, 이해하기 쉬운 아이콘, 최소화된 장식
  - 기능 주도의 디자인, 중요한 요소들의 강조

 

• Deference (존중)
  - 전체 활용을 활용한 컨텐츠 표시
  - 메인 컨텐츠 이외의 다른 요소가 부각되지 않도록
  - 베젤, 그라데이션의 활용
  - 그림자 사용 최소화
  - 밝은 인터페이스 유지  

 

• Depth (깊이)
  - 레이어와 모션을 활용해 계층을 표현
  - 컨텐츠를 이동할 때 깊이감을 더해주도록 화면 전환
  - 터치 및 검색 기능으로 컨텐츠에 엑세스 쉽도록

  ---

HIG의 디자인 6원칙

• Aesthetic Integrity (심미적 통일)
  - 앱의 모양, 동작이 기능과 얼마나 잘 통합되어 있는지 나타낸다.
• Consistency (일관성)
  - 아이콘, 표준 텍스트 스타일, 통일된 용어 등을 사용한 익숙한 표준 및 패러다임 구현
• Direct Manipualtion (직접 조작)
  - 장치 회전, 제스처 사용 등과 같은 직접 컨텐츠 조작을 통해 사용자의 이해도 높이기
• Feedback (피드백)
  - 사용자가 발생시킨 동작에 대해 그래픽, 사운드를 통한 작업결과를 보여줌
• Metahpors (비유)
  - 사용자들이 친숙하게 느낄만 한 비유를 통해 이해를 돕는다.
• Use Controls (사용자 컨트롤)
  - 중요한 작업은 사용자가 직접 결정하여 동작하도록 한다.
     

  ---

HIG 내용 살펴보기 

Controls 
-> 여러가지 컨트롤 요소들에 관한 소개와 설계 시 고려해야 할 사항들에 관한 내용을 설명

 

1. Label

  - 사용자가 수정 불가, 복사 가능

  - Dynamic Type을 사용하면 사용자가 기기 설정에서 텍스트 크기를 변경하는 경우에도 잘 보이게 할 수 있음

 

2. Button
   - 4가지의 지정된 버튼 스타일

• System Buttons
  - 네비게이션 바 / 어디서든 사용할 수 있는 형태
  - 동사 (영어 기준) 권장
     
• Detail Disclosure Button
  - 주로 Tables에서 해당 행의 세부정보를 보여주기 위해 사용
  - 세부정도가 아닌 행 전체의 정보를 보여주고 싶다면
  - disclosure accessory tupe (> 모양) 사용을 권장
        
• Info Button 
  - 앱의 상세 설정창을 표시할 때 사용
  - 현재 뷰의 뒷면을 나타낼 때 사용하기도 함
         
• Add Contact Button
  - 메세지 작성시 / 연락처 리스트 탐색 시 
  - 텍스트 필드나 다른 뷰 삽입시 사용하는 버튼
          
  - 이 버튼이 정보 입력을 위한 유일한 수당이 되어선 안된다.
     -> Add Contact 버튼 이외에도 키보드 입력을 허용해야 함.
      

3. TextField

• 사용자로부터 적은 양의 정보를 받을 수 있는 요소
• 사용자가 해당 textField를 클릭했을 때, 자동으로 키보드가 올라옴
• placeholder 사용 권장
• clear 버튼 사용 권장