WP7交互特性浅析及APP设计探究

Windows Phone 7 是无线领域的新生力量，但是迟迟没有进入中国市场。Mango（注意 WP7 和 mango 不是一个概念）的发布带来了中文的操作系统，也让人们看到了该系统的无限可能。在此，我结合自己在进行相关应用设计的经验以及自己对 WP7 系统认识和理解，浅谈一下这一特别系统的交互特性。

　　本文索引：

• 涅磐重生的 WP7（以及它的历史简介）
• WP7 对比 iOS 和 Android
• WP7 设计风格
• WP7 内容和结构框架及特有名词解释
• WP7 交互特质分析
• WP7 应用设计建议

　　（一）

　　什么是 WP7？

　　Windows Phone 7 是微软发布的一款手机操作系统，它来自于微软但是和之前的 Windows Mobile 系统却截然不同。可以说微软的操作系统应该大致分为两个时代：Windows Mobile 时代和 Windows Phone 时代。

　　Window Mobile 时代

• 十年前一个基于 Windows CE 的移动智能系统被开发出来，这就是 Windows Mobile 的原型版本。Pocket PC 发布, 代号 Rapier (双刃剑)，发布于2000年4月19日，这是一个里程碑的事件。这也是后来被称为 Windows Mobile 的操作系统的首次亮相。
• Windows Mobile 2003 的原代号为”Ozone”(臭氧)，发布于2003年6月23日，是第一个版本的 Windows Mobile。
• Windows Mobile 6.5 是 Windows Mobile 时代的最后一个作品，但其根本上的，研习 PC 上严谨但死板的操作体验，终于在 iPhone 和 Android 的打击下，变得不堪一击。微软亟需一次蜕变。

　　WP7时代：

• 2010年2月15日，微软在全球移动通信大展上公布 Windows Phone 7。
• 2010年10月11日，微软正式发布了 WP7，并同时宣布首批采用 WP 7 的9款智能手机。
• 2011年5月24日，微软正式发布 WP7.1(或称7.5代号 Mango)，表示 Mango 的三大要素是“通信、应用与网络”。
• 2011年9月16日，微软正式在台湾地区推送 Mango。
• 据称，在接下来，或将推出应用于中国大陆地区的操作系统 Tango 以及代号 Apollo 的 Windows 8 操作系统。

　　Windows Phone 7.0 完全脱离了旧构架，一个未完工的系统，这大大影响了其体验的评价，尤其在中国。Mango 带来了500多项改进和创新，当然还有完美的中文支持，基本形成了一个比较完善的手机操作系统。

　　WP7 制定了硬件最低标准，这是为什么呢？WP7的目标是为多方手机生产商提供服务，所以不会像 iPhone 一样，在硬件上十分标准一致，但是其对本硬件都有“最低需求”，这保证了其不至于像 Android 那样出现碎片化的杂乱场面。

屏幕

800×480 WVGA，支持多点触摸（最少4点）

硬件按钮

WP7设备至少要具备3个按钮：后退，HOME 键，搜索

处理器

Qualcomm Snapdragon MSM 8×55（主频1GHz）或 MSM 7×30（主频800MHz） CPU（支持 DirectX 9）。

内存

至少512MB

内部存储

最少8GB

外部存储

扩展大于等于16G

无线

WiFi、蓝牙、A-GPS、FM

摄像头

至少500万像素，有闪光灯

其他

加速度感应器、指南针、亮度感应、外部键盘（可选）

　　目前 WP7阵营的支持厂商：三星、LG、HTC、诺基亚、宏碁、富士通、中兴等。毫无疑问，微软和诺基亚的合作是最应该被人们所重视的伙伴。

　　WP7, iOS, Android

　　毫无疑问，iPhone 拥有着最庞大的 APP 资源，其现在的 APP 数量是 WP7 的10倍以上，比开放的安卓也多出很多。其在品牌价值上的优势也不可忽略，用户对于 iPhone 的认可度非常高。然而，作为只专注于一台手机的策略，其在保证了最优手机硬件配置的前提下，也让用户缺少了更多的选择，如何能更加个人化个性化，也是选择 iPhone 时不得不思考的问题。再有，iPhone 的体验设计从出现至今已经延续了快4个年头，但是我们没有看到其在 UI 在交互方面有多少重大的突破。这里我弱弱的问一句，大家没有觉得 iPhone 的 UI 已经有些过时了么？这一点，我们至少可以从现在 APP 各种不拘规范的设计上看出一些端倪。

　　Android 的优势在于开放，它应用于不同的硬件生产商，允许开发者深度开发不同的 ROM，给用户带来的很多惊喜，这也让他的设计体验与时俱进，不会落伍，并满足用户多元化的需求。然而 Android 也受制于自己的开放性，开放带来的无论是硬件还是系统的碎片化，给用户给谷歌给生产商都带来了很大的困扰。

　　WP7 作为一种全新的体验模式，给用户带来了跟多的惊喜（当然并不只是惊喜），相信会被越来越多的用户所接受。在硬件方面则取了两者之长，它利用自己自身系统的特点，既提供给了生产商嵌入自己特色应用的入口，又保证了用户可以进行最快速的系统升级等服务。个人认为在体验方面，WP7 是超前的，他有一个高端的外表，也有很多体贴的细节设计。另外，在目前的操作系统中，WP7 的系统优化应该是做的最好的，很低的配件就可以达到非常乐观的流畅度，这一点是其他系统不可比拟的，也为 WP7 平台适应不同价位段市场提供了很好的基础。另外 WP7 的进行的本地化推广战略，也是未来手机系统的一种趋势。但是其推出时间稍显滞后，新系统必须获得足够多的用户接受，而 WP7 的入门稍显困难，这一点也很有可能把它带入困境。创新的东西总是会带来挑战和风险。

　　我不赞同说 WP7 前景不被看好是因为用户没有任何理由放弃安卓和 IOS，当然我也不赞同说 WP7 会打败 IOS 和安卓。未来的智能手机市场，不会出现一统天下的情况，只会是群雄逐鹿，此消彼长。不可能说一种或三四种操作平台就可以满足所有用户的需求，因为用户的需求是无穷尽的，而创新也是无穷尽的。

 　　（二）

　　“流畅、干净、周到、开阔、非常个人化，而且未完工”

　　这可以说是在体验了 Windows Phone 7.0 系统之后我的感受，而 mango 之后恐怕要把最后一条去掉了。要谈 WP7 我们恐怕总是不得不说这样这样几个特有名词："Metro", "Live tiles", "panorama", "pivot", "Hubs" 等等。

　　WP7 的视觉设计风格：Metro

　　WP7 的 UI 是基于一个叫 Metro 的内部项目。灵感来源于机场和地铁的指示系统。

　　三种常用元素：

• 明显的色块
• 象形的图形
• 简短的文字

　　五点原则：

• 干净，轻量，开放，快速
• 要内容，而不是质感
• 整合软硬件
• 世界级的动画
• 生动，有灵魂

　　当然仅仅 Metro 是不够的，图片加图形或文字的形式也是 WP7 的主要视觉风格之一。

　　目标用户：

　　WP7 系统定位的目标用户是：忙于私人和工作事务的高效能人士。针对此类目标用户，WP7 系统在提供给用户的使用上注意以下几个问题：

• 个人化 – 用你的方式去过一天
• 关联性 – 你身边的人，你周围的环境
• 连接性 – 你自己的东西，你自己的思考和关心

　　WP7 的交互特性：

　　lock wall 惊艳开场：

　　WP7 的锁屏界面由一张可更换的墙纸和若干提示信息构成，仅有时间信息和状态栏是必然存在的。整体的视觉风格非常简单轻量化。第一次点击，墙纸会做上下运动，带来了很好的使用引导。用户根本不需要关心手指点触的位置，只需要轻轻向上滑动超过1/3就可以完成开锁任务，墙纸会像大幕一样拉开。相比 iPhone 来说更加简单，整体视觉感官上也更加舒适。

　　WP7 的结构框架

　　Start view

　　用户自定义快捷入口，可以是 APP，可以是某个文件，可以是某个集合，可以是某个订阅，你可以“pin whatever you want”。

　　App list

　　所有 app 的集合，mango 增加了快捷检索和搜索。

　　Panorama

　　适用于多功能整合的综合性 app, 原生系统用它来实现了自带的5个 hub: ZUNE, PICTURE, LIVEBOX, PEOPLE, OFFICE, MARKET PLACE.

　　pivot

　　适用于内容丰富，但是功能结构不是很深的 app 或做 app 的子层级：原生系统用它来实现了短信\日程表\邮箱\设置。

　　list

　　适用于内容和功能简单的 app 或做 app 的子层级：原生系统用它来实现了通讯录。

　　Tools

　　适用于功能比较纯粹 app 或做 app 的子层级：原生系统用它来实现了闹钟\计算器\相机\浏览器。

　　下面将就几个 WP7 特有的名词进行解释。

　　 Start sreen

　　Start sreen 是用户进入后直接面对的第一屏，也是在任何情况下，点击物理 HOME 键即可回归的主屏。

　　它的主要组成元素只有一种，就是 Live tiles。其本质类似于 PC 操作系统的快捷方式，但是承载的信息更多，更加动态，也更加自由和个性化。

　　Metro 风格的指向箭头会把用户清楚的引导向 APP list。另外就是被弱化功能的状态栏。

　　小瓦片大智慧—-live tiles

　　Tiles（瓦片）其实是一种快捷方式和推送机制的结合体。它是实时的，动态的，内容丰富的。这个词汇可以拆分成两个单词：live 和 tiles, Tiles 可以是什么呢？

它可以是一个原生的 APP 快捷方式+实时的更新信息提示 它可以是一个第三方应用的快捷入口 它可以是某个联系人的快捷入口 他可以是一首歌的快捷入口 一个列表或者榜单的快捷入口 一个游戏的某一关，一个特别关注的微博，一个相册 

　　似乎任何手机上的信息，只要用户有需要，只要我们的 app 上给用户授权，都可以在 Start screen 有一个入口。这样深层次的定制化逻辑，给用户带来了更加个人化的使用体验。

　　Live tiles的表现形式其实也是比较多样的：

　　他们都是 tiles，为什么会有这样多的差异？其实他们的结构都是相同的。一个 Tiles（瓦片）是由正反两个面构成的，开发者可自行选择是否全部采用。

　　正面：

　　一张底图（可以是图片或图标或图片加图标）

　　标题

　　更新通知

　　反面：

　　一张底图（可以是图片或没有）

　　标题

　　内容

　　Tiles 正反两面的元素，开发者自行进行选择元素的存留。加之背景的差异，瓦片在视觉上的差异化，使得整个 Start screen 显得不会呆板平淡。

　　动画形式：

　　翻转：

　　平推：

　　Tiles 的功能除了提供入口之外，还担当着更新本地动态，显示推送服务的角色。Tiles 上的背景，和反面的内容都是可以实时更新的，正面和反面可以通过两种动画进行切换，在加之更新提示，使得 tiles 出色的承载了更多的信息，同时给系统带来了灵魂和生机。这也是 WP7 系统一种特色的通知形式，Tile Notification。

　　Tiles（瓦片）让用户拥有了更多的个人化个性化的定制空间，同时也给用户提供了更深层次的快捷入口。动态的推送提醒机制，各种随时而动的小动画，可以让用户第一时间知道最新的变化，也为整个系统带来的生机和灵魂，同时为更多信息的承载，提供了条件。WP7希望用这样方式达到快速、个人化的目的，而我们在做相关 APP 开发时，也可以充分利用这一特性，给用户带来惊艳快速的体验。 

　　HUBS

　　WP7 在功能上对整体结构进行了整合和划分，采用了六个全景 HUB 分别是：

• ZUNE — 影音
• PICTURE — 图片
• LIVEBOX — 游戏
• PEOPLE — 社交与通讯
• OFFICE — Office 工具
• MARKET PLACE — 市场

　　另外也给厂商提供了第三方 HUB 入口，如: HTC HUB。

　　HUB 不是一种单独的应用那么简单，正如其名字一样，“集线器”“枢纽”他更多的展现的是一种纽带的作用，重视与其他程序综合化得处理。使得户对某一类信息进行处理时的行为是连续的。每一个 HUB 都可以在其应用中连接到其他的 app。WP7系统及追求使用操作的流畅，同时也追求信息流的流畅。以 music+video 为例，用户可以直接在这个 HUB 中搜索相关的 app 应用，然后安装。用户也可以直接从 HUB 里面相关的 app 列表，链接到相应的 app 进行音乐的其他操作。

　　Panorama（全景视图）

　　滑动的世界 —— 流畅的不会迷失的导航极其扁平的信息构架，WP7是一个滑动的世界，他会引导用户尽量通过滑动去切换去导航。全景视图是 WP7 特有的交互形式之一，它一般应用于 app 的第一层级。画卷式的操作形式，既给用户带来了方便流畅的操作体验，也给 APP 本身带来了更宽广的空间。

　　全景视图下原则上是支持所有控件的。再加上这个视图本身的广阔的空间，为这里提供了无限的可能性。上图是 QQ 音乐 mango 1.1 版的全景布局。它不仅让用户在滑动中就可以完成一级导航的任务。由于其独特的空间特色，可以安排更多的内容，使整个信息的构架更加扁平。所以其适合应用于结构关系比较复杂的 APP。

　　全景视图的空间结构示意

　　全景视图的背景是可更换甚至可随机变化，这为我们免去了做皮肤的烦忧，而且给用户带来了更多的自我发挥的空间和个性化的体验。

　　使用全景视图注意事项

• 虽然全景的扩展性很强，但也要量力而为，过多的 View 不仅带来了 APP 的运算压力，影响流畅性，也会增加用户导航的操作难度，甚至让其迷失。此处建议3~5个。
• 同时也要注意每一个 View 之间的视觉差异，避免用户迷失其中。
• 另外，杂志/画册是很好的参考物，尤其是在排布和 UI 方面。

　　Pivot（枢轴视图）

　　Pivot 是 WP7 比较创新的一种页签的操作形式，由标题、页签和内容组成。滑动内容和页签都可以进行页签切换操作，同时也支持点击直接切换页签。

　　滑动的魅力是强大的，用户不用去思考他的手指要点击哪里，会不会出现误操作之类的问题，他只要轻轻滑动页面，就可以轻快流畅的到达到要去的地方。减少停顿，让行为连续起来，再一次体现在系统的设计中。与全景视图相比，PIVOT 更加注重体现内容，而不是结构，所以其适用于结构关系比较简单，但是内容比较丰富的 APP，当然其也适合做全景页面的下一层级使用。

　　但是并不是完美的

　　Pivot 的形式虽然用滑动的操作给用户带来了新颖和快捷的操作体验，但其页签的循环和变化在很多情况下却也容易让用户迷失其中。在设计的时候需要谨慎采用，尽量减少 pivot 的页签数量，并且不能出现 pivot 页面下继续出现 pivot 的情况。

　　在 QQ 音乐上，我们的解决办法是在全景视图下就给用户预设 pivot 中每一个页签项的入口，这样可以让用户以最快的速度到达他的目的地，同时也保留了其在 pivot 下切换页签的权利，既快速到达，又保存了行为的连续性。另外，在使用 PIVOT 的时候需要用字体大小和颜色来引导用户，使其预知哪些是可以点击的，哪些是导航的，其实这是整个 WP7 系统要注意的问题。

　　在对一些WP7的交互特性进行了解释和分析之后，这里笔者也总结了一些系统的特质。

　　一、永远的开阔：去边界化设计的极致体验

　　去边界化的设计遍布了整个 WP7 系统，这是一个全新的尝试。在 WP7 系统中，我们基本看不到在其他系统上随处可见的各种栏：标题栏，状态栏，工具栏…Bla Bla…所以，我们看到了一个更加广阔的视野，更加舒适的 Screen。上图是同一个页面，在 WP7 和 IOS 上的对比，很明显，WP7 的视野更加开阔，整个屏幕都是风景，而 IOS 则让人觉得看到的是一扇窗户中的风景。当然这样做也是有足够的风险，用户的识别性降低了，功能区域的划分也不明显。WP7 的解决思路就是尽量让用户看到的都是可以点击的，用字体大小、颜色来引导用户去区分目标的属性，目前来看，本人还是可以接受并习惯的。

　　二、连接一切：完善贴心的提示系统

　　WP7 的提示系统有很多种，不同的场景应用不同的提示系统，除了之前介绍的 Tile Notification，这里的将给大家介绍一个最普通 Toast Notification。

　　WP7的 toast 跟平常情况下的 toast 基本差不多，展现形式如图，但 WP7 给他加入了更多的可控因素：点击 toast 直接进入相应的应用，或者划开 toast 不在意。在 IOS5 上，苹果也采用了类似的形式。这样的提醒既没有干扰到用户的正常使用，又方便的给用户提供了专场的出口，可谓贴心，而且不知不觉把应用都连接了起来。

　　三、充满空间感的动态世界：空间层结构–动态、动画与等待机制

　　WP7的动画是一大特色，同时也是充满了空间感。而这一点在设计的时候最好给予关注，“让用户把等待变成一种享受”。

　　四、减少输入的快捷体验：强大的本地检索

　　WP7 的本地检索，既有分类的作用，又可以达到快速的检索，而且具有很好的扩展性。尤其是对于分栏项目很多的页面设计，我们可以从中得到很多启发。

　　五、扬长补短、语义明确：创新的工具栏

　　在 iOS 或安卓上 toolbar 的处理一直让人头疼的一个问题是：单纯用图形化的图标，用户会迷茫，使用图标加文字，会浪费空间，于是经常两难。而 WP7 则秉承他开拓空间的传统，使 toolbar 有了一种更新颖也更贴心的展现形式。正常状态下，toolbar 为单纯的图标然后又一个提示用户点击的“…”，或者只有“…”，这里放置的图标是用户最常用和最容易识别的功能。当用户对图标不理解的时候点击工具栏“…”，工具栏会拉起，显示图标的文字解释。工具栏图标最多可以放4个，当有更多，或者不常用或者用图标难以表达的功能，则以菜单的形式至于图标下方，做隐藏，点击“…”时，上拉弹出。

　　WP7精神

• 注重程序之间联系与转化，无处不在的快捷入口和操作性更好的提示系统，滑动为先的导航操作，让用户的使用行为更加连续顺畅，更少的停顿和思考。
• 各种各样的个人定制，让整个系统更加自由，个人化，个性化。
• 扁平的信息构架，简化操作层级，更加直接，快速。
• 去边界化的视觉，让用户的视野更加开阔，使用感受更加舒适。
• 充满变化与动态，实时的告诉你你的系统是活的，有灵魂的，并且正在发生着什么。

　　WP7 应用开发中交互设计和 UI 设计的几点建议

• 轻量化趋势（去边界）
• 怎样扁平信息
• 怎样开发空间
• 减少用户的思考，不停顿
• 手势的高级化：点击更多→滑动更多
• 用 WP7 的思维去认识这个平台（社交、联系、快速）
• 流畅轻量为先
• 给用户更多个性化空间

　　结语：

　　WP7 的意义不在于它在市场上能否会影响甚至击败苹果或者安卓，而在于在体验方面他确实进行了很多前卫而有意义的尝试。

　　还是那句话，未来的移动互联必然是多元化的诸侯纷争的格局，我们应该对更多新的东西给予宽容和机会，因为他们确实能给我们带来惊喜。