它将给iPhoneX设计带来一些新的挑战，但也将带来一些新的设计机会。本文将分享一些建议，帮助您设计在iPhoneX上看起来和感觉都很棒的应用程序和游戏。
显示细节。
iPhoneX具有1125×2436像素，具有全新的高分辨率、圆形和边缘超级视网膜显示屏。虽然它为设计师提供了更多的展示空间，并允许他们创造真正的身临其境体验，但在设计设备时需要考虑以下几点：
1.3倍图像尺度因子
iPhoneX有3倍的图像比因子(@1x、@2x和@3倍)。当需要光栅图像时，请确保在应用程序图像分辨率目录中包含2x和3倍的图像分辨率。此外，建议使用SVGS进行字体和其他需要高分辨率缩放的平面图，因为它们与分辨率无关。
2.新的显示尺寸：更多的屏幕空间和内容
iPhone的X显示尺寸为375pt宽度*812pt高度。在倍显示中，相当于1.125px@3倍宽度*2，436px@3倍高。在纵向方向上，iPhoneX显示的宽度与iPhone6.iPhone7和iPhone8的4.7英寸屏幕的宽度相匹配，因此显示的信息量与这些设备的窄尺寸没有什么不同。但显示器有不同的高度：812pt高于145pt，高达4.77t的4.7。额外的iPhoneX高度为内容提供了20%的空间。
3.在创建背景图像时考虑宽高比
在设计背景图像时，请记住，iPhoneX的垂直和水平比也不同于4.7显示。为iPhone816：9创建的背景图形需要调整，以满足iPhoneX的技术要求。为了避免负面结果，最好在不考虑显示长度和宽度比的情况下，使关键视觉信息可见。
4.不要把元素放在显示的边角
圆角给设计师带来了另一个挑战：传感器外壳可以夹住或覆盖每个位置靠近视角边缘的元素。关键是嵌入控件和其他元素，以避免这种情况。
5.使用安全区域布局显示内容
安全区域布局有助于避免在定位内容和控件时忽略系统UI元素。在iPhone8上，安全区域和视频屏幕一样大，没有显示任何条目。在iPhoneX上，即使屏幕上没有任何条目，安全区域布局也嵌入在屏幕边缘的顶部和底部。这有助于防止接口元素被剪切或覆盖。
然而，安全区域有两个例外：应用程序的背景和垂直滚动视图。垂直滚动视图（如表和集合）应延伸到显示器的底部和边缘，而不仅限于安全区域。
6.不要担心本机组件
如果您的应用程序使用本地iOS组件（如导航条、表格、集合视图、标签条等），并且您担心它们将如何应用于iPhoneX，请不要担心！它们将自动嵌入和定位。
HOME指标。
iPhoneX改变了iPhone的互动基础之一，home键现在是遗产。在iPhoneX用户想要访问应用程序切换器或主屏幕之前，点击iPhone的home键。对于iPhoneX，当用户沿屏幕底部边缘滑动时，也可以进行相同的操作。刷卡是一个新的点击。
为了用手势代替home键，使其直观，苹果在屏幕底部边缘的指示器格式中提供了交互信息；屏幕底部的行。该指示器显示在iPhoneX应用程序的界面上。在设计应用程序时，您需要考虑这一点。
注意底部的白线，这是一个新的家庭指标。它会告诉你，你可以向上滑动屏幕，回到你的主屏幕或进行多任务处理。
7.避免在HOME指示符附近放置交互元素
最好避免在指示器附近放置交互元素，如按钮，否则有与Home指示器重叠的风险。只需在Home指示符附近留下一些空白，并将不可滚动的元素放置在安全区域。
8.请勿特别注意HOME指示
home指示灯不是装饰性的。不要掩盖，也不要特别注意。
9.使用自动隐藏全屏体验
在呈现视频等全屏视觉内容时，主指示器可以自动隐藏。
notch区域可能是iPhoneX设计中最具争议的部分。有些人认为它有视觉吸引力；其他人认为它很丑。但作为设计师，我们可以使用凹槽区域的屏幕空间。
10.不要掩盖陷阱
一些设计师试图让iPhoneX上的体验看起来像iPhone8上的体验；他们把黑条放在顶部，让它看起来像一个旧的应用程序。最好避免这种情况——这只会让你的应用程序与iPhonex上的其他应用程序不一致。
11.不要隐藏状态栏
如果你现在把状态栏隐藏在你的应用程序中，最好重新考虑这个决定。因为状态栏区域比较高(以前是20pt高，现在是44pt)，你有更多的属性来显示你的内容。添加对用户有用的内容。
美好未来首创1对1项目负责制，项目经理专人全程负责。我们为您提供网站建设优化解决方案，互联网品牌建设与网络营销，设计、技术开发、网站和SEO优化行业的技术和数据支持服务、营销推广等服务。为您的企业获取网络流量，挖掘精准客户，达到更高的销售指标。是您的企业提升产品销量最好的伙伴。
