Archive

与传统概念中的「使用」不同，「交互」的意涵是双向的。交互赋予了产品以情感，让人们得以从产品那里获得像人一样才会给出的回馈。当人与物的关系不再仅仅是「触碰」，而是一种可以获知的情感，我们才真正做到了「以用户为中心」。如果这用一句通俗的话来表述，就是別把产品不当「人」。我用三个例子来作说明。   案例一 罗永浩的 Smartisan OS 在发布之初宣称进行了70余项交互细节的改进。其中一项是当用户按下电源键后，不必再手动对屏幕进行解锁操作，而是由系统自动完成。值得注意的是，罗永浩强调了虽然由系统自动解锁，但解锁的动画依旧保留。 这样的设计可以避免用户的疑惑甚至惊慌。当使用者在已经习惯了某种解锁方式的情况下，这样的细节能让使用者从系统的回馈中获知系统的所为。此时，解锁的动画是作为用户心理的一种期待而出现。   案例二 随着 HTML 5 技术的普及，在现在的网页上，我们越来越多地看见这样一种效果，即网页以滑动的方式平滑地滚动至目的地区域，而非传统超链接的直接跳转。 当页面的运作方式简单直观而且赏心悅目地呈现在用户眼前时，使用者清楚地从产品中获得回馈：从何处来到此处。   案例三 谷歌的 Web 设计足为众人之师，其中很重要的一点就是它细致入微的交互效果。而众多交互细节中，「鼠标所到之处均有回馈」这一点堪称经典。 最后，我用《向Google学习打造灵动的web体验》一文中非常形象的话来作为结尾：「就好比和人交谈，如果他对我的话语没有任何反映，我也会减少对他诉说的兴趣，如果他时而点头，时而微笑，时而赞许，那么我可能会有更多更有意思的事情告诉他。因此，哪怕仅仅是边框的颜色变深了一些，也能表达这个页面对使用者是友好的，而不是不理不睬的」。

开门见山，对于本文标题的论述，我给出的最根本的理由就是：标签（tab）不只是一个标签那么简单，它更包含着底下的内容区域。所以请首先搞清标签的结构。 也许我这么描述不太容易理解，那么下面这张图应该能让我的想法一目了然了。 其实，这种标签页的设计应当是来源于传统资料夹的外观。或许大家没见过实物，但一定见过 Mac 或 Windows 系统中文件夹的图标，这是一个根据现实物体进行设计的隐喻（如下图）。 这些标签实际是起引导作用。想像一下，当你找到了标签之后，拿住它一拎，随之而出的一定是一个文档袋，而不会仅仅是那个标签——这已经形成了一种普遍的心理期待。 这种设计，在自 Windows 7（或Office 2007）以来，已经成为了被微软普遍运用，并命名为 Ribbon UI。 在使用此类设计时，每个标签之下，都有一个对应的功能区域。 所以，当点击标签之后，若弹出的是一个视窗，那么用户便会感到困惑，因为这违背他们的心理预期。虽然多数情况下这对实际的使用影响不大，但就整体的设计框架而言，显然不够严谨。 对于同样的操作却带来了不同的效果，明显是犯了对功能定义不清的问题。再举个类似的例子，在 Windows 系统下，直接拖动一个档到一个资料夹内，同时包含「复制」或者「移动」两种不同的结果，所以用户在使用这个功能时就会产生困惑。毕竟让用户进一步去判断什么时候会产生「复制」的效果，而什么时候会产生「移动」的效果过于复杂了（解答：在同一硬盘分区内的跨文件夹拖动起「移动」的作用，而再不同硬盘分区或不同硬盘间跨文件夹拖动起「复制」的作用）。 这样的问题现在普遍存在，比如中国的某款知名软件： 在上图中，当用户点击顶部的功能导航按钮时，心理期待的是当前的界面发生变化，在现在的视窗中就能有所显示并完成操作。但在实际使用中，当用户点击了标签按钮之后，一些会带来这样的效果，另一些（如「软件管家」）点击后却会弹出一个新的视窗。 在这里我做了一个小小的改动，如果是下面这样，软件的交互设计规范就更趋于统一。 综上所述，界面元素中，各个部分各具其职，更当各司其职（哪怕对实际使用影响有限）。若非如此，元素的功能定义没有标准，这种糟糕的习惯将让未来的交互设计之路寸步难行。 所以，尽管吹毛求疵，但必须旗帜鲜明地反对标签起连结的作用。