白癜风早期症状 http://www.bdfyy999.com/m/作者从生活中的实际情况出发，探讨了开关背后的设计思想并拆解了具体的设计细节。01生活中的反面案例故事要半年前开始讲起：那个时候我搬到了新的出租屋，房间里配置的洗衣机比之前的大了一倍，而且操作区上分布着的密密麻麻的文字和按钮让洗衣机看起来很高级，我对此很有好感。然而这种好感并没有持续多久，在我第一次使用它时：将衣物放进洗衣机——选择好时间和洗涤方式——按下启动按钮（如下图右侧白色按钮）。按下后洗衣机发出了“滴”的一声，在我的认知里它应该是开始工作了，但是10秒过后没有任何抽水声和洗衣服的声音……我疑惑地想：“是不是刚才并没有成功启动？”于是再次按下了启动按钮，又是“滴”的一声，但是这次我等了1分钟没有任何反应。之后的十分钟里，我与这台匪夷所思的机器“交涉”多次才理解了它的运行方式。这台洗衣机启动后需要等待大概十几秒才开始运行，但是在我按下启动按钮后我得不到任何反馈或者提示来告诉我洗衣机已经开始工作了，所以疑惑的我又按下了一次启动按钮，然而令人崩溃的是这台洗衣机的启动和暂停按钮是一体的，我第二次按下实际是进行了暂停操作，从而导致我第二次的困惑。如果你是这台洗衣机的设计师，你会怎么解决上述的问题呢？可能你的心中已经有了答案，但是在回答之前我们先试着探究问题的本质。人们不管是使用日常物品还是与机器进行交互，都会面对两个阶段的问题。一个是「执行」，一个是「评估」。执行时用户需要理解如何操作，操作后可能会有什么结果。评估时用户需要知道具体发生了什么，作为设计师我们要通过合理的手段帮助用户解决这些问题，保证交互的可用性和流畅性。通常我们会使用「意符」在用户执行前告知用户如何理解、如何操作、操作后会有什么结果；在评估前通过「反馈」告知用户结果是什么。对于意符的定义，在《设计心理学1-日常的设计》一书中，作者唐纳德·诺曼做出了这样的解释：人们需要某种方式了解他们将要使用的产品或服务，某些标识表明的用途，会发生什么，有什么样的替代方案。人们寻找蛛丝马迹，寻找任何可以帮助他们应对和理解的符号，任何可能标识出有意义的信息的符号非常重要。设计师需要提供这些线索，人们所需要的和设计师必须提供的，就是意符。除此之外，优良的设计要求对产品的目的、结构和设备的操作与使用者进行良好的交代。那就是意符的作用。简而言之，意符就是在用户使用前，机器为了让用户更好地理解和使用它而做出的提示。而反馈就更好理解了，机器在我们操作后做出的反应就是反馈，没有反应同样也是一种反馈。下图展示了机器与用户如何进行交互：一个合理的设计可以让用户快速顺畅地进行四个步骤进而完成任务，而糟糕的设计会让用户不断重复这个流程。之所以会出现糟糕的设计，就是因为在步骤1和3没有进行合理的意符提示和反馈提示让用户摸不着头脑，进而导致用户根据自己的猜测和过往经验来进行操作，最后得到非预期的结果。回到文章开始时的洗衣机开关问题，因为开始和暂停按钮是一体的，在没有任何意符和反馈的情况下我按下这个按钮时我并不知道我启动的是开始操作还是暂停操作。我们可以就这个问题列出以下解决方案：增加文字提示，如启动时在显示屏上显示“已启动”，暂停时显示“已暂停”；增加语音提示，启动开关后使用语音告知用户“已启动”或“已暂停”。当然解决方案有很多，每个人都可以根据场景想出不同的解决方案。与现实机器的开关类似，在UI设计中我们如果进行开关设计也需要遵循相应的设计原则。一个合理的开关设计主体包含的意符分别有两种：表示当前状态；表示操作后的状态。主体之外我们还可以添加辅助提示更加清晰地传达意符和反馈。接下来将介绍一些常见的开关类型和辅助提示类型，最后总结出体验优质的开关设计方法。02开关类型1.icon在UI设计中最常见的开关可能就是icon了，即由单一的icon通过颜色或图形的变化来表示开或关的状态。因为交互设计从古到今并没有统一的严格标准，所以到底是将开关icon的样式设计为「当前状态样式」还是设计为「按下之后的状态样式」并没有一个约定俗成的规则。然而，对比而言如今各类App设计中常见的且体验比较好的方案还是将开关样式设计为当前状态样式。如下图iPhone自带相机的实况照片开关icon就是显示当前状态。然而，并不是说将开关样式设计为当前状态样式做法普遍且体验更好就可以这样做了，有些开关的设计因为使用广泛，已经在用户的心智中扎根，我们如果强行改变反而适得其反导致体验变差。最典型的就是视频和音乐的播放暂停开关，他们表示的就是操作后的状态而不是当前状态，如下图。因此，大部分应用的开关类icon都是混用当前状态和操作后状态的，如下图哔哩哔哩的视频播放界面，播放暂停开关icon表示的是操作后状态，弹幕开关表示的是当前状态，而视频锁开关icon又变成了表示操作后状态了。是否统一倒不是关键，关键是我们是否能够让用户理解相应的意符和反馈，目标是让用户在操作开关前能够知道当前状态是什么，操作开关后当前状态是什么。举一个反例，下图中的美颜相机的夜拍模式开关就没有直观表现出当前是开还是关，这种有歧义的设计可能让新手用户手足无措，可能本来未开启的功能让用户误以为已开启，导致拍出来的照片不符合用户预期。由此我们可以看出，单一的icon开关如果没有其他的辅助提示会造成意符和反馈的缺失，进而形成较大的歧义性，用户会在疑惑中按照自己固有的心理模型和过往经验进行判断，体验因此降低。2.主体与开关分离（分离式）上一部分举了美颜相机的反例，其意符和反馈不明导致的歧义问题导致了用户的困惑，但使用「主体与开关分离」（后文一致简称为“分离式”）的开关设计可以解决这个问题，它在意符和反馈层面都给予了用户提示，可视性很强，完全解决了开关状态无法被用户感知的问题。分离式开关指的是，主体不再充当开关，只当做开关的名称或icon，另外制作一个开关传达意符和反馈，解决了当前状态与操作后状态混淆的问题，其通常的样式如下图。如下图，Faceu激萌不同于美颜相机设计方式就是将主体与开关分离，很清晰地传达了当前开关状态。大部分App的设置页面使用的开关都是主体与开关分离的方式，如下图。显而易见，分离式开关直观展示了当前状态，在消除歧义方面优于icon开关，但同时缺点也很明显，它占用了过多页面空间并美感欠佳。3.名称变化名称变化指的是开关依赖于其名称的变化告知用户开关的当前状态和操作，常见的类型如下：部分App会将开关的名称变化的方式统一，但也有部分App会将这两类进行混用，即一个是表示当前状态，一个是表示操作。下图为部分App的名称开关，我们可以将上图的开关名称类型的序号对号入座。表示操作的按钮文字具有一定引导性，用户容易感知和触发，反之，表示状态的按钮文字由于不具有引导性，如果用户没有对这类按钮形成使用习惯甚至难以意识到它是可点击的，因此我们可以利用其特性进行逆向应用引导用户的行为。比如在直播App中，我们希望引导用户
