插图 引用 同一行两个插图_插图的目的

插图 引用 同一行两个插图

If you’re a designer in tech you’ve likely come across them. Any search for UI or product design on Dribbble will yield at least a few. Amid the sea of pastel blues and pinks, accented neon purples and gamboge yellows, these faceless, nebulous bodies have become the lorem ipsum of graphic embellishment in todays product landscape.

如果您是技术设计师，那么您可能会遇到他们。 在Dribbble上对UI或产品设计的任何搜索都会产生至少一些结果。 在一片柔和的蓝色和粉红色，海重音的霓虹灯紫色和黄色藤黄，这些面目模糊，模糊的机构已经成为Lorem存有图形点缀在今天的产品格局。

Humaaans is a library of vector based, free-to-use illustrations launched in late 2018 by Pablo Stanley, Design Lead at InVision. Upon its arrival, this mix-and-match collection exploded in popularity, inspiring waves of similarly floaty, ambiguous humanoids that remain on-trend to this day.

Humaaans是一个基于向量的免费插图库，由InVision设计负责人Pablo Stanley于2018年底启动。 抵达市场后，这个混搭收藏系列大受欢迎，激发了至今仍在流行的类似漂浮，模棱两可的类人生物浪潮。

Humaaans and its influence can be found across the digital design community.

Humaaans及其影响力可以在整个数字设计社区中找到。

For many upstart product designers, illustration libraries are a practical resource to easily extend the communication around a product. As with all free asset collections, they can expedite the design process while elevating the status of the original creator.

对于许多新贵产品设计师而言，插图库是一种实用资源，可轻松扩展产品周围的交流。 与所有免费资产收藏一样，它们可以加快设计过程，同时提高原始创作者的地位。

However, for companies trying to establish a brand, these libraries can act as pitfalls against finding a unique voice within the market.

但是，对于试图建立品牌的公司而言，这些库可能会成为在市场中找不到独特声音的陷阱。

Even big players have used Humaaans. Hinge used the library as a base for their illustrations.

甚至大公司也都在使用Humaaans。 Hinge使用该库作为插图的基础。

插图的目的 (The Purpose of Illustrations)

Their role in product.

他们在产品中的作用。

Illustrations used in product need to live within the context of a brand. This means that effective graphics are supplemental to the overall messaging, serving only to elevate what is already being communicated through an established design system. If a team finds benefit in curating illustrations, time, attention, and budget is needed in order to make sure the deliverables add value to the product experience.

产品中使用的插图必须与品牌相关。 这意味着有效的图形是对整体消息传递的补充，仅用于提升已经通过已建立的设计系统传递的内容。 如果团队在策划插图中发现好处，则需要时间，精力和预算，以确保可交付成果为产品体验增加价值。

Several digital product companies already utilize custom illustrations to elevate their brand experience. Examples include:

一些数字产品公司已经利用定制插图来提升他们的品牌体验。 示例包括：

Duolingo uses its famous owl and school-like graphics to communicate their friendly, game-based approach to language learning. Most graphics in the app serve as visual aids within lessons.

Duolingo使用其著名的猫头鹰和类似学校的图形来交流他们友好的，基于游戏的语言学习方法。 应用程序中的大多数图形在课程中都可以作为视觉辅助。

CoStar incorporates abstract symbols and objects to add a little mysticism to an otherwise pulled-back, monochromatic astrology brand.

CoStar结合了抽象符号和对象，为原本退缩的单色占星术品牌增添了一点神秘感。

Byte uses colourful 3D renderings to communicate the diversity of content found within the app, suggesting an energetic and ever-changing experience.

Byte使用丰富多彩的3D渲染来传达应用程序中发现的内容的多样性，暗示着充满活力且不断变化的体验。

From left to right: Duolingo, CoStar, and Byte.

从左到右：Duolingo，CoStar和Byte。

Despite their differences, the common thread between these apps is how they use graphics as a tool to push communication. Everything is presented with a purpose in mind, elevating the brands overall messaging.

尽管它们之间存在差异，但这些应用之间的共同点在于它们如何使用图形作为推动交流的工具。 呈现每件事都是出于目的，从而提升了品牌的整体传达力。

All too often, designers plonk in graphics because someone decided “we need something here”. This is when libraries like Humaaans come into play. Without consideration into the communication intent behind their illustrations, designers reach for the most immediate aesthetic option on hand. This graphics-for-the-sake-of-it approach dilutes the core messaging of a product through visual ambiguity.

设计师经常在图形中作图，因为有人决定“我们在这里需要一些东西” 。 这就是类似Humaaans的图书馆开始发挥作用的时候。 在不考虑插图背后的交流意图的情况下，设计师可以立即获得最直接的美学选择。 这种“以图取胜”的方法通过视觉模糊性稀释了产品的核心信息。

To avoid this, designers looking to add a little art should ask themselves:

为避免这种情况，希望添加一些艺术作品的设计师应自问：

• What would graphics serve to effectively communicate within the product?

  图形将在产品内部有效通信的作用是什么？

• How would their presentation elevate the voice of our brand?

  他们的演讲将如何提升我们品牌的声音？

雇用插画家 (Hiring an Illustrator)

Bring in the pros.

引进专业人士。

While some teams may identify a need for graphics, they might not have the internal ability to execute ideas effectively. If this happens, teams should hire a professional as the first step in what will be a new design process. Dribbble and Behance are already host to hundreds of unique illustrators able to guide clients towards desired outcomes. Finding someone whose graphic style aligns with a products messaging is worth the upfront cost in order to elevate its communication.

尽管有些团队可能确定需要图形，但他们可能没有有效执行想法的内部能力。 如果发生这种情况，团队应该聘请专业人员作为新设计流程的第一步。 Dribbble和Behance已经接待了数百名独特的插图画家，他们能够指导客户取得理想的结果。 寻找一个图形风格与产品信息相吻合的人是值得的，以提高其沟通水平。

There’s a rich diversity found in custom illustrations.

自定义插图中有丰富的多样性。

如果成本是一个问题 (If Cost is an Issue)

Dealing with budgetary restraints.

处理预算限制。

Not every design team has the resources or flexibility to hire an illustrator. Thankfully, there are still a number of ways to incorporate graphics meaningfully when tight on budget:

并非每个设计团队都有资源或灵活性来聘请插图画家。 值得庆幸的是，在预算紧张的情况下，仍有多种方法可以有意义地合并图形：

Use lesser-known libraries — With illustration libraries becoming more common, there’s growing opportunity to find and utilize graphics that play better with your product. With an uncommon library, there’s a smaller chance seeing it used in other designs.

使用鲜为人知的库 -随着插图库变得越来越普遍，发现和利用与您的产品更好地配合使用的图形的机会越来越多。 对于一个不常见的库，看到它用于其他设计的机会较小。

• Open Peeps — Also created by Pablo Stanley, this library isn't used as heavily as Humaaans, and is more sketch-like in quality.

  开放窥视 ( Open Peeps) —由Pablo Stanley创建，该库的使用率不像Humaaans ，而且质量更像草图。

• craftwork.design — While this company embraces the floaty-boy aesthetic with open arms, they still offer a few unique libraries including Afterclap, 3DDD, and Thursday.

  craftwork.design -尽管这家公司拥抱轻飘男孩审美张开双臂，但仍然提供了包括一些独特的库Afterclap ， 3DDD 和 周四 。

Customize — Pictured earlier, Hinge is actually a good example of how libraries like Humaaans can be used as a base for custom illustrations. This is especially true for apps focused on connecting people.

自定义 -如上图所示，铰链实际上是一个很好的示例，说明如何将Humaaans之类的库用作自定义插图的基础。 对于专注于联系人们的应用程序尤其如此。

Go without —Fonts and colours alone can go a long way in establishing an apps central theme or idea. Companies like Nowness, Medium, and Soundcloud all have a unique look and feel that lets uploaded content shine within their frameworks.

去无 -fonts和颜色单独可以去长的路在建立应用中心主题或想法。 诸如Nowness，Medium和Soundcloud之类的公司都具有独特的外观，可让上传的内容在其框架内发光。

From left to right: Nowness, Medium, and SoundCloud.

从左到右：Nowness，Medium和SoundCloud。

最后的想法 (Final Thoughts)

A drawn out process.

制定的过程。

Everyone wants their product to stand out in what is an ever growing, already crowded market. In order to be noticed, design teams need to look to their core communication as direction when building out unique experiences.

每个人都希望他们的产品在不断增长的，已经拥挤的市场中脱颖而出。 为了引起注意，设计团队需要在建立独特体验时以核心沟通为指导。

As illustration libraries are available to everyone, they are inherently not unique, serving only to water down a products brand voice. A cut-corners approach to graphic development is a short term solution with diminishing returns.

由于插图库可供所有人使用，因此它们本质上并不是唯一的，仅用于淡化产品品牌的声音。 图形开发的切角方法是一种短期解决方案，其收益递减。

So if your budget allows, hire an illustrator. Your product deserves a chance to find its voice.

因此，如果您的预算允许，请聘请插图画家。 您的产品值得找到声音的机会。

NotesI’m a Vancouver based digital designer and creative director. For 6 years I’ve helped companies establish themselves online through design informed by strategy. I’m currently looking for opportunities on product teams. If you’re looking to grow your team, connect with me on LinkedIn.

注 ：我是总部设在温哥华的数字设计师和创意总监。 六年来，我一直在帮助企业通过战略指导的设计在网上建立自己的位置。 我目前正在寻找产品团队的机会。 如果您想扩大团队规模，请通过LinkedIn与我联系。

翻译自: https://medium.com/ux-quips/a-case-against-humaaans-why-illustration-libraries-are-hurting-your-products-brand-voice-10a43518935

插图 引用 同一行两个插图