美文网首页
iOS11人机交互指南(八)- 视图(Views)- 上

iOS11人机交互指南(八)- 视图(Views)- 上

作者: Tu_卫佳 | 来源:发表于2018-05-25 11:09 被阅读0次

    一、操作面板(Action Sheets

    操作面板是响应控制或操作中出现的一种特定警示,并且呈现与当前操作内容相关的两个或多个选项。使用操作面板让用户在执行潜在破坏性操作之前或者启动任务前请求确认。在小屏幕上操作面板从屏幕底部滑出。在大屏幕上操作面板像popover一样立刻弹出。

    提供易辨识的取消选项。取消选项让用户放弃一项任务,有较高的信息层级,它应始终位于操作列表底部。

    突出具有破坏性的选项。使用红色突出不可撤销性或危险性选项,并置于操作列表顶部。

    操作面板避免可以滚动。如果操作列表有太多选项,用户必须滚动查看所有选项。但滚动需要额外的时间来做选择,很难快速点击按钮。

    开发指导请参阅 UIAlertController中的 UIAlertControllerStyleActionSheet

    二、活动视图(Activity Views)

    活动是一个任务集,如复制、收藏、查找等操作,它是用在当前页面上的内容。激活它后,可以立即执行任务,或者逐步完成多步任务。每个活动都由活动视图管理,采用表单还是浮出层(popover)样式取决于设备屏幕大小和方向。使用活动为用户提供访问您的应用可以执行的自定义服务或任务。

    系统提供了很多内置任务,包括打印、信息和屏幕投射(AirPlay)。这些任务常驻在活动视图中,无法重新排序,并且无需创建自定义任务用来执行内置任务。当然,活动视图还会显示其他应用的共享和操作扩展任务。请参阅Sharing and Actions

    设计简洁的模板图像来表示你的自定义活动。模板图标使用蒙板创建。用黑色和白色配合适当的透明度和抗锯齿处理,并且不包含阴影。模板图像应在70×70像素的区域内居中显示。

    精简任务标题。任务标题显示在活动视图的图标下方。简短的标题效果最好。如果标题太长,系统会首先缩小字号,如果依然太长,就会被截断。一般来说,标题中避免含有公司或产品名。

    确保活动适合当前上下文。虽然系统提供的任务不能重新排序,但如果它们不适用于你的应用,可以不予显示。例如,为了防止用户打印图像,可以不显示打印任务。当然,也可以在特定的条件下才显示自定义任务。

    使用操作按钮显示活动视图。 用户习惯点击操作按钮来访问系统提供的活动。访问同一活动时,避免给用户提供可选操作方式,这会让他们感到困惑。

    开发指导请参阅 UIActivityViewContoller和 UIActivity

    三、弹窗(Alerts)

    弹窗传递应用或设备状态相关的重要信息,并且经常要求反馈。弹窗由标题、可选消息、一个或多个按钮,以及用于收集输入信息的可选文本字段组成。除了这些可配置的元素,弹窗的视觉样式是静态的,无法自定义。

    最小化弹窗。弹窗会破坏用户体验,应该只能用于确认购买和不可撤销的操作(如删除)等重要情况,或通知用户有关问题。弹窗出现频率低有助于确保用户重视它们。确保每个弹窗提供关键信息和有用选择。

    纵向和横向都要测试样式。纵向和横向的弹窗可能会有不同的显示样式。优化弹窗文本,使其在任何方向下用户都能读取信息顺畅,且不用滚动。

    开发指导请参阅 UIAlertController

    弹窗标题和信息

    简短且具描述性的标题。用户在屏幕上阅读的文字越少越好。一个恰到好处的标题很重要,因为孤零零的单词很难提供有用的信息,考虑提问或使用短句。尽可能保持标题在一行之内,标题英文注意单词首字母大写,完整的句子加以适当的标点符号。不要对句子片段使用句点。

    如果你必须要提供信息正文,要短小且是完整句。尽量保持信息正文在一行或两行以内,防止滚动。恰当的使用标点符号,英文句型首字母大写。

    避免显得“责怪”、“审判”和“羞辱”。因为用户都知道,警告框的出现,是来通知他们出现了问题或者比较危险的情况的。传达坏消息但文案直截了当也比传达好消息但文案表意模糊要更好一些。尽量避免使用“你”、“你的”、“我”、“我的”这样的文案,有时候它们会被理解为带有羞辱意味或者高傲的。

    避免解释警报按钮。如果弹窗文字和标题清晰易懂,则无需解释按钮的作用。在极少数必须提供指导的情况下,请使用单词“点击”,在引用按钮时保留大小写,并且在引号中不要包含按钮标题。

    弹窗按钮

    常用两键式按钮。两键式按钮是最简单的,提供两种选择;单键提醒通知,但不能控制情况;三个或更多按钮的弹窗会变的复杂,可能需要滚动,用户体验就会差。如果需要两个以上的选择,请考虑使用操作面板代替(请参阅 Action Sheets)。

    弹窗按钮简洁,标题有逻辑。最好的按钮标题由一两个描述选择按钮结果的词语组成。与所有按钮标题一样,不使用结尾标点符号,英文字母大写。在可能的范围内,使用与弹窗标题和信息直接相关的动词和动词短语。例如,查看全部、回复、忽略。对简单的接受可使用 OK,避免使用 Yes 和 No。

    按钮位置符合习惯。一般来说,用户最有可能点击右侧按钮,取消按钮应始终位于左侧。

    恰当的标记取消按钮。取消弹窗操作的按钮应始终标记为 “取消” 。

    标记破坏性按钮。如果弹窗按钮会导致不可撤销性操作(例如删除内容),请将按钮的样式设置为 “破坏性(不可撤销性)”,以便系统获得恰当的格式。开发指导请参阅 UIAlertAction中的UIAlertActionStyleDestructive。另外,提供 “取消” 按钮,以便用户可以安全选择不采取破坏性行动。通过将其标记为默认按钮,使“取消”按钮变粗。

    允许用户通过退出到主屏幕来取消弹窗。当弹窗可见时,访问主屏幕可退出应用程序,与点击 “取消” 按钮效果相同—这意味着,弹窗在没有执行任何操作情况下被关闭。在警报可见时。如果弹窗没有取消按钮,请考虑在用户退出应用时后台执行取消操作。

    四、集合视图(Collections

    集合视图是一组有序内容,例如一组照片,布局形式可自定义且高度可视化。由于它不强制执行严格的线性格式,因此特别适合显示大小不同的项目。一般来说,集合视图是展示图像内容的理想选择,可以选择背景和其他装饰视图,从视觉上区分图片子集。

    集合视图支持交互和动效,默认情况下,用户点击即可选择,触摸并按住即可编辑,滑动即可滚动。如果应用需要,可以添加更多的手势来执行自定义操作。在集合视图中,只要插入、删除或重新排序项目,就可启用动效,并且还支持自定义动效。

    可以使用标准行或网格布局时,避免创建激进的新设计。集合视图应增强用户体验,使用户轻松选择一个项目,而不应成为关注焦点。如果很难点击集合视图中的某个项目,用户在进入他们想要的内容前就会感到沮丧、失去兴趣。在内容周围使用足够的填充来保持布局整洁,防止内容重叠。

    使用表格而不是文本集合。当文本信息显示在可滚动列表中时,查看和理解文本信息通常更简单有效。

    谨慎更改动态布局。集合视图的布局可以随时更改。当用户正在查看和交互时,如果你动态更改布局,请确保更改是有意义的且易于追踪。未激活的布局更改可能会使应用看起来不可预测、难以使用。如果由于布局改变导致上下文丢失,用户会感到不再有控制感。

    开发指导请参阅 UICollectionView

    五、图片视图(Image Views

    图片视图在透明或不透明背景上显示单个图片或动画图像序列。在图片视图中,图片可以被拉伸、缩放或固定到特定位置。默认情况下,图片视图不可交互。

    尽可能确保动画图像序列中所有图片大小一致。理想情况下,图片大小会预先调整以适合视图,因此系统不必进行缩放。如果系统必须执行缩放,所有图片大小相同时,最容易实现所需效果。

    开发指导请参阅 UIImageView

    注意:

    被配置为模板图像的图片会丢弃颜色,并采用已应用于封闭图像视图的任何色调,请参阅 Custom Icons。开发指导请参阅 UIImage中的 UIImageRenderingModeAlwaysTemplate

    六、地图视图(Maps

    地图视图可让用户在应用中显示地理位置信息,并支持内置地图app提供的大部分功能。地图视图可以配置为显示标准地图、卫星图像或以上两者。它可以包括定位和叠加显示,并支持缩放和平移。如果应用支持显示路线,例如活动路线类应用,可以使用地图显示路线。

    通常,保持地图可交互。用户习惯于使用手势和地图app进行交互,并希望能够以类似的方式与你的地图进行交互。

    使用用户预期的定位符号颜色。一个针在地图应用中表示兴趣点。用户熟悉地图应用中的标准定位符号颜色,避免在应用中重新定义这些颜色。使用红色为目的地,绿色为起始位置,紫色为用户指定的位置。

    开发指导请参阅 MapKit

    七、页面(Pages

    页面浏览控制器提供了一种在如文档、书籍、记事本或日历之间的内容页线性导航方式。导航期间,页面浏览控制器使用一或两种转换方式管理页面之间的转换——滚动或卷曲。滚动转换没有特定的外观,页面从一个流畅滚动到另一个;卷曲转换会使页面卷曲,当用户在屏幕上滑动时,就像翻书一样。

    合适时,实施非线性导航方式。使用页面浏览控制器时,页面依次流动,但无法在非连接页面之间跳转。如果用户需要在应用中无序访问页面,那么请提供此功能的自定义控件。

    开发指导请参阅 UIPageViewController

    相关文章

      网友评论

          本文标题:iOS11人机交互指南(八)- 视图(Views)- 上

          本文链接:https://www.haomeiwen.com/subject/htuyjftx.html