并不简单!帮你提表单使用效率的四个界面设计技巧.pdf

并不简单 ！帮你提升表单使用效率的四个界面设计技巧 编者按 ：作为世界最 名的客户关系管理软件巨头 ，Salesf o rce 在CRM软件设计上有着深入的了解 和过硬的设计和开发经验。诸如CRM这类企业级的软件中 ，表单类的界面非常多 ，这也促成了今天 的这篇文章。一个优秀的表单到底要具备怎样的素质 ？如何提高表单的用户体验和使用效率 ？看 看Salesf o rce 的团队是怎么做的。 Salesf o rce 用户每天都在和表单打交道 ，无论他是销售人员、主管还是经理。所以 ，对 于Salesf o rce而言 ，能否无缝地添加、编辑、删除信息就是确保企业生产力的核心因素和驱动力 所在。这也是为什么Salesf o rce的UX 团队将表单设计和编辑作为新产品 Light ning Experience的 核心。 1、标签字段的对齐 在Light ning 中 ，表单里的标签和它所对应的输入字段是一起左对齐的 ，并且标签处于输入框的上方 。这种设计方式可以让用户操作更加省心高效 ，和之前的版本相比 ，用户在浏览和操作的时候 ，只 需要进行上下眼动就可以搞定一切 ，无需左右扫视。 一切都是左对齐的 虽然新的设计会在垂直方向上占用更多的空间 ，但是标签和字段的匹配会让整个界面在视觉上更加 易用清晰。为了让用户在输入的时候看得更清楚 ，成对的字段和标签会更加靠近 ，两个不同的组之 间的间隙会更大。无需左右扫视之后 ，用户可以更加顺畅地填写表单。 在视图模式之下 ，我们采用了相同的原理来设计 ，这样使得信息的层次结构更优秀 ，同时确保了整 体的可读性。 2、设置默认值 如果你是一名销售人员 ，你的工作内容可能涉及到同潜在用户进行沟通 （也就是“Leads” ）。如果你 想在Salesf o rce中跟踪这些潜在用户的信息 ，那么通常你得先创建一个相应的档案。如果要这么做 的话 ，可能会创建下面的这种Lead 表单 ： 在Salesf o rce中创建一个新的Lead 表单 看起来很简单 ，是吧 ？但是如果我们仔细看看 ，就能逐渐找出这种表单在设计上的门道。第一个可 编辑的字段是“Lead 状态” ，它包含了以下选项 ：无联系、有联系、开放状态、合格、不合格。 研究表明 ，设置一个默认值会引导许多人在多种不同的语境和环境下选择默认选项。好了 ，回到最 初的问题 ，如果你是一个销售人员 ，在同新的潜在用户的沟通的时候 ，第一次填写这个表单的时候 ，你可能会更倾向于选择“开放状态”而非空着不填写。 好了 ，在绝大多数的情况下 ，新建一个Lead 表单的时候销售人员会选择“开放状态”。而在之后每次 新建这类表单的时候 ，在这个字段上耗费一两秒来进行选择。但是如果这种表单的数量非常多 ，比 如有几百份 ，那么这个修改成本就非常之高昂了。这就是为何要为一些字段设计默认值。 3、预填写相关字段 许多记录的相关页面会根据“发布者”来执行一些预制的操作 ，比如创建新的任务和事件 （我们在淘 宝下单的时候 ，系统会帮你填写预制的默认收件地址、收件人和联系电话 ，这种机制与之类似 ）。 那么我们看看下面的页面 ： 发布者登录之后触发的操作 系统会自动填写发布者信息 在理想的状态下 ，用户会认真填写每一个字段的详细信息 ，然而事实上用户并没有这么做。 在这个案例中 ，这个Lead 表单是关于一个名叫 alt er Junio r的人 ，并且这是执行一次调用之后显 示的界面。这个用户相关的信息包含了四个字段 ，而其中“姓名”和“项目”两个字段都被预先填写 ，由 于这是一个调用信息的界面 ，所以项目中默认填写的是“Call” ，而相关用户的名字也无需填写 ，直接 填写进去了。 在理想的状态下 ，用户会“勤勉”地填写所有字段 ，并且详细地描述每一个细节和相关的信息。然而 实际上 ，人是有惰性的 ，操作者总会详尽办法偷懒。每一个新增加的字段 ，都是用户完成表单的巨 大屏障。为了解决这个问题 ，我们作出了一个妥协方案 ：系统预先填充一些相关的关键内容。当用 户填写的表单涵盖这些预制信息的时候 ，系统会帮用户填写预制的信息 ，这样一来 ，这个有四个字 段的表单中 ，用户需要填写的仅仅只有2个字段 （请继续脑补淘宝下单的时候 ，自动添加收件人信息 的机制 ）。 4 、让表单拥有更好的可访问性 在设计新的Light ning Experience 的时候 ，我们对于它的可访问性设计就有一个基本的构想。由于键 盘输入还是目前我们用户的主要输入方式 （考虑到我们这是一个企业级软件 ），所以一定要对键盘 有良好的兼容和适配 ，必须确保用户仅用键盘就可以执行全部的