아이폰 X을 위한 디자인 가이드

위시켓

지난 13일 아이폰 X(아이폰 10)이 공식적으로 공개되었습니다. 1125x2435px의 Super Retina Display가 탑재되었고, 화면 상단에는 혁신적인 얼굴 인식 센서들이 추가되었지요.


아이폰 X은 디바이스 전체가 디스플레이일 뿐만 아니라, Touch ID가 아닌 Face ID를 이용합니다. 기존의 휴대폰들과 전혀 다른 아이폰 X을 디자인 하는 건 새로운 도전이지만, 그에 따른 새로운 디자인 기회일 수 있습니다.


프리랜서 가이드아이폰 X을 위한 디자인 가이드

아이폰 X을 위한 디자인 가이드


아이폰 X은 너비는 기존의 아이폰 6, 7, 8과 동일하지만, 높이가 145pt로 수직 공간이 ± 20% 더 커졌습니다.@1x를 디자인할 때, 375x812 픽셀의 아트보드가 필요하며, 새로운 Retina Display로 인해 아이폰 8과 같은@2x, 아이폰 7, 8 plus와 같이@x를 내보낼 필요가 없습니다.


아이폰 X를 위한 디자인할 때, 새로운 디바이스의 고유한 특징들(둥근 모서리, M자 모양의 화면 상단 센서들, 홈 인디케이터)을 가리지 않도록 UI 디자인을 해야 합니다.

현재 iOS 네이티브 구성 요소(네비게이션 바, 테이블, 컬렉션 뷰, 탭 모음 등)를 사용하는 앱은 모두 새로운 아이폰에서도 사용할 수 있습니다. 이 요소들은 모두 자동으로 삽입되고 배치되지요.

커스텀 된 레이아웃을 사용하는 경우 새로운 아이폰의 레이아웃에 맞게 앱을 업데이트해야 합니다. 자동 레이아웃(Auto Layout)을 사용하면 쉽게 업데이트할 수 있습니다.


고려해야 하는 사항들


화면 전체를 사용하세요.


중요한 정보는 중앙에 배치하세요.

새로운 상태바.

상태 바를 유용하게 사용하세요.


전체 화면 이미지.

인터렉션 컨트롤러를 화면 하단에 배치하지 마세요.

홈 인디케이터를 (항상) 숨기지 마세요.

더 많은 색상.


'위로 스와이프'와 같은 제스처들에 대해 알아두세요.


Face ID.

커스텀 키보드.


더 커진 네비게이션 바.

요약

Apple에서 제공하는 비디오

Q. 앱 UI를 미리 보려면 어떻게 해야 하나요?

Xcode 9 시뮬레이터를 사용하여 앱을 미리 볼 수 있습니다. UI를 업데이트해야 하는 경우 바로 표시됩니다.


Q. IOS 11과 아이폰 X의 리소스는 어디서 찾을 수 있나요?

Apple Design Resources



믿을 수 있는 IT 아웃소싱 서비스, 위시켓입니다. 공식 사이트:: http://www.wishket.com/
Follow
4.7 Star App Store Review!
Cpl.dev***uke
The Communities are great you rarely see anyone get in to an argument :)
king***ing
Love Love LOVE
Download

Select Collections