[iOS-HIG] HIG를 읽으면서 새로 알게된점, 느낀점 (230704 수정)

https://developer.apple.com/design/human-interface-guidelines/

Human Interface Guidelines | Apple Developer Documentation

https://developer.apple.com/ios/planning/

Planning your iOS app

 

0. 애플이 대놓고 SwiftUI를 밀고있다.

SwiftUI가 UIKit에 비해 가지는 장점이 정리된 글 -> https://boidevelop.tistory.com/115

 

1. 터치를 받는 모든 요소는 최소 44 x 44pt 터치 범위를 가져야한다.

 

2. 키보드에 음성을 통해 내용을 입력할 수 있도록 "마이크" 버튼 기능을 지원하자.

 

3. 비게임 앱에서는 색상 종류를 최소화한다. 너무 많은 색상은 의미를 덜 명확하게 보여주므로, 인터페이스 간 관계를 명확하게 하도록 색상을 조합해야한다.

 

4. 같은 색을 다른 의미로 사용하지 않는다. 하나의 색엔 하나의 의미만 담아서 일관된 색상을 사용해야한다.

 

5. 앱의 시스템 색상을 하드코딩해서 사용하지 않도록 한다.

https://developer.apple.com/documentation/uikit/uicolor/standard_colors

UIKit의 UIColor 클래스의 color값을 사용하고자 할 때 이를 하드코딩하는게 아니라 UIColor 클래스의 color를 사용하라는 의미

 

6. 이미지를 너무 모서리에 붙게 배치하지 않는다.

- 이미지 스케일에 따라 이동에 따라 잘려보이거나 다르게 보일수도 있으므로, 정중앙에 오게 그리고 모서리에서 조금 여유있게 이미지를 배치하도록 한다.

 

7. 앱을 사용함에 있어서 유저가 특별한 기술이나 지식이 필요하지 않아야한다. 맨 처음 앱을 설치했을 때 앱을 사용하는 방법을 알려주는 / 혹은 원하는 사람은 스킵할 수 있는 온보딩 기능을 고려해라.

 

8. 앱의 현재 페이지에서숨겨진 내용이 있다면, 사용자가 이를 알아차릴 수 있는 힌트를 제공해야 한다.

- 스크롤뷰로 감쌌을 때 하단에 내용이 더 있는 것처럼 레이아웃을 배치해야함

 

9. (iOS 15 이후) keyboard layout guide 

아니 이 기능을 이제 알다니 !?!!!

https://developer.apple.com/videos/play/wwdc2021/10259/

Your guide to keyboard layout - WWDC21 - Videos - Apple Developer

기존에 NotificationCenter를 사용하여 keyboard가 올라오면 레이아웃을 일일이 계산해야 했던 것을 -> 

한줄에 해결,,

해당 기능을 프로젝트에 적용한 내용 -> 링크 이동

 

10. privacy 관련 정책 ⭐️

https://developer.apple.com/design/human-interface-guidelines/privacy

Privacy | Apple Developer Documentation

여기에 앱 정책 관련해서 중요한 내용들이 많아보임 (못지키면 리젝당할 확률이 클 사안들)

 

- 앱 사용에 있어서 반드시 필요한 정보만을 요청해라. (이것때문에 이전에 리젝 당한적이 있음. 예를들어 회원가입에 있어 핸드폰 번호만 있으면 되는데 주민등록번호를 요구한다던지 등은 조심해야한다.)

- 위치나 건강, 미디어, 연락처 접근 등을 요청할 때 데이터를 왜 필요로 하며 어디에 쓰일지 alert창에 정확하게 명시해주어야 한다.

- 권한 요청은 앱이 작동하는 데 필요한 것이 아니라면 시작 시 요청하는 것을 지양하며 (사람들은 앱을 빨리 시작하고 싶어하므로), 액세스 해야하는 경우에만 권한을 요청할 것

- 만약 앱이 동작하는 데 있어서 특정 권한 액세스가 처음부터 필요하다면, 하단과 같은 화면으로 사용자에게 안내하는 것을 권장한다.

https://developer.apple.com/design/human-interface-guidelines/privacy

- 위와 같은 화면에서는 다른 취소 버튼이나 X 버튼을 배치하지 않는다.

 

11. font는 light 사이즈는 가급적 피하며, medium 이상의 폰트를 사용하여 가독성을 높인다.

 

12. 텍스트필드 관련

- 텍스트 입력보다는 가급적 선택할 수 있는 UI를 만들어서 편의성을 제공해라. 유저는 텍스트 입력을 귀찮아한다.

- placeholder를 제공해라.

- 사용자가 틀린 데이터를 다 입력한 후에 고치지 않도록 입력 즉시 수정할 수 있게 정보를 제공해라. (ex. 비밀번호 입력 형식이 맞는지 텍스트필드 아래에 띄워주는 방식)

 

13. 로딩 관련

- 가급적이면 빠르게 컨텐츠를 보여줘야한다.

- 만약 앱을 현재 사용할 수 없는 상황 (네트워킹이라던가 컨텐츠를 불러오는 중일 때) 이라면, 사용자에게 이를 반드시 적절하게 알릴 필요가 있다.

https://yozm.wishket.com/magazine/detail/1238/

빙글빙글 돌아가는 로딩만 로딩이 아니야! | 요즘IT

여기에 레퍼런스가 잘 나와있다.

 

14. 가급적 회원가입을 지연시켜라.

예를들어 쇼핑몰의 경우에는 어떠한 상품이 있는지 등을 돌아볼 수 있고, 구매를 하고싶을 때 회원가입이나 로그인이 필요하듯이 먼저 이 앱이 어떤 앱인지를 유저가 알 수 있게 먼저 유도를 한 다음 필요할 때 회원가입시키도록 해야한다.

처음부터 회원가입을 시키면 유저가 이탈할 확률이 높음