畅谈设计新趋势 - 包容性设计

在各国城市化发展迈向新水平的当下，用户群体需求不断多样化。新形势下，设计人员运用包容性设计视角，尊重人的多样性和差异性，强调以人为中心。在设计科技产品时如何进行选择，“设计”如何围绕“以人为本”的根本命题，交出更细腻更发展性的答卷？在这条探索的道路上，拥有高级产品设计师背景的谢天伊嘉宾将和您分享她如何理解“包容性设计”，以及如何将设计理念运用在实际工作中。

本场嘉宾：谢天伊

C3 AI高级产品设计师，Kleiner Perkins设计研究员。曾任职于Google，CVS Health，Nearside。也是于2017年被资生堂美国收购的Giaran,inc的创始成员，设计总负责人。 本科在罗德岛学习平面设计，研究生在纽约大学学习科技与多媒体。

分享内容：

1. 什么是包容性设计？
2. 有哪些相关案例？
3. 如何更好的做包容性设计？

什么是包容性设计？

包容性设计的重要性

第一次接触到包容性设计这个概念时，我的理解非常的浅，认为包容性设计就是给年纪大的人做东西字体要稍微大一点，对色弱色盲的用户要考虑到他们的感受，所以做视频或者做屏幕的时候，字体的对比度要稍微强一些。那个时候确实让我理解到这个世界上不同的用户他们的需求是很不一样的，所以当时对这个话题会有一些兴趣。

毕业之后的两年，一年做了创业，一年去教小朋友，从教书的角度理解到小朋友的知识水平和他们对信息的理解也是非常不一样的。之后读研是在纽约大学的Interactive Telecommunications项目，它是一个结合科技和设计的项目。在读研的过程中，我去到了谷歌包容性设计的组实习，这个组的名字叫 Next Billion Users，主要指代的是“下一个十亿用户”，也就是新网络用户，主要是一些不发达的国家，对科技接触的比较少，开始慢慢使用智能手机、电脑的这些用户。在做这些用户的设计时，我们凭借自己对于科技的理解，所谓的用户直觉，很明确下一步该操作哪里。但这种用户直觉，对用户其实是非常不了解的，所以我们做了很多调研，我们真正旅行到他们所在的地区，去看他们的生活，给他们看我们的产品，观察他们怎么使用。那个时候开始，我开始渐渐的接触到了这个所谓的包容性设计全貌的一小部分，也是从那个时候开始，我对于包容性设计产生了很多兴趣。

在读研期间，我选修了一个叫做 looking forward的课程，主要是教你如何给盲人做设计。这个课程的老师本身也是确实是一位盲人，他的职业就是教一些跟他一样有视觉障碍或者是盲人的用户如何使用电子产品，当时真的就是感觉一下子就开了我的眼界，完全没有想到他们使用产品的整体体验跟我自己（作为视觉用户）的体验是完全不一样的。所以从那个时候开始，我渐渐的接触到更多关于用户的不同从而造成不同体验之类的话题，也渐渐的对这个话题越来越有兴趣。包容性设计这个概念对我很重要，而且对于大家对于这个世界也非常重要。

包容性设计的概念

包容性设计

包容性设计（Inclusive Design）是一个非常宽泛的概念，它其实主要是指**通过多种方法和实践为来自不同背景，拥有不同能力的用户提供平等包容的用户体验。**这其中会包含不同能力障碍、年龄、经济条件、地理位置、语言、知识水平、种族和性别等各种各样的因素。

包容性设计vs.无障碍设计

在讨论包容性设计的概念时，很多人会下意识的把包容性设计跟无障碍设计做混淆，因为无障碍设计在近两年里面被广泛提及到，它是指微改整个网络满足无障碍设计的整体要求。很多公司在发布产品之前，要确保不同能力的用户都能够使用这个产品才能发布，这其实就是无障碍设计（accessibility design），在工作上常被简化为A11Y。无障碍设计其实是包含在包容性设计里面的，而包容性设计除了无障碍设计的概念之外，还有另外一层概念是通用性或国际化设计，即如何使不同背景的人也同样能够使用此产品，所以包容性设计的概念很大。

包容性设计需要深度理解用户的能力和背景，提高不同需求的用户群体对产品的使用归属感。无障碍设计在主观因素上包含身体能力和心智能力两方面的障碍，在客观因素上包含临时状况，比如说一个没有手臂的用户和一个临时手上抱了很多东西的用户，在这个时间点上，两者都是缺少一只手的功能。通用性和国际化的设计，在主观因素方面包含教育背景、科技知识水平、年龄、性别、文化等，客观因素方面包含钱、时间等。做包容性设计的时候，能考虑的越多，产品的包容性可能会越好。

总结包容性设计要考虑到以下几点：

1. 用户能/不能看见的
2. 用户能/不能听见的
3. 用户能/不能交互的
4. 用户能/不能理解的
5. 用户能/不能接受的

案例分析

Case #1 科技水平

知识

做非常前沿的智能产品时，我们都需要考虑用户的科技水平能不能支撑他们很好的理解产品所提供的功能。比如说老年人，他可能会比较倾向于使用比较传统的科技。一些偏远地区的人，比如说在谷歌实习的时候，我们了解很多印度用户，他们的手机屏幕非常小，有些人因为家庭经济条差，还不是很会用手机，因此很多人是需要由比较年轻的小朋友，或者其他的人来教他们如何使用产品的功能，他们对于科技的知识不是很充足，在这种情况下我们可以多考虑一下如何用颜色、字体这种非常具有明显暗示性的东西来给这些用户做设计。

工具

如果手机屏幕非常小，在这个页面上放很多信息，用户看起来整个页面信息都很紧，甚至有一些信息会被切掉，没有办法看见。除此之外，还有网速因素，在中国和美国这边网速都还挺快的，但这个世界上还有很多地区网速非常慢，甚至有些地区如果要下载东西是要花钱的。国内比较多的游戏是需要实时联网，不停的下载新的东西，在这种情况下，对于网很贵地区的用户，他们的体验就会非常差，可能你开开心心玩了半个小时的游戏，下个月就发现你的账单暴涨了50%。

习惯

科技不仅仅是关于你知道了多少，或者你的经济能不能支撑你用很好的设备，其实不同的用户群体，他们的用户习惯也是非常不一样的。我自己平时会玩很多游戏，我身边有非常多的朋友，并不是特别习惯玩游戏的横屏操作，在我给他们推荐一个游戏时，他们会在新手教程中卡住，因为他们之前没有接触过一些非常基础的操作，比如说在电脑上前后左右是WSAD，在手机游戏的操控杆上，这个地方有一些功能键是三角、方块、圈、X，对于一些不常接触到这些操作的用户来讲，他们会很难记住这些按钮的功能，产生这种从习惯上带来的无法适应的感觉。所以说在做这些产品的时候，不仅仅要考虑到我们知道的一些信息，还要考虑到对于用户来讲是不是一个新的需要去理解的知识。

时代

现在产品中很多图标都是极简的，比如说搜索的图标就是一个圈加一个斜杠。在真正接触过不同科技水平的用户之后，我发现对于那些科技水平稍微靠后的地区的人，因为他们没有经历过科技时代的变迁，对他们来讲，他们其实并不是非常理解被简化之后的 icon所代表的含义。就像脸书，因为它是一个社交软件，所以它是两个人甚至更多人，上面有很多对话，这就是非常具体的功能描述。后来在时代中有了自己的一席之地，大家都知道 f代表的是什么，渐渐就演变成这种简化之后的图标，对于跟这个产品一起成长的用户来讲，是非常熟悉的概念，但是如果你把这个东西投入到一个之前完全没有接触过这个概念的用户群体，他可能一时之间没有办法很好的理解。言而总之，为一些科技水平比较落后的用户做设计时，我们要考虑到用户的科技水平，图标的信息越具体，越便于他们去理解。

Case #2 阅读水平

信息的模糊处理能力

关于用户的阅读水平，很多大厂会有非常详细的记录，比如说产品需要确保教育水平达到初二以上的用户能够顺畅使用，也就是一些生僻的文字不能使用等。一个例子是我把微信变成日文和阿拉伯文。对于日文的版本，不会日语的人，第一反应是自动的瞄向有一定认知的文字。这就表明当一个人的阅读水平有限时，他会自动的把自己的视觉理解投射在他能理解的信息上，通过这些信息进行一个模糊性的理解。这时就会有一些危险，比如说如果这个词的前面是一个否定的词，他可能并不认识那个否定的词，这就是影响用户的信息理解，会影响到一些阅读水平不是很行的用户对于这个软件的整体理解。对于阿拉伯文的版本，大部分上面的文字至少我是看不懂，所以整个页面除了英文区域，我的信息就会停留在图标上，通过图标来帮助我认识上面的含义，这就是根据图像和颜色信息来判断接下来要做的事情。

用户的潜意识习惯/理解

如果我是一个老网络用户，非常的懂科技，经常使用各种各样的软件，各种各样的产品，往往会下意识认为这个按钮吸引着我去点它，其他东西我可能看不懂，但我会觉得这个东西可能会帮助我进到下一步，所以我的潜意识会教我如何使用一个软件。

Case #3 能力

如果用户看不见

这就是无障碍设计 Accessibility Design。无障碍设计要考虑到用户有不同的能力，最好不要说有一些人有特殊需求，或者他们不太一样，其实大家都是普普通通的用户，只不过是因为大家本身的能力不同，所以需求也不一样。这就需要我们在做设计的时候，尊重这些不同的需求，而不是把有不同需求的用户特殊化，这也就是无障碍设计里一个非常重要的概念，一定要尊重我们的用户。

手机和电脑上面有语音助手叫VoiceNavigator，它是帮助没有视觉或者视觉比较弱的用户阅读你屏幕上的所有信息，比如当我把那个指令划到邮件上面的时候，他会告诉我说’Mail. One new item. Double tap to open.’还有盲文的键盘，按键上面会有凹凸出来的盲文，这就可以帮助盲人用户很快的理解键盘上的内容，帮助他们进行输入。盲人用户用到的很多产品相关的设计叫 Assistive Technology，可以帮助他们进行阅读等。

如果手指不灵活

Xbox在做游戏的时候，会非常努力的帮助不同能力的用户来顺畅的享受他们的游戏。比如我们平时使用的游戏手柄，因为有一些用户的手指没有那么灵活，或者其他的原因没有办法很好的使用手柄，Xbox 有出一款功能一样的操作系统，用户可以进行前后左右移动，不用使用手指操作。

所有用户受益

字幕

在我们为不同需求做设计的时候，很多时候也会使身边的所有人都受益。比如说字幕，字幕最多的是帮助到有一些听觉障碍的用户了解屏幕上发生了什么，但是对于我们而言，在嘈杂的环境，或者静音，甚至是工作，上课摸鱼的时候，都可以通过字幕了解到屏幕发生了什么。双语字幕，可以帮助有语言方面需求的人进一步理解上面的内容。

如何去做包容性设计

很多包容性设计是非常庞大的团队做出来的产品，我们作为独立的个体，在一个产品中可以是设计师，也可以是工程师，如何更好的做设计呢？引用 Microsoft 提出的Inclusive Design Principle 的几个核心概念：

1. 了解用户不同的需求和挑战，拓展对用户多样化的理解。
2. 为弱势群体解解决问题，从而使所有人受益。

资源：标题浏览

大部分的公司，尤其是科技公司的网站上面，会专门跟大家分享用户不同的需求案例。比如 Microsoft，分享了很多关于 Inclusive Design的故事。还有 Google专门做包容性设计的组 The Next Billion Users，他网站上面也有各种各样的故事，帮助你了解来自世界各地不同的用户，他们都有什么样的挑战，什么样的需求。在我们不断的了解怎么去做包容性设计时，很重要的一点是我们需要将包容性设计尽早的考虑在产品的发展中。如果我们在产品开发的早期考虑到用户的不同需求，产品开发的整个周期就会节省很多时间和资源。

当我在做盲人用户使用的手机语音系统 Voice Navigation时，在iOS上面叫 Voice Over。可以想象盲人用户，他们看不见这个屏幕，看不见字的大小，他们需要处理的信息是所有的文字加在一起。对于这些用户，最好的一个方式是他们有一套操作系统叫Heading Navigation，即通过标题进行检索。在提出这个概念时，我们发现标题检索这个功能和程序员写出的标题，不是自然相关联的，并不是说我们在手机上标注这些标题， Voice Over系统就能帮你把这个标题读成一个标题，而是需要另外的一套 code把它们关联在一起的。

案例：颜色系统

当我们在设计一个产品时，很多时候会做产品的MVP，或者是一个产品的核心功能。在产品设计的早期，很难把包容性设计单独作为一个核心的概念放到产品的开发周期中。产品设计的初期，在做颜色系统的时候，如果我们能够很好的考虑到颜色、色彩和对比度，比如字体色彩和背景色彩搭配，在后期就不需要花大量的精力重新检测这个颜色到能不能用。推荐 WebAIM网站，可以帮助你了解对比度，字体和背景的搭配效果。还有 Google的 Material.io网站上有一个自带的Color Tour。

案例：屏幕 - 明暗，大小

在我们做设计的时候，还要考虑到多种环境和多种产品的关联。现在越来越多的软件会要求必须自带白屏和暗屏两种模式。在做这种类型的设计时，我推荐用可以自动调整颜色的系统，比如说 Figma上面的插件（Themer），它会自动帮你把屏幕的主题转换成相对应的白屏或者暗屏，可以减少很多的工作量。屏幕的大小也是我们需要考虑的内容，比如说手机横屏、竖屏。还有网站设计，当你把一个屏幕拉到最宽，然后一点点变窄，页面需要自适应的调整内容。在这里推荐Figma的响应式插件（Responsive），可以帮助自动生成不同大小的页面，也可以更好的考虑到一些小屏幕用户的体验。

案例：多语言用户

在做包容性设计的时候，要尊重用户的选择。现在国际化的程度越来越高，很多人都是多语言，现在有很多的软件，为了节约编程成本，会把系统语言设计成当前软件使用的语言，会导致有一些软件需要把整个系统语言换一下，才能理解某些功能，也就是会影响到产品整体的包容性。

案例：IOS VoiceOver

包容性设计要更进一步的理解用户感受。如果大家有兴趣体验 VoiceOver，可以在设置页面打开相应的功能感受一下，看看好不好用，去尝试打开各种各样的软件。

Q&A

Q：如果弱势群体的设计需求和主要群体的设计需求之间起冲突的时候，一般会怎么处理，或者会不会有这样的冲突存在？

A：一个比较常见的冲突是公司发展资源的冲突。当我们去做一个设计，发现我们没有足够的资源去支持弱势群体的需求时，会以主要群体为主，作为公司整体的利益出发点来分配资源，这个是我感受比较深的一点。真正弱势群体的需求，很多时候和主要群体有相关性的。比如说有一些用户是低教育背景，也叫Low Literature，低阅读能力的用户，他们的需求是页面简化简化再简化，文字少少少再少，这跟主要群体的需求是会互相推进的。当我们把页面做得很简单的时候，主要群体也会因为阅读需求下降从而受益。所以我个人的经历是很多时候他们是相辅相成的。

Q：在User Testing和Research的时候，对于弱势群体设计或者是Inclusive Design和普通的UX design的操作方面有区别吗？

A：在一个最理想的情况下，产品在做 User Testing和Research的时候，是需要在我们的User Base里面找找一部分能够代表这些弱势群体的用户。比如在做产品设计的时候，我需要找7个用户，可能5个用户是我随便找到的，差不多有两个名额专门留给盲人用户，或者是年纪比较大的用户，让他们作为代表人把他们的 Insight放到Research中，这是最好的一个方式。

Q：已经上线的 NPG游戏开发阶段并没有考虑到包容性设计，最佳的返工方案是什么？

A：针对于产品，第一步是真的做一个Audit，你作为各种各样的用户，通过不同的视角使用这个产品，发现最大的问题在哪。另外在产品早期开发的时候，资源非常有限，一直在跟时间赛跑，所以在这个阶段上，不可能去强制要求所有的产品都能够做到完全包容，完全无障碍，在这种情况下就一定要去设置这个产品，能够做到最好的包容性的MVP。另外是产品的常用页面，一定要进行很好的把控，确保我们在常用页面上的用户体验是比较丝滑的，渐渐的一点点的改进。

Q：在设计给程序提供设计的时候，会有哪些常见的 Accessibility相关的内容？

A：推荐大家去读谷歌出的 Accessibility，会讲到很多东西，比如说颜色是设计师自己把关，不需要提供给程序那边。如果是为视觉需求的用户做，阅读顺序需要调整，按键需要有标签等等。

Q：包容性设计思维如何运用在做活动设计的时候？

A：首先是知道都有哪些包容性相关的需求，然后在了解这个需求的基础上做活动设计，尽量把信息设计的简洁，你看到的任何信息都是字越少越好，用的词越通用越好，颜色不能让对比度太高或太低。

Q：在团队中包容性设计具体如何实施？

A：像谷歌、IBM、Microsoft这些公司，都有自己的 Accessibility Design Team，就是无障碍设计团队，这个团队会去看公司所有的产品，给他们提供相关的帮助。有的时候公司内部也会开一些讲座，或者一些设计分享会，包括每年都会有大的年会去分享相关的工作经验。我遇到一个Accessibility Design工作经验非常丰富的程序员，他会给我们讲很多，这个地方需要你们出一个什么内容等。如果有兴趣的话，你也可以成为那个推进者，通过积累自己的知识，不断的把这种文化带入到团队当中。

拓展阅读：

• Nielsen Norman Group - InclusiveDesign
• Google - Next Billion Users
• Microsoft - Inclusive Design
• University of Cambridge - Inclusive Design Tool Kit
• Inclusive Design Principles
• Access University - Accessibility and Design
• Google Material Design Accessibility
• IBM Accessibility - Equal Access Toolkit
• Web Content Accessibility Guidelines (WCAG) 2.2
• MDN Web Docs-aria label

嘉宾：谢天伊

编辑：煲仔

审核：包包

【我们是谁】 Ladies Who Tech Digital是基于线上分享活动的科技女性交流平台，全部由志愿者无偿在业余时间组织推广，邀请科技领域各行各业的女性，分享她们的专业项目和经验实例，以增进不同行业、不同资历、不同国家之间的交流学习。目前已成功吸引了数千人次的观看和参与，分享内容涉及软件工程、数据科学、产品、设计、创业、能源、制造业、职业发展等。

【欢迎大家关注我们】

B站：https://space.bilibili.com/1506450

微信公众号：LadiesWhoTech Digital

小宇宙播客：LadiesWhoTech

小红书: LadiesWhoTech

加微信群请加群管理：witxianxianzi