日志
设计视觉系统化，拒绝野路子
2018-04-20 15:52
Facebook是一个连接全球数十亿人的社交工具。 面对这一视觉系统，设计师遇到了前所未有的挑战 虽然每个工具都能很好地履行其预期的功能，但它们并没有提供令人满意的整体经验。设计的UI模式，使用颜色和图像每个产品都是不同的。整体看起来不仅过时，而且与Facebook的这些专业人士在个人生活中使用也脱离联系。 我们希望制作出一致，令人满意的用户体验，值得我们的商业产品为公司和人们喜欢。我们还希望通过改进他们所依赖的工具来展示我们对这些业务的承诺。 我知道这个项目将是一个团队的努力，但我是被吓倒的。到目前为止，我为“模拟人生”设计了UI，并为SFMOMA创建了一个广泛的风格指南，但这些项目只有一个观众和一个产品。创建一个连贯的视觉系统，跨越不同客户群体的多个广告工具，包括数百万小企业，大品牌和代理机构以及我们的营销网站，是一个完全不同的挑战规模，比任何都更加复杂，曾经做过 每个产品不仅具有不同的外观和感觉，而且这些产品中有150位设计师; 该系统必须为所有这些工作。 我不知道系统会是什么样子，但我知道这不是太规范。它必须是可扩展的和灵活的，随着我们的成长而发展的能力。在潜入视觉效果之前，我需要了解我们希望人们如何体验我们的产品。我开始与我们的设计领导团队合作来定义我们的属性。如何想要体验感受？我们想出了一个范围不同的情况下，像描述的人，专业，值得信赖，和友好的。 接下来，我对所有Facebook的商业产品以及我们的消费者插图和颜色进行了审核。我展示了我们不同的团队，整体体验如何脱节。然后，我为不同的团队提供了研讨会，使用点投票和贴纸写作来快速识别我们认为成功的设计。 一旦我们达成了一个基本方向的协议 - 我们称之为“抽象几何风格” - 我们经历了许多轮次的改进。我们现在有一个明确的方向，但是我们仍然需要一种共同的方式来了解如何将其应用于系统将重塑的所有不同的产品。 把它们捆绑在一起 我回头看整个系统。当我重新审视了我们为了定义品牌属性而进行的练习时，我发现他们可以应用我们旨在汇集的不同体验。这只是一个根据观众和产品在频谱上调整每个属性的强度的问题。 例如，我们希望Power Editor是一种主要由广告代理商的专业人士使用的广告界面，可以感受到更为先进的功能。另一方面，使用Pages的人大多是中小企业，所以产品应该更简单，更平易近人。 颜色也一样。一个用户可能需要它是值得信赖和平静的，而另一个用户需要它来感觉友好。我研究了色彩系统，并尝试将其映射到我们为Facebook业务开发的维度。通过在项目影响的所有经验中应用这样的维度，我开始看到我们如何以一致和系统的方式解决所有的用户。 这并不意味着很容易。开发可以在所有消费者和商业产品上工作的调色板 - 将它们放在一起而不消除有意义的差异 - 是我们面临的最大挑战之一。满足它需要多个团队之间的大量协作。 我们使用音调来加强Facebook品牌，并在消费者和商业插图中创造更多的一致性。在总体方案中，我们为不同的商业产品使用不同的配色方案，以创造出表面之间的明显区别，帮助人们保持领导。 颜色只是我们努力制作商业工具的一部分，这些商业工具带来不同的经验，同时保持适当的区别。如果我们的商业工具 - 即使是最先进的 - 都感觉到非人性化，他们不会像Facebook的一部分。 我们需要我们的新视觉系统，简单而通用，足以使感情上与世界各地使用我们的工具的人的广泛联系。我在我们的视觉系统中编写了代表人物的指南，包括许多不同的肤色和发型，以表示多样性。 人物也不得不反映各种各样的工作场所（例如代理与餐馆）。消费者的数字应该像日常人一样，从不僵硬或机器人。在所有产品中，人们应该习惯于讲故事或传达一个信息 - 从不随机放置在作品中。每个例子需要清楚地说明它们与我们的产品有关。 我学到的五件事 从项目开始就越远，其最大的教训就越明显。其中一些具体针对Facebook的独特规模，但我希望其他人对任何人构建视觉系统的各种经验 - 或领先的综合设计项目是有用的。
阅读全文 |
下一篇： 设计是什么？为什么需要设计
上一篇： 高质量的UI设计学习路线