iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측

1. iPhone X 대응방안 및
미대응 사례를 통한 이슈사항 사전 예측
2017/01/10
UX팀

2. Safe Area 대응
별도의 주석을 달지 않았습니다.

3. 디바이스별 Safe Area

4. 디바이스별 Safe Area_ 가로/세로 전환 시

5. iPhone X Safe Area 대응

6. iPhone X Safe Area 대응

7. iPhone X Safe Area 대응

8. iPhone X Safe Area 대응

9. 서비스별
iPhone X 대응 현황

10. 서비스별 iPhone X Safe Area 대응 현황

11. 서비스별 iPhone X Safe Area 대응 현황

12. 서비스별 iPhone X Safe Area 대응 현황

13. 서비스별 iPhone X Safe Area 대응 현황

14. 서비스별 iPhone X Safe Area 대응 현황

15. 참조자료

16. 잡코리아
고정메뉴에 외곽 라인이 들어간 경우와
그렇지 않은 경우를 비교해 주세요.
붕 떠보이는 이 영역을
Airbnb와 비교해 주세요.

17. 알바몬
System Status 영역과
타이틀 영역에 차이가..
본 영역과
네이버, 다음 등의 화면을
비교해볼 수 있습니다.붕 떠보이는 이 영역을
Airbnb와 비교해 주세요.

18. 위비뱅크

19. 복지로

20. BNK부산은행

21. iONE뱅크

22. 아내의식탁
본 이미지 배너 영역을
다음검색과 비교해 주세요.

23. 만개의레시피
뒤 늦게 만들어진 화면들은
아직 대응되지 못했습니다.

24. 부동산114
System Status 영역의
높아진 높이값이 다르게 반
영되어 있습니다.

25. NH농협생명 모바일창구

26. Liiv ON 부동산

27. 지하철

28. Worknet

29. Behance

30. 다음검색
배너 이미지 하단을
동일색상의 이미지로 채워
붕 떠보이는 어색함을 줄였습니다.

31. Airbnb

32. Airbnb

33. 네이버검색
System Status영역이 확연히 높아진
것을 확인할 수 있습니다.

34. 네이버검색

35. Oksusu

36. 참고문헌
[Things to keep in mind when designing for “new” iPhone X]
https://medium.com/sketch-app-sources/things-to-keep-in-mind-when-
designing-for-new-iphone-x-bfc19a7703ae
[How to Design for iPhone X (without an iPhone X)]
https://blog.halide.cam/how-to-design-for-iphone-x-without-an-iphone-x-
e7226ef0616
[Human Interface Guidelines iOS]
https://developer.apple.com/ios/human-interface-guidelines/overview/iphone-x/
[iPhone X Design Guideline(번역본)
https://brunch.co.kr/@zalhanilll/168
[How To Prepare Your Apps For The iPhone X]
https://novemberfive.co/blog/apple-september-event-iphonex-apps/
[Positioning Content Relative to the Safe Area]
https://developer.apple.com/documentation/uikit/uiview/positioning_content_rel
ative_to_the_safe_area
[iOS Safe Area]
https://medium.com/rosberryapps/ios-safe-area-ca10e919526f
지금까지 현황파악을 위한 정보를 확인해 보았으며 ‘어떻게’ 대응할지는 아래의 참고문헌을 참조 바랍니다.

37. 감사합니다.