网页设计 » 视觉设计 » 构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

发表于: 视觉设计. 评论
Sponsor

前言:目前插画在众多互联网设计中流行起来,品牌如何建立一套能传递品牌理念,并有独特的品牌记忆的插画系统呢?本文将分享酷家乐UED的插画系统经验,也许对您构建品牌插画系统有所帮助。

构建品牌插画系统,让插画拥有独特的品牌记忆

一、项目背景

插画作为现代设计的一种重要的视觉传达形式,因其直观的形象性、真实的生活和美的感染力,在现代设计中占有独特的地位,它能将复杂的文字信息转化成清晰、明确、最直接的方式传递给用户,线上插图作为品牌视觉中的一部分,也是品牌与用户建立联系的重要软连接,随着业务需求的快速增长,我们需要针对插画做系统的规划整理来提高品牌形象传达的深度和广度,同时沉淀插画组件,快速提升工作效率。

构建品牌插画系统,让插画拥有独特的品牌记忆

二、设计思路

根据设计目标,如何去打造一个合适自己的插画风格呢?基于对公司业务、用户、品牌视觉原则的信息提取,我们将繁杂的信息概括聚焦,同时我们希望插画体系能将细碎重复的工作变得有序、规范化。结合以上考虑,我们总结出了设计方向的3个关键词。

构建品牌插画系统,让插画拥有独特的品牌记忆

插画风格选取

我们收集了大量现有的成熟插画案例,归纳整理了3种应用非常广泛的插画方向:扁平插画、手绘插画、立体插画。为了选择一个合理的插画方向,我们从绘制难度、拓展性、画面细腻度、易用性4个角度做了利弊权衡。最终选择了简约的扁平插画来进行视觉落地。此类造型风格,外轮廓概括性很高,具有明显的几何特征,删减了大量细节,在绘制和多人协作上占很大优势,同时具有设计装饰感,能形成较大张力的画面效果。

构建品牌插画系统,让插画拥有独特的品牌记忆

用户分析

根据《酷家乐用户画像报告》显示,酷家乐平台拥有7成的男性用户,90后为主要人群,整体设计方向需要符合主流人群审美。插画在不同场景中需要传递不同信息的和情绪,通过用户分析,我们能更清晰需要设计的内容和方向。

构建品牌插画系统,让插画拥有独特的品牌记忆

三、设计方案

过于强烈的风格容易造成极度喜爱或者极度反感的两极化现象出现,要保证大多数人的接受,我们避免过度抽象、夸张的艺术设计风格。同时考虑男性用户居多,设计风格遵循中性化的原则来设计。

构建品牌插画系统,让插画拥有独特的品牌记忆

角色设定

在风格探索的过程中,为了满足不同业务场景情况下的应用,根据酷家乐用户分析,我们围绕5种常见的职业进行人物角色设计,结合其职业特点赋予角色不同的视觉形象。

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

我们对颜色、线条、图案的应用方式进行了规范,根据前景色设定了相对应的背景色,丰富场景画面。

构建品牌插画系统,让插画拥有独特的品牌记忆

有了基本的角色设计和规范,我们将人物角色进行拆解,拓展了不同的人物角度、人物表情,并结合人物基础骨骼延伸出各种人物动态,方便不同场景中的应用。

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

场景元素

场景元素是常见工作场景中的装饰元素,本着凸出前景元素,背景装饰做为辅助点缀的设计原则,场景元素可与人物角色灵活搭配,创造不同故事画面。

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

四、设计应用

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

为了满足更丰富的视觉表现,我们也尝试了与3D元素相结合使用的方式,未来,我们也会将资产三维化,建造更完整的插画体系。

构建品牌插画系统,让插画拥有独特的品牌记忆

构建品牌插画系统,让插画拥有独特的品牌记忆

感谢阅读~

作者 | 小波
来源 | 酷家乐用户体验设计(ID:KUX_KUJIALE)

推荐:查看最受欢迎的 301 个设计网站 → http://hao.shejidaren.com
交流:为设计新人提供的设计交流群,请加入UI设计交流群,分享经验、接单、求职、聊设计。
赞助商链接
赞助商链接
设计达人微信交流社区:shejidaren888
喜欢这篇文章吗?欢迎分享到你的微博、QQ群,并关注我们的微博,谢谢支持。
版权:除非注明,本站文章均为原创文章,转载请联系我们授权,否则禁止转载。

{ 发表评论 }