Airbnb | 创建更具包容性的视觉识别插图指南

0 评论 7579 浏览 15 收藏 15 分钟

Airbnb 的设计语言系统(DLS)为我们的用户体验设计(从字体、颜色到插画和动效设计)提供了一个易懂的、包容的通用做法。

文字语言可以为公司定下基调,但图像可以使其更加具象。插画还没有在科技界中找到它的位置,因为它常常被抛之脑后。无论是用来提炼复杂的信息,还是添加一点奇思妙想,插画都是构成公司视觉品牌标识的一部分。

作为在硅谷工作了近十年的插画师,我看到插画开始受到科技行业的兴趣。各公司开始认识到它的价值——图像传达信息的同时也使得他们的用户感到愉悦。尽管插画越来越受欢迎,但它并没有被普遍认为是一门独立学科。公司会去寻找喜欢绘画的设计师,会涂鸦的工程师,或者会基本设计自由职业者。插画并没有得到和其他工种同等的时间和资源。

我的职业目标之一是提高插图在行业的价值地位。Airbnb 的设计品牌融合了多种学科——体验设计与动效设计、摄影、写作、数据可视化和插画。当我在2017年10月加入Airbnb团队时,有机会重新设计 Airbnb 插图风格,这是核心品牌系统中的一个重要组成部分。接下来我介绍是如何展开工作的。

Airbnb | 创建更具包容性的视觉识别插图指南

笨拙的少年时期

我的第一步:调研。我收集了 Airbnb 过去的所有插图,和那些目睹或者参与其发展的人交谈。我了解到有些单独的插画是为一次性演示而设计的,然后同事就沿用下来了。其他的是设计师通过他们的个人风格与品牌调性相合相结合的方式,并将工作交给产品设计团队和自由插画师了。

Airbnb 插图的三个阶段

Airbnb 插图的三个阶段

在我的研究中,有一点是非常清晰明确的是:从来没有人后退一步思考,插画在 Airbnb 社区的主要的表达。是时候把 Airbnb 的插画风格从尴尬的少年时期拉出来了。

每一个面孔和种族

我研究阶段中从同事那里收集到的最有洞察力的意见。许多批评都是要求少一些泡沫美学,但我从那些黑人、亚洲人、拉丁裔和中东同事那里得到一个关键的见解让我感到非常震惊:“这些插图形象不能代表我。”他们的想法让我陷入沉思,我作为一个亚裔美国女性的经历,我成长的世界里是体现不出自己样子的。

沉浸在历史遗留下来的的科技插图风格中——用蓝色或灰色勾勒的卡通人物。缺乏代表性并且不能诠释 Airbnb 对包容性的承诺。

“当一个人物形象的轮廓结合空白色块再加上有颜色的头发和衣服的时候,很容易就会认为他们是白种人。”

Airbnb | 创建更具包容性的视觉识别插图指南

房主和住客的不同表现-早期(左)和后期(右)

Airbnb 的房主、住客和员工覆盖了世界的各个角落——从成都的祖母、旧金山的企业家,到伊斯坦布尔的空巢老人以及内罗毕的婚礼策划人。显然,我的同事和我们所服务的社区有机会为他们做正确的事情。

代表性是复杂的

我们的插图遵循四个原则 —— 接地气的、可伸缩的、轻量级的和多样化的。

我们把插图中的泡沫般的、童趣的风格剥离出来,使其更加接地气。就和我们的设计语言系统的其他部分一样,它们的风格十分简约的、轻量级的。有意的留白是可以带来很好的平衡,插图就不会脱离它们所处的环境。同样重要的是,它们在不同大小的地方、平台和设备上进行扩展。

接地气、轻量级和可伸缩是比较简单的,但是多样性和代表性就复杂得多了。以下是我为全球社群设计的各种多样性的插图:

1. 包容差异性:准确表达不同的种族、年龄、能力和体型;

2. 保持真实性:表现不全是白人的角色,参考每个人的照片绘制;

3. 表达每个人:考虑所有类型的多样性,包括占世界人口15%的残疾人群体。

Airbnb | 创建更具包容性的视觉识别插图指南

一位房主为住客准备好房间

Airbnb | 创建更具包容性的视觉识别插图指南

一位房主在看他的日历

包容差异性

以西方为中心,勾勒卡通人物需要改变的地方。年龄、种族、残疾、宗教、取向和性别的多样性是我们的基础。我们需要表现出归属所有地方的人,角色设定就可以创造出更多样性。

Airbnb | 创建更具包容性的视觉识别插图指南

Airbnb | 创建更具包容性的视觉识别插图指南

早期探索插图

Airbnb | 创建更具包容性的视觉识别插图指南

Airbnb 新风格的第一幅插图:房东把钥匙递给住客

在我的职业生涯中,我听到过许多关于“身体政治”的激烈辩论——正确的肤色、最佳的体型和最合适的性别。这给了我一种很不安全,并把恐惧成为我关注的焦点。我也经历过用不同的灰色来画每个人来避免种族问题。我害怕偏离主流人群审美标准。当我审视科技领域插图的情况和历史时,我发现这场争辩依然很盛行。

“尽管多样性最终成为了一个首要问题,在不冒犯任何人的情况下定义人类仍然让很多人感到有压力。”

很多通过顺从的方式来解决这个问题,通过彩虹色的人物图形隐喻多样性。人们的体型和年龄通常相同,但被画成红色、蓝色、黄色、橙色、紫色和绿色。简单地说,他们不是真实的。然而一开始在世界范围内这样的表现方式可能是好的(实际上我在最初的 Airbnb 插图的草稿中就尝试过这种方法),但我知道这并不适合我们。我们可以比这样做得更好。

Airbnb | 创建更具包容性的视觉识别插图指南

早期探索插图

Airbnb | 创建更具包容性的视觉识别插图指南

房主和住客交流

我们的使命是将不同文化和不同大陆的人们联系起来,所以我们的插图必须表达出我们的社群是正在聚集在一起的。我们不能根据被认为是“商业可接受”的东西来概括或指导。相反,我们需要非常真实。人就是人,因此我们不会试图围绕我们都是不一样,这一简单事实来设计。

保持真实性

Airbnb | 创建更具包容性的视觉识别插图指南

参考真实照片的样本

我们要以尊重和关怀来展现我们全球 Airbnb 社群。通过参考我们的房主和房客、过往的人物、朋友、家人和同事的真实照片,我们能够以我们在世界上看到的多样性来代表我们的人物。

Airbnb | 创建更具包容性的视觉识别插图指南

Airbnb | 创建更具包容性的视觉识别插图指南

多种多样的面部细节图的草稿

用真实的照片来激发灵感可以达到两件事:

当我们描绘多样性的时候,它可以确保真实性,因为它不会给艺术家留下概括或刻板印象的空间,并且阻止艺术家画出他们自己的不同版本。

插画师开始倾向于画他们经常看到的那些。我知道我的脸是我一生中见过最多的,我会感到震惊我们产品中的每个角色都是我的某一个版本。

Airbnb | 创建更具包容性的视觉识别插图指南

Airbnb的社区的注册协议

Airbnb | 创建更具包容性的视觉识别插图指南

一家人(插图)

反映每个人

对我们的风格至关重要的是将残疾群体纳入其中,他们的身份与性别、种族、国籍、取向和年龄交织在一起的。迈克尔·奥斯汀(Michael Austin Sui )是一位专注于无障碍设计的包容性设计主管,他是我在这方面最亲密的合作伙伴。通过与 Airbnb 的残疾社群小组合作,我们可以讨论正在进行的工作,并获得关于他们生活经历的直接反馈。

“通过与残疾人社群的对话,我们正在学习如何以尊重他们观点的方式创作插图。”

Airbnb | 创建更具包容性的视觉识别插图指南

在日本,房主欢迎远道而来的客人

在创建我们的插图库时,我个人学到了很多东西。例如,在聋人和重听人群体中,关于人工耳蜗的争论一直在进行。有些人在插图中使用它们,而另一些人更喜欢用手语来描述。我们想在我们的产品中同时包含这两者。

Airbnb | 创建更具包容性的视觉识别插图指南

一位房主通过 Airbnb 应用与她的客人交流

对视觉障碍的描述是相对直接的,比如假肢。但是无形的残疾并不那么简单。我正在向 Airbnb 的一名员工学习,他认为自己患有自闭症,我们应该如何结合视觉线索,比如特定的手臂手势或声音消除设备,所以插图反映了更多的神经多样性。

Airbnb | 创建更具包容性的视觉识别插图指南

Airbnb 的房主们通过它来表达他们对旅游的热爱

我对各种各样的残疾相关知识了解有限,这对我来说无疑是一个学习的过程。随着我们继续与社群本身建立联系,我们将扩大我们的知识和技能,这样我们就可以通过更包容的态度来做好工作。

“普通”才是多样性的

随着我们新的插图风格重塑 Airbnb 的形象表达,我们希望打破现状。我们不想延续我们许多人从小至今的经历,只认为只有白人才是有价值的。通过打破固定的人类身份,我们自然需要我们的团队表达我们的外部形象。我们的目标是扩大我们的世界观,提升我们的真实性,并继续与我们的全球社群建立信任,我们可以通过建立一个展示Airbnb 的使命感的插画团队来实现这一点。

Airbnb | 创建更具包容性的视觉识别插图指南

一位房主通过 Airbnb 的“开放之家”计划与她的客人建立联系

“普通”才是多样性的。我的目标是推动科技行业的发展,但这不是我或 Airbnb 能够独自承担的责任。科技行业必须考虑由谁组成他们公司的人,以及如何将这些组成呈现给世界。是时候坦诚人类之间的差异性。

 

原文作者:Jennifer HomAirbnb 资深设计经理

原文地址:https://airbnb.design/your-face-here

编译者:呵呵,三分设特邀翻译教官

编辑整理:三分设译文小组 (公号ID:sanfen-design)

本文由 @三分设 翻译发布于人人都是产品经理。未经许可,禁止转载

题图来自Unsplash,基于CC0协议

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 目前还没评论,等你发挥!