阿里巴巴用户体验专家告诉你，如何建立用户体验规范？

 李白 | 阿里巴巴用户体验专家。阿里巴巴信息平台IADC负责人，八年用户体验相关工作经验。

活动：2016年7月10日  BOSS直聘主办 “对话UI&UX设计|深圳UED大会”设计总监的傲慢与偏见PPT来自嘉宾，笔记侠作为合作方，经活动方和演讲者审阅授权发布笔记。

笔记：笔记侠  老周 深度好文：4779字 | 6分钟阅读

导读：用户设计使用规范的内容包括什么？信息平台的用户体验规范又包含什么？你该如何实现自己的一套设计规范呢？用户体验设计规范可能带来的问题又是什么？不同发展阶段的团队应该如何选择使用自己的用户体验规范？阿里巴巴用户体验专家李白，一一为你分享。

全网首发笔记

大家好，我是阿里巴巴信息平台IADC团队的设计师李白，今天跟大家分享的主题是：“用户体验设计规范的价值探索”。

我们团队所做的业务主要集中在阿里巴巴内部服务系统，涵盖HR招聘、财务等，它们的共同点是后台类型的系统。今天和大家分享这套用户体验设计规范背后，我们的思考、方法和经验，希望能够指导大家建立自己的用户体验规范。

用户设计使用规范的内容包括：样式、交互、模板、流程。

信息平台的用户体验规范主要包含：视觉样式、交互规范、设计模板和设计流程。
 
1）样式

我们将所有常见的样式放置到一个设计文件中，设计师通过这个文件，快速搭建自己想要的效果。
 
2）交互

在交互设计规范里面，我们通过清晰的说明，描述了不同的场景下，应该用什么样的组件去完成交互设计的任务，这可以帮助设计师深入了解每一个组建怎么使用，保证设计的统一性。
 
3）模板

设计模板是由基础的组件组成。比如，任何产品的列表页都可以被抽象成设计模板，它会包含一些通用内容，我们把这类页面总结成一个模板之后，它可以在不同的产品里适用。
 

这是一个典型的数据表格，在模板里我们可以看到，它由筛选器、表格等组成，设计师不需要重新设计页面，只需要在模板的基础上进行调整，就可以快速产生符合自己目标的设计。
 
4）流程

最后一部分是设计流程。为什么要强调设计流程呢？在每个公司里面，都有一套自己的设计流程，都有自己的特色，但是在我们的这套设计流程里面，我们强调三件事：

1）需求；

需求阶段，我们鼓励设计师进入到项目团队里面，跟产品经理或者产品设计师深入讨论需求，去调研用户、分析目标、场景是什么，并且将它明确下来，指导整个项目组今后的设计思路。
 
2）评估；

在每个项目的初始阶段，根据项目的难度和复杂程度，我们会通过评估决定增加或减少一些角色的投入。例如，我们可能在某个项目中不需要交互设计和视觉设计的介入，只需要产品设计师完成即可。从这点来看，减少了设计团队在部分项目中的投入，会提升我们整体的工作效率。
 
3）评审。

我们将评审分为内部和外部两块，内部主要是指设计团队内部对自己的设计稿负责，从专业角度保证输出的质量。外部是和需求方进行探讨，保证大家对一些解决方案达成共识。
 
如何实现这套设计规范？
 
为什么我们的规范跟谷歌的规范不太一样？回顾一下我们的设计目标，我们定义了三个点：

1）体验；

因为在我们的产品中，曾经出现了大量体验上的问题，最基本的就是设计的不一致，交互和视觉设计师，他们在设计的时候，质量也是参差不齐。我们需要通过规范改善用户体验，保证设计一致性。
 
2）设计效率；

我们团队总共14个人，对接7～80个项目，如果这些项目并行开展，我们就无法应对。如何解决这个问题？要提升执行效率，利用工具减少一些重复性的工作。

3）扩展性。

扩展性是满足在不同产品、场景、品牌之间切换的复杂性，能够快速支持第三方合作的接入。
    
我们如何实现这件事情？ 

★ 体验：

（1）打造交互和视觉工具集，并持续优化；

在提升产品体验环节，我们首先确定一点，在规范中建立一套工具集，它包含所有的交互和视觉组件。对设计师来说，可以用它迅速搭建自己的设计。同时我们会持续性优化组件库，通过对规范组件的优化，达到对整个信息平台所有产品的优化，这是一个非常快捷的办法。

（2）基于场景和目标用户优化用户体验。

在我们的产品中，大部分是后台系统，我们往往会为了满足功能性需求而对用户体验做出一些妥协。但是，在一些产品中，比如，我们有一款阿里巴巴内部员工差旅报销的应用，很多员工都会用，频率非常高。我们就会成立专门小组，对这款产品的用户体验进行优化。
 

这是招聘平台，招聘平台是用于了解简历的状态和进度。在旧版中，信息分布非常不合理，页面上所有主要的内容非常地分散，视觉焦点不明确。
 

在新版中，我们运用了规范中的典型工作台框架，就在体验层面比之前的产品取得了一定的飞跃。我想告诉大家的是，这种飞跃并不只是在这款产品上，在信息平台80%的产品上都带来了这样的提升，而成本是非常低的，甚至有很多的产品不需要设计师去介入，只需要改一下代码就可以。
 
★ 设计效率：

（1）利用设计工具减少设计节点，提高设计效率；

为什么能够减少节点？是因为我们这套工具最初设计的目的，就是让设计师们的角色变成可替代的，并且依然保证较高的设计质量。这要归功于工具自身的很多功能，比如工具可以自动对齐和保持间距，设计师只需要把这些模块拉出来，就接近于最终的设计稿。

（2）重视设计流程的关键环节，强调设计师在前期就参与；

很多团队经常遇到一个状况，已经在产品开发的时候，突然产品经理说需求改了。我们不知道为什么，但会导致整个团队重复工作。所以在这套设计流程里非常强调，前期一定要让设计师参与到场景的研究、用户的研究中去，确定设计的目标，让所有的成员清晰了解设计的目标到底是什么，避免后期出现往复。
 
★ 扩展性：

（1）设计语言一致、关键元素可配置、多平台兼容性、避免个性化的设计元素，有助于产品的高扩展性和兼容性；



强调兼容性的前提，是要保持设计语言的一致，设计语言的统一性，保持交互行为与视觉感受的一致。我们配合前端产出一套组件库，可以对主要的配色、边框、一些基础的样式随意进行调整。无论你跟任何一个第三方对接的时候，都能很快的融入到它的设计体系里去，不会造成突兀。通过一定的规则，满足部分设计组件的多平台兼容性，降低开发成本。此外，还需要避免个性化的设计元素，以保证在不同场景，不同产品中的兼容性。
 
比如，如果重新规划阿里巴巴钉钉的第三方接入规范，需要花一个月的时间，但通过在这套用户体验规范上的调整，很快就可以达成目标。
 
规范的价值是什么？效率才是最大的价值点！

设计过程里团队也在反思，这套规范最大的价值是什么？我们思考的结果是：效率才是这套规范最大的价值点。大家对后台系统的理解，其实是一些功能性为主、很丑陋、逻辑复杂，难理解的系统。确实，对于功能性的系统来说，我们牺牲了用户体验去满足功能。

当关注到效率这个点，我们发现，最初想解决的问题就是团队的执行效率，而这其中也挖掘出了更大的价值，于是我们制造了这套设计组件库。
 

这套组件库包含SKETCH和AXURE两个版本，设计师只要阅读完这套工具说明之后，可以很快利用它去搭建一套设计，同时我们配合前端输出了前端组件库，在让前端开发更快捷的同时，也让后端和其他的开发人员利用这套工具很快地搭建页面，所以我们需要跟前端同学配合，打造完整的工具集，从整体的流程环节上提升效率。

我们来看一下，如何利用这套工具影响设计流程。这是之前的设计流程，第一步是做需求的调研分析，一般是由产品完成，之后是交互行为设计、视觉风格设计、前端开发，但往往有很多往复。而在一个新的流程中，在需求调研阶段，交互设计师和产品设计师都可以进行这项工作，而在视觉和交互行为的设计阶段。
 
我们的产品、视觉、交互可以相互替代，都可以完成这部分的工作。最后在前端开发阶段，由于运用了组件模块化工具，后端也可以做这部分的工作。这样，我们减少了设计的节点，也许在某一个节点上，不能减少设计师的时间投入。但是，当减少了一个节点的时候，它一定降低了沟通成本，所以我们整体的效率一定会得到提高。
 
一个实际案例：

这是我们一个行政访客的项目，初期我们就和项目组讨论。我们如果按照一般流程需要6天，但利用新的流程，我们在原型阶段两天时间，产品设计师输出的稿件质量已经很高了，交互的阶段还是4天，但同时已经完成了视觉设计。最后到了前端部分，节省了两天的开发时间，因为引用的是组件库，很快就可以搭建出来。事实上在最后的工作中，前端用的时间比四天还要少。

演讲现场

我们要节省出来这些时间去做什么？让设计师创造更大的价值。我们很多设计师

做的都是价值感很低、存在感很低的工作，我们要用工具把这块效率加快，同时让设计师去做设计方法、设计思维上的沉淀，整体提升设计团队的能力。

 
★ 用户体验设计规范可能带来的问题：

是不是这套规范就如此完美？它是不是没有任何问题？肯定不是，我们来看一下弊端有哪些。
 
1、规范限制交互及视觉设计层面的创新；

设计师每天都喜欢做新鲜的设计，但是规范要求他们在这个框架内设计。换一种思路来讲，其实所有的创新可以基于规范去创新，规范不是一成不变的，可以在任何细节上继续深入去做优化，从而带来规范不断地优化，得到改进，它可以效率更高，设计体验更好。同时这套规范的价值还在于节省设计师的时间，让设计师有更多时间和空间做更多有趣的事情和项目。

2、模糊了团队的个人能力界限；

在座的肯定有视觉设计师、交互、产品的同学，大家都非常喜欢自己的领域，觉得自己的领域有很深的学问可以去研究，可以继续积累自己的经验。但是当运用这套工具的时候，我们需要交互设计师去做视觉，需要视觉设计师去理解交互等等，这对每个设计师来说都是挑战。但换种角度去看，这种方式和思路提升了每个个体的综合能力，弥补了设计师个人能力上的缺失。
 
3、要求产品团队拥有设计能力；

在这套设计流程里，需要产品去做视觉，做交互，做用户体验，这就为设计团队提出新的要求。我们需要把我们节省出来的时间，用于去影响团队，影响项目组，影响整个公司。你要去宣传设计的方法、理念，什么样的设计是好的，从而让产品团队和设计团队保持一致的设计目标。

4、规范系统的升级成本极高。

试想一下，让苹果重新做自己的设计规范，它可能需要一年两年时间才能达到完善，所以这套规范不适用于所有的人和团队。如果你的产品进入成熟期，而且短时间内不会对我们的设计进行大调整，我们完全可以沉淀一套设计系统。但如果我们还处于变动时期，我们面对这套系统只会增加设计师的压力，因为你可能每个月都会进行一次调整。
 
★ 不同发展阶段的团队适用不同的用户体验规范：

这不是适合所有团队的解决方案，但是我会根据个人的经验给大家一些建议，如何建立你的用户体验规范。
 
初创的设计团队，其实设计师非常少，可能只有三个人甚至一个人，我建议不要花太多的精力在设计规范上，因为业务的变化太快，过一个月，可能你的产品又要重新做了，如果你花心思去做规范可能完全没有价值，最后可能只是满足设计师自我表现欲。

我鼓励的行为是，利用网上开源的组建库和设计工具，去加速你的设计。当然我不是建议设计师抄袭别人的设计，我们只是利用设计工具提升速度，更快的产出高质量的设计。
 
对于小型团队来说，可能5到10个人，这种团队相对稳定一些，我建议做一些基础的视觉样式库，可以保证团队设计一致性，交互设计师，可以做一些通用型的组件，提升设计效率。不建议做很完整复杂的系统，同时还有一个很重要的点，就是设计团队要在自己的公司或团队建立最基本的设计流程，在设计流程中最需要强调的就是评审机制。我们要鼓励团队利用评审来确保设计质量输出是高水平的，而不是依靠某个人去决定。
 
对于中型团队来说，因为有足够的人力精力，包括也要面对业务上的压力，可能需要处理很多的设计工作，这时候也会出现很多重复性的设计工作，我的建议就是你要利用这套用户体验规范去加速你的设计。在加速设计之后，你的设计团队才有机会去做更多新鲜的东西，去做产品创新，去给公司带来更大的商业价值，而不是做最低价值的重复性设计工作。
 
对于大型设计团队，我的建议是要有一个用户体验设计的体系。就像谷歌，要通过和品牌团队的深入合作，将品牌与自己的设计语言结合，利用设计语言形成品牌，产品与用户之间的连接，带来用户对产品之间的情感依赖，这能让设计团队创造更大的价值。
 

谢谢大家！

「直聘学院」是Boss直聘旗下系列高质量活动，联合明星公司&合作伙伴共同发起，为产品/技术/设计/运营等领域3年以上从业者举办的线下专场沙龙，旨在通过纯业内干货分享和牛人圈子交流，共同推动行业进步。

［招贤纳士］

新媒体合伙人、总编辑、编辑、主笔

产品经理、新媒体运营、技术运营、电商运营、活动运营

商务BD、平面设计、漫画师、文案策划

简历请发至[e-mail]

后台回复大咖名字，查看精彩笔记

李善友丨傅盛｜余晨丨龚焱丨徐新丨 阎焱丨俞敏洪丨李丰｜蔡文胜丨段永朝丨罗振宇｜罗胖｜吴伯凡｜宗毅｜吴声｜伊光旭丨李欣频｜王东岳...

合作伙伴：混沌研习社｜创业邦｜领英中国｜36氪｜腾讯｜京东｜正和岛｜中欧｜微链...