【UI设计】插画在网页设计中的应用

多年来，插画开始以一种坚挺的姿势，站在设计趋势的最前列。不止是原本身处各个领域的画手和插画师开始越来越受追捧，而且连网页、UI和动效设计师都纷纷学习插画设计。

当然，更显著的变化，是插画在网页和UI中的使用越来越多，越来越频繁，甚至越来越多样。

插画被广泛地运用在杂志、图书、报纸、海报、传单等不同的传统载体之上，新的工具和技术使得它更加轻松地植根于数字化媒体当中。

作为设计中，最具有表现力的元素，一张插画所传递的信息比文字更多更丰富。在UI和网页中，使用插画来辅助传达信息，无疑更加直接到位。而插画的可定制性之强，犹在图片之上。

插画在UI界面中的运用，可以说相当广泛了，它更清晰，更时尚，也可以更加精准，甚至更有表现力，为什么不用呢？就适用范畴而言，我们可以观察到，它可以运用到这些地方：

• 页面主题图
• 网页首图和Banner
• 吉祥物和形象插画
• 博客文章配图
• 新用户引导教程
• 工具提示
• 奖励页面和成就页面
• 游戏化设计的页面
• 通知和系统消息
• 聊天表情
• 讲故事的辅助配图
• 信息图
• 营销和广告图
• 图标和装饰性内容
• 社交媒体页面
• 支持性内容的页面

插画是标题和文本的重要支撑

虽然图片一瞬间传递的信息很多，但是图片在很多时候是无法提供精准而详细的内容。用户依然需要文本来呈现清晰而可以被阅读和记录的内容，所以文本依然是不可或缺的。

在另外一方面，文本和标题已经具备的情况下，经过定制的插画能够辅助用户理解，更清晰的记忆。

在很多特定的领域，举个例子比如说金融，插画能够借助色彩、图形和形象来讲述故事，让用户更清晰的理解复杂的金融功能，甚至强化信任感，而这是文本所不具备的。插画能带来强烈的情感连接。

插画更适宜呈现故事

故事是最令人难忘的内容，剧情的走向和起承转合会给人留下深刻的印象。而插画则以清晰的形象将文字和意象勾连起来，无论是在网页、UI设计还是内容和体验上，都有着足够突出的体现。

营造氛围，渲染情绪，描摹环境，呈现角色，插画让故事更加鲜活、易于理解。在内容制造上，有着难以替代的作用。

插画独有的情感吸引力

人是情感动物，看似理性的皮囊之下，几乎每个决定都是在情感和情绪的驱动下完成的。如果某个设计除了能够帮你达成某个目标，还能让你感到愉悦，会心一笑，那么通常下一步就是将它收藏起来并且分享给朋友。

而在诸多设计因素当中，插画在撬动用户情绪这一点上，有着无与伦比的效用——从线条、色彩到面部表情和曲线和动效，都在竭尽全力地为你阐述故事，营造氛围，将你拉到故事和场景当中去。

插画能让品牌识别度更高

和文本相比，插画的视觉化属性无疑是更强的。图片插画所提供的定制化内容能够从各个方面来贴合品牌的需求，更加到位地表达品牌所需呈现的信息。

这也使得插画不仅仅在品牌宣传的时候，运用在广告、海报等显而易见的地方，而且也成了品牌 APP 中新用户引导和教程中必不可少的元素。

插画让用户可以更快理解和操作

无论是图标还是大幅的插画，都能帮助用户理解，更加直观地知道要看哪里，要做什么。面对如今的数字界面，用户的注意力持续的时间越来越短，而插画则让用户更快、更直接地获取信息，并且决策下一步要做什么。

如果插画或者图标内容不能被用户一眼看出来，那么用户就只能借助文本标签来了解功能是什么。设计师可以通过测试来测试图标和插画的可用性和识别度。

当然，插画的设计是没有门槛的，在设计的时候，要求也是比较高的。在使用和设计插画的时候，需要考虑以下的几个方面：

• 目标受众（身体能力，年龄，文化背景，教育水平等）
• 产品的使用环境
• 产品和内容的在全球范围内和当地的传播水平
• 所选图形的隐喻以及是否容易被识别
• 插画是否会让人分心

转载声明：文章来源于网络，不作任何商业用途！