iphone x 대응현황 및 미대응 사례를...
TRANSCRIPT
![Page 1: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/1.jpg)
iPhone X 대응방안 및미대응 사례를 통한 이슈사항 사전 예측
2017/01/10UX팀
![Page 2: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/2.jpg)
Safe Area 대응별도의 주석을 달지 않았습니다.
![Page 3: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/3.jpg)
디바이스별 Safe Area
![Page 4: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/4.jpg)
디바이스별 Safe Area_ 가로/세로 전환 시
![Page 5: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/5.jpg)
iPhone X Safe Area 대응
![Page 6: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/6.jpg)
iPhone X Safe Area 대응
![Page 7: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/7.jpg)
iPhone X Safe Area 대응
![Page 8: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/8.jpg)
iPhone X Safe Area 대응
![Page 9: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/9.jpg)
서비스별iPhone X 대응 현황
![Page 10: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/10.jpg)
서비스별 iPhone X Safe Area 대응 현황
![Page 11: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/11.jpg)
서비스별 iPhone X Safe Area 대응 현황
![Page 12: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/12.jpg)
서비스별 iPhone X Safe Area 대응 현황
![Page 13: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/13.jpg)
서비스별 iPhone X Safe Area 대응 현황
![Page 14: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/14.jpg)
서비스별 iPhone X Safe Area 대응 현황
![Page 15: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/15.jpg)
참조자료
![Page 16: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/16.jpg)
잡코리아
고정메뉴에 외곽 라인이 들어간 경우와그렇지 않은 경우를 비교해 주세요.
붕 떠보이는 이 영역을Airbnb와 비교해 주세요.
![Page 17: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/17.jpg)
알바몬System Status 영역과타이틀 영역에 차이가..
본 영역과네이버, 다음 등의 화면을비교해볼 수 있습니다.붕 떠보이는 이 영역을
Airbnb와 비교해 주세요.
![Page 18: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/18.jpg)
위비뱅크
![Page 19: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/19.jpg)
복지로
![Page 20: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/20.jpg)
BNK부산은행
![Page 21: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/21.jpg)
iONE뱅크
![Page 22: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/22.jpg)
아내의식탁
본 이미지 배너 영역을다음검색과 비교해 주세요.
![Page 23: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/23.jpg)
만개의레시피
뒤 늦게 만들어진 화면들은아직 대응되지 못했습니다.
![Page 24: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/24.jpg)
부동산114System Status 영역의
높아진 높이값이 다르게 반영되어 있습니다.
![Page 25: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/25.jpg)
NH농협생명 모바일창구
![Page 26: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/26.jpg)
Liiv ON 부동산
![Page 27: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/27.jpg)
지하철
![Page 28: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/28.jpg)
Worknet
![Page 29: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/29.jpg)
Behance
![Page 30: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/30.jpg)
다음검색
배너 이미지 하단을동일색상의 이미지로 채워
붕 떠보이는 어색함을 줄였습니다.
![Page 31: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/31.jpg)
Airbnb
![Page 32: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/32.jpg)
Airbnb
![Page 33: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/33.jpg)
네이버검색System Status영역이 확연히 높아진
것을 확인할 수 있습니다.
![Page 34: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/34.jpg)
네이버검색
![Page 35: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/35.jpg)
Oksusu
![Page 36: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/36.jpg)
참고문헌
[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_relative_to_the_safe_area
[iOS Safe Area]https://medium.com/rosberryapps/ios-safe-area-ca10e919526f
지금까지 현황파악을 위한 정보를 확인해 보았으며 ‘어떻게’ 대응할지는 아래의 참고문헌을 참조 바랍니다.
![Page 37: iphone x 대응현황 및 미대응 사례를 통한 이슈사항 예측](https://reader034.vdocuments.site/reader034/viewer/2022051123/5a6535457f8b9aff1a8b471d/html5/thumbnails/37.jpg)
감사합니다.