Tasks:Metro风格应用的统一设计
Tasks:Metro风格应用的统一设计-移动阅读二维码

3 交互动作

3.1 选取

 

(Windows 8的选取)                                                           (Windows Phone的选取)

在 Windows Phone 中多选操作通过列表框中的勾选框完成。在 Windows 8 中单个选择和多选操作都通过 cross-slide交互动作来完成。

在 Windows Phone 中当用户点击选取按钮之后,应用会根据当前情境切换显示为选取模式,这时用户可以通过点击操作选取多个对象。Windows 8 也采用了同样的方式处理这种情况。

3.2 情境应用菜单(Contextual Application Menu)

在Windows Phone中,应用菜单(application menu)既可以是页面间的导航工具(naviga- tional tool),也可以是命令工具栏(command toolbar)。当作为导航使用时应用菜单总是可用的,但当它作为对数据内容的操作命令菜单时,其可用性需要视具体的数据而定。当用户选取了对应的数据集时,应用菜单需要显示在屏幕下方并且使用户知道命令切换至可用状态。在 Windows Phone 版 Tasks 中,我们将应用菜单作为命令工具栏使用。通过结合内嵌操作命令,使应用菜单成为一个强大而灵活的工具箱,以帮助用户管理自己的数据(如任务、项目或类别)。在应用中我们未曾考虑将应用菜单作为导航工具,因为应用菜单中已经包含了许多任务,同时我们无法将导航和数据操作这样两种完全不同属性的交互动作混合在一起。同样我也完全不建议其他开发者这样做。

(应用菜单的操作按钮会根据页面或内容不同而变更)

在 Windows 8 中用户轻扫屏幕顶部或底部边缘会显示应用菜单,在作为导航菜单时用户选取某个对象也会显示。在这两种情况下应用菜单显示的命令会有不同。在没有选取对象的情况下,应用菜单中的命令应该是在应用中通用的操作命令。例如在 Tasks 中“新建”和“同步”命令按钮会一直显示在应用菜单中。但是应用菜单并不保持显示在屏幕中,需要用户通过手势才能显示我所建议的内容。

(没有选取对象时的应用菜单栏)

在选取对象的情况下,应用菜单中的操作命令按钮需要根据选取的对象确定。Windows 8 的应用菜单功能可以是主要的应用菜单也可以是针对某个内容对象的操作菜单。我强烈建议为通用的操作按钮和情境操作按钮设定风格一致的固定位置。例如在 Tasks 中通用操作按钮放置在靠近右手拇指的右侧,而情境操作按钮放置在靠近左手拇指的左侧区域,并以此作为拇指(谁这么多拇指:P)操作的交互规则。这样符合交互设计中的一条重要规则,即可预见性,也就是在用户期望能够操作的地方提供操作按钮。

 

(在所有的任务页面中有一个对象被选中时的应用菜单栏)

但是应用菜单并不保持显示在屏幕中,需要用户通过手势才能显示我所建议的内容。

3.3 内容的关键动作(Critical Actions in the Content)

接下来的会有一点复杂。我之所以用到“关键的”(critical)这个词,是想说明这些操作动作会对用户的内容做一些很重要的操作。作为一名设计人员,我们的工作需要从所有任务中区分出最重要的,并通过设计手段强调他们的重要性。当我们决定在Windows Phone 版 Tasks 中将应用菜单作为操作命令区后,我们要对关键的操作动作进行区分,并把它们以图标按钮(icon buttons)的形式放置在 app bar 中。其他的菜单选项放置在应用菜单当中。通过这种方法确保关键性的操作按钮可以保持可见。比如对于一个任务来说,重要的动作应该包括:确认完成、编辑和删除,而pin到首页、今天完成和延期一天等操作则不那么重要。

 

(WP版Tasks中的动作优先级)

Windows 8 的应用中关键的动作应该与 Windows Phone 中保持一致,但有一点不同,即在 Windows 8 的应用菜单并不总是可见的,因此我们无法使用与 Windows Phone 中相同的方式处理。我们可以将关键的动作按钮放置在内容区域中,而把其他的动作放在 app bar 上。

 

(Windows 8中的关键动作按钮放置在任务标题上方,位于内容区域当中)

4.触摸操作

假如 Windows Phone 只能通过触摸界面操作,其触控规则与在 Windows 8 中一致。微软发布了一个全面的指南是一个很好的总结参考,在指南中包含对于触摸界面你所需要知道的一切内容。在此之外我需要做一点提示,有一些方式是有像素限制的。你需要针对 Windows 8 触摸屏幕的默认像素密度计算你所需要的像素大小并对此有一个确定的方案。在大多数情况下设备的像素密度是不同的,例如 Nokia Lumia 800 采用252 ppi的像素精度,而 Nokia Lumia 900 采用217 ppi的像素精度。这些只是手机设备的情况,对于 Windows 8 所有设备所采用的硬件类型和屏幕像素密度我们尚不清楚。所以如果能够确定一些物理指标(如毫米)可能更好一些。在你设计软件的过程中对这些方面很难预料,这也是为什么我们说尽可能早些在足够多的触摸设备上调试原型是非常重要的。

以下是我总结列出的在触摸交互设计中最重要的几点:

  • 目标和目标尺寸必须足够大,在最大限度上减少用户误操作。
  • 为用户触摸提高可见反馈,可以是动画动作或更改图案,等等。
  • 为cross-slide交互进行设计(在 Windows 8 中),对页面进行设计,确保用户只在一个方向平移视图。

在 Windows 8 平台应用设计的过程中不要忘了把鼠标和键盘,在你的应用的大部分重要特性中都要支持这两样设备的可接入性,所有的任务也必须可以通过鼠标或键盘的操作实现。

微软建议开发者使用横向视图,因为这样对屏幕空间的利用率比较高,同时在一个视图导向的设备上能让用户感觉更加自然。但是我建议开发者应该根据你所呈现给用户的信息类型来决定使用何种视图。无论是Metro原则还是UX指南都没有要求设计决策应该脱离于具体的情境,仅仅为了设计而设计。设计人员的意义在于思考并确定什么方式是对用户来说最佳的选择。用户体验的重要性先于遵循规则。

本文链接:http://www.mobileui.cn/tasks-metro-style-applications-unified-design.html
本文标签: , , , , , , ,