干货|如何建立一个强大的品牌插画系统?

我是创始人李岩:很抱歉!给自己产品做个广告,点击进来看看。  

在这篇文章中,Yihui Liu 概述了她如何建立一个强大的品牌插画系统过程。她在中国和欧洲的10多年研究和专业经验使她的方法得到完善,并从她作为Spacebase首席设计师的工作中提取了一些例子。

干货|如何建立一个强大的品牌插画系统?

品牌插图是一个建立公司视觉品牌一种有效的方式。

在大量的在线内容中,公司依靠其品牌形象生存或死亡。一个品牌形象必须表达公司的信息并与用户建立联系,用户应该能够通过不同的媒体去识别它。

品牌形象通常是由不同的视觉元素构成的,比如logo、调色板、特定的字体。除了这些,插图是另一种强大的视觉传达手段,对于在UI的界面上也越来越需要了。

为什么?

因为插图可以将叙事元素引入视觉内容中,并从微妙的情绪或更复杂的情况中表达。包括人的形象使思想变得活跃和更容易理解,通常以一种轻松或异想天开的方式。插图脱离了现实主义,让你构建品牌所看到的世界。

那么,你应该如何着手设计一个有效的品牌插图系统呢?

带你看看我的设计过程,并以最近我们在Spacebase进行的设计为例。

研究品牌

首先,要知道你要设计的品牌。

这可能听起来很简单,但是不要低估你所涉及的工作。即使你认为自己已经掌握了工作知识,也值得花时间更新或加深对你对品牌的理解。

深入了解公司及其产品或服务背后的文化,他们的主要信息是什么,他们现有的视觉标识采取什么形式,公司想要朝什么方向发展?一开始你就彻底地去研究这些,避免你以后遇到更多的麻烦。

组织灵感

一个情绪板对于掌握你接收到的信息和组织你的想法是很重要的,收集竞争对手或公司在该领域与你的预期目标类似的图像,然后汇编成一个资源。这是一个对于自己激发灵感的方法,也可以作为你想要实现的整体基调的指南。

干货|如何建立一个强大的品牌插画系统?

对于Spacebase设计,我特别受到Airbnb、IBM和Shopify插图的启发。简单的人物和空间设计让我印象深刻,让我更加感兴趣的是它们柔和的调色板如何使插图集中,又不会淹没图案元素,它们给人一种平静、温暖和包容的感觉。

设计概念设计

经过研究和情绪板之后,我开始在PS上进行草图绘制。有时我使用Wacom手绘板,但主要是我使用钢笔工具来控制鼠标。我使用形状创建一个基本结构,并使用钢笔工具添加细节和加强基本轮廓。

干货|如何建立一个强大的品牌插画系统?

记住,你设计的图像应该结合在一起形成一个统一的系统,而不是形成独立的场景。因此,即使这是第一次迭代,也要使插图具有独特的风格,将来可以在不同的场景设计中使用它们。

借助Spacebase插图,我们将重点放在人的性格和配色方案上,使图像与其他视觉品牌元素保持一致。

干货|如何建立一个强大的品牌插画系统?

我开始画人物的基本轮廓,来感受他们所代表的情感。我想要流畅的线条,给他们动态的轮廓和动作的建议。我还想避免任何看起来过于沉重的内容,轻量级和友好是关键字。多样化对我来说也很重要,因为Spacebase是一家国际公司,我一直希望插图的观看者能看到自己。

除了人物之外,我还希望对象和环境具有一种独特的风格(抽象),未来主义和前卫设计。我们想要展示明亮和美丽的内部空间,让用户参与到空间动态中,并且使用一些物体建一个理想化的专业工作环境。同时,这些也不是为了分散注意力。Spacebase致力于激发会议室的灵感,品牌更多的是关于使用这些空间的人。这需要多次的迭代才能得到正确的结果。

干货|如何建立一个强大的品牌插画系统?

草图经过细化之后,我想到很多种配色方案。色彩非常有力,可以引起即时反应,所以对我来说,重要的是不要压倒插图。我想要细微的阴影来增强和补充场景。色彩方案也要体现品牌的个性,与其他视觉元素相匹配。对

于Spacebase配色方案,重要的是要打破单色并远离通常与会议室相关的色调颜色。他们的主要品牌色是橙色,所以我用更柔和的色调来平衡,比如紫色、天蓝色、灰色和芥末黄。

收集反馈

在第一次迭代之后,尽可能收集所有的反馈。显然,你需要与主要涉众沟通,谈谈他们对设计的看法。但如果你有用户或同事的意见,也要试着征求他们的意见,尤其是那些不在设计领域工作的人。

他们的回答可以引导你下一步应该采取什么样的步骤来改善插图。为真实的目标用户设计,而不是想象的需求。

总地来说,我更喜欢听到人们的意见。夸奖虽然是挺好的,但用处不是很大。

我们了解用户的痛点,告诉他应该把注意力集中在哪里。即使他们不同意你的想法,涉众和他们的用户也必须喜欢这个设计。好的设计取决于用户的眼光。

我在Spacebase中最纠结的一个插图是取消邮件的横幅。当用户取消预订或当Spacebase取消预订时,他们就会收到这些信息。没有人喜欢看到不好的东西,所以我希望设计能够给用户传递一些理解。不过早期的版本太复杂了。

干货|如何建立一个强大的品牌插画系统?

最后,我们把所有的人物都去掉了。

这是一种避免插图变得过于情绪化并给人以更中性的感觉的方法。最新的迭代最小化了戏剧性,它通过半抽象的屏幕表现来呈现一个问题,但也指出了取消之前的预期。

参考资料库

当你在画插图的时候,建立一个你已经使用过的不同元素的资料库是很有用的。这意味着你在以后可以去参考它们,可以确保你的风格在不同的插图上保持一致。从长远来看,保持插图的一致性是系统整体有效性的关键。

干货|如何建立一个强大的品牌插画系统?

干货|如何建立一个强大的品牌插画系统?

我们经历了很多阶段才达到了最终迭代……

干货|如何建立一个强大的品牌插画系统?

不断的迭代是一个成功的视觉识别的最重要的部分,不断的创建新的版本,获取反馈,并设计新的迭代。一切都是原型,你必须保持调整的态度,以使你的品牌尽可能贴近用户。让相关人士了解最新情况和参与进来,并为意外的转折做好准备。

设计也是一个过程,每一步都让你更接近一个更好的结果。

只要你专注于研究和反馈,你就会朝着正确的方向前进。这就是我从设计中获得的最大收获,我对正在进行的过程充满了动力,当我感觉自己在不断改进时,我很乐意做我所做的事情。

干货|如何建立一个强大的品牌插画系统?

 

作者:By Yihui Liu

链接:smashingmagazine.com/author/yihui-liu/

译者:Tzw_n,公众号「小阿田的设计笔记」

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

题图来自原文

随意打赏

提交建议
微信扫一扫,分享给好友吧。