可视化设计 - 布局
Last updated
Last updated
人们通常希望能够在其所有设备上以任何方向使用他们喜欢的应用程序。在 iOS 中,可以配置界面元素和布局,以便在不同设备上自动更改形状和大小,在iPad中进行多任务处理,分割视图以及屏幕旋转时。您必须提前计划并设计一个在任何环境中提供良好体验的应用程序。
在上下文变化期间,保持对当前内容的关注。内容是您的首要任务。改变环境变化的焦点可能是迷失方向,令人沮丧,并让人觉得他们失去了对应用的控制。
确保主要内容以默认大小清除。人们不必水平滚动阅读重要的文字,或缩放以查看主要图像,除非他们选择更改大小。
在整个应用程序中保持整体一致的外观。一般来说,具有相似功能的元素应该类似。
使用视觉重量和平衡来表达重要性。大物品抓住眼睛,显得比较小的物品更重要。更大的物品也更容易点击,当应用程序用于分散周围环境(如厨房或健身房)时,这尤其重要。一般来说,将主要项目放在屏幕的上半部分,并从左到右读取上下文中 - 靠近屏幕的左侧。
使用对齐来轻松扫描并传达组织和层次结构。对齐使得应用程序看起来整齐有序,帮助人们在滚动的同时关注,并使查找信息变得更加容易。缩进和对齐也可以指示内容组如何相关。
避免免费的布局变更。只是因为有人旋转设备并不意味着整个布局需要改变。例如,如果您的应用程序以纵向模式显示图像网格,则不必在横向模式下显示与列表相同的图像。相反,它可能只是调整网格的尺寸。尝试在所有情况下保持可比的经验。
如果可能,支持纵向和横向。人们喜欢以不同的方向使用应用程序,所以最好的时候可以达到这个期望。
如果您的应用程序仅支持一个方向,则支持两种变体。如果您的应用程序以单一方向运行至关重要,请确保它支持两种方向。例如,如果您的应用程序仅以横向模式运行,则无论“主页”按钮是在左侧还是右侧,都应该可以使用。如果设备在使用您的应用程序时旋转180度,则应用程序应通过将其内容旋转180度来进行响应。如果您的应用程序在有人将设备置于错误状态时不会自动旋转,那么他们会直观地旋转它。你不需要告诉他们。
根据上下文自定义应用程序对旋转的响应。例如,通过旋转设备让人们移动角色的游戏可能不应该在游戏过程中切换方向。然而,它可以根据当前方向显示菜单和介绍序列。
为互动元素提供充足的间距。尝试维持所有控件的最小可打包面积为44pt x 44pt。
准备文字大小更改。人们期望大多数应用程序在“设置”中选择不同的文本大小时都能适当地进行响应 为了适应一些文本大小的更改,您可能需要调整布局。有关应用程序中文本使用情况的更多信息,请参阅排版。
有关适应性的开发人员指导,请参阅自动布局指南。