三、不要打断任务流

用户在每选择一个操作时都希望当前的任务是连贯的。页面刷新会人为的造成用户体验――或者说用户心流的中断。

[在由harper pernnial 出版的《心流：最佳体验的心理学》一书中，把心流定义为：当人们进入一种全神贯注的状态时，他会感觉一切都是水到渠成，不费吹灰之力。]

1.三个重要的交互相应参数

Jakob Nielsen提出了关于交互的相应参数，这三个准则30年后的今天依然是不变的。[Miller 1968; Card et al. 1991]

0.1秒 是用户判断系统瞬时反应的时间，意味着在该时间内显示反馈结果用户是可以接受的。

1.0秒 是用户保持不间断的思维流的限定时间，即用户会注意到这样的延迟。如果没有特别的信息反馈该操作超过0.1而少于1秒，他们会比较难以忍受。

10 秒 是保持用户关注当前对话框的极限时间。对于长时间的延迟，用户会想在等待计算机完成期间处理其它事务。所以需要显示计算机将要完成的时间（通常选择进度条或百分比来表示），不然用户期待会大打折扣。

另外，用户的反应时间不仅仅有上限，同时也有还有下限，也就是说他是一个阈值区间。在视觉感知领域，人眼观看物体成像于视网膜上，并由视神经输入人脑而感觉到物体的像。当物体改变时（时间小于等于0.05秒），由于视神经对物体的印象不会立即消失，因此感受不到它的变化。人眼的这种性质被称为“变化视盲”（change blindness）。因此我在上述3个响应参数的基础上，加入了0.05秒这个参数，作为衡量人眼对计算机作出反馈的最小值。[注：也有数据显示0.04秒]

Gtalk

我的Gmail里通常嵌入gtalk 组件 ，在我的鼠标移动相关好友名字上时，该好友区域高亮显示，且显示覆盖层显示该好友详情。鼠标移出时该覆盖层消失。这两个过程的覆盖层响应时间都控制在0.1秒时间内，用于响应用户的反馈。另外，当鼠标悬停后快速（<0.05秒）离开高亮区域时，覆盖层并没有随之消失，这是为什么呢？由上述的用户最小反应时间可以看出，正常情况下用户操作鼠标移开的时间也应大于0.05秒以上，如果小于这个值，多半属于非正常情况下的用户操作行为。比如：手指不小心碰了鼠标一下等。这时候设计师将这种情况判断为防止用户误操作而依旧显示覆盖层信息，想的所么体贴啊！

2.用虚拟的视觉效果

当页面加载时间过长时，用虚拟的视觉效果提前给用户展现，来满足他们的预期，是个不错的办法。

live的图片搜索在图片加载过程中将数据正在读取的图片用灰色背景填充而不是显示空白，让用户感觉这个加载的时间不会太长。

3.缓解长时间的操作疲劳

TED是一个关注分享科技、娱乐、设计等领域前沿思想的视频网站。这个网站不单单是我常去汲取灵感的好地方，他们的播放器设计也是我认为做的最细致的。上图正在播放一个教授的演讲，鼠标移动到播放进度条上时我们会发现：当前视频被自动化分出不同片段，你可以hover查看详细文字提示并点击定位到该片段去播放。很棒对吧？该设计充分考虑到用户长时间观看视频带来的疲劳，或者被迫中断以后重新定位的不便，于是将大于16分钟视频做了划分。

    我们有句古话：叫“酒香不怕巷子深”。可是在互联网你如果遵循这句话就会死得很惨。因为我们的服务实在太多了，用户如果找不到他们想要的信息，会毫不犹豫的离开。提供邀请有利于帮助他们建立熟悉的体验。

上图是Absolutely网站的设计师的个人blog，他的blog独特点在于每个页面内容都经过精心设计。而Twitter是他积累思想和灵感的常用工具，因此在页面的首页都大大的显示了“follow”的信息提示和邀请。在这里关于邀请的细节他做了很多尝试，我们不妨来看看。

可以看出，设计师仅仅改变了邀请文案，从之前的“我做什么”改成“你可以做什么”到“你可以在哪里做什么”，就将follewers的百分比提高了2倍。

Google docs

Google docs在“share folder“功能刚上线时，采用了两种邀请方式：一个大大的覆盖层指向“my folders”，帮助说明告诉用户如何使用以及share后的提示信息。并提供以后查看或关闭该邀请提示。关闭后还可以点击页面上方的链接查看详情。

2.动态邀请

动态邀请适合提示用户当前页面包含什么功能。用户一般没有耐心去看文字，利用动态邀请可以在交互过程中吸引用户，并引导他们进行下步操作。

Google map

Googlemap增加的“街景”模式浏览用小黄人引导发现新功能。

案例

我在做淘宝的评价时，也用到了邀请引导。为了让用户发表有帮助性的评论，在输入框运用了文案的邀请提示。同时“店铺动态评分”的星星打分的拖拽属于比较高级的操作，需要告诉用户怎样打分，并用图形将打分后的结果显示出来。

建议继续学习：

1. 瞬间的设计（二)    (阅读：1438)
2. 瞬间的设计(四)    (阅读：1422)
3. 瞬间的设计（一）    (阅读：1308)