插画在手机UI界面设计中的应用

王佳

摘  要：随着手机的普及和智能化，用户对手机UI界面设计的美观度要求也越来越高。文章通过分析插画在手机UI界面设计中的优势，结合具体案例探究UI界面设计的创新思路和方法，而技术与插画艺术相结合的UI设计，能够给用户带来良好的交互体验。

关键词：插画;UI界面设计;交互

中图分类号：TN929.53       文献标志码：A         文章编号：2095-2945（2019）07-0105-02

Abstract： With the popularity and intelligence of mobile phones， users have higher and higher requirements for the beauty of mobile UI interface design. This paper analyzes the advantages of illustration in mobile phone UI interface design， combined with specific cases to explore the innovative ideas and methods of UI interface design， and the combination of technology and illustration art of UI design， can bring a good interactive experience to users.

Keywords： illustration; UI interface design; interaction

1 UI的定义及发展

UI即User Interface（用户界面）的简称。界面是介于用户与硬件之间用于互动的媒介。是人机沟通交流的桥梁，用来进行信息的传达，直接影响用户的体验感受。在科学技术迅速发展的今天，人们对时尚、审美、趣味的不断追求促进了手机UI领域的发展，为了更好的满足用户需求，在实用性原则的基础上，高效智能、简洁、易用已成为智能手机UI界面设计的基本原则。为了更好地满足用户需求，为用户提供良好顺畅的操作体验，提高UI界面的美观性与交互性显得尤为重要，更是UI设计师需要不懈努力和探索的主要方向，进而才能促进UI设计领域的长远发展。

2 插画在UI界面设计中的优势

2.1 强调故事性和趣味性

优秀的UI界面设计能够充分吸收和借鉴插画艺术的表现技法和形式，进而起到营造氛围、渲染情绪、描摹环境的作用，有一定的故事性或者趣味性，进而以情动人，以此来增加用户的视觉愉悦感。具体表现为以下几方面，首先，插画可以准确的再现故事情节，要知道观众总会被自己熟悉的事物所吸引，插画风格的UI界面设计则充分抓住这点，用图片代替文字以给人最直观的感受。其次，插画风格可通过联想想象、夸张幽默、象征隐喻等形式来表现多种艺术形式，进而提升用户的视觉体验与审美素养。此外，受波普艺术的影响，插画风格的UI界面设计有时也融入一些流行的社会热点或者网络流行标语，契合大众心理并带有一定趣味性。如在圣诞节、春节等节庆时推出的界面设计，或以大众熟知的动漫形象、流行用语为主题推出的界面设计，都在一定程度上引发了观众的情感共鸣。

2.2 承载充足的信息量

插画介入手机UI界面的设计能够承载更多的信息量，要知道手机APP的作用是将主要信息直观形象的传递给受众，但人作为信息的接收者，有可能因为认知习惯、自身能力、教育水平、文化背景等差异在理解上产生偏差，符号式的表达方式虽然简洁、实用，但不能保证用户对全新的界面，特别是其中的图标准确无误的读取和理解。而心理学实验发现，接近实物的具象图标更符合用户的经验认知，而且更容易识别，所以插画风格的UI界面设计显然更适合进入商业市场的手机APP应用。它注重将信息充分展现，进而使用户的理解更为顺畅，认识并熟悉该产品。例如百度糯米七夕节的分类图标，采用了写实的风格，将传统元素融入图标设计，既突出中国特色，又有效传达七夕节主题活动讯息。

2.3 满足用户的情感需求

一个成熟的APP产品，除了在使用功能上满足用户的需求外，还要在更高层次上体现对用户“社会需求欲望上的态度体验”的关怀，即通过丰富、细致的图像语言，引起用户情感上的共鸣，使用户对该APP产品由使用上的“需要”变成情感上的“想要”。此外插画本身就具有装饰美化的作用，插画元素为原本平淡的APP界面增添了美丽的色彩，强化了界面的视觉吸引力，同时也给用户带来了美的艺术享受。UI界面设计作为一种商业竞争手段，更注重信息的有效传达。用户不可能仅仅满足于接受信息，而插画所传达出的艺术情感使得用户的精神需求得以满足。例如淘宝在无网状态下，显示一幅可愛的插画要比单纯的显示文字给人的感觉好得多，也可以尽可能的减轻用户的焦虑感。

3 插画在手机UI界面设计中的广泛应用

插画在手机APP界面的大量使用并非个例，大部分移动APP都开始重视其在UI界面设计中的作用，在准确传达信息的同时有效提高产品的用户体验。作为UI设计师要学会用UI的思维做插画，用插画的技法做UI，将二者进行跨界连接，创造与众不同的UI界面。目前应用于手机UI界面设计的插画风格种类繁多，下面我们以最典型的几种风格为例来做具体分析。

3.1 扁平插画风格UI界面

扁平风格的插画是目前UI界面设计比较流行的设计风格，通常以简洁大方的表现形式，去掉渐变、投影和纹理，仅用漂亮的排版、简单的图标和形状、充满活力的颜色来帮助构建视觉层次，更重要的是能够深入地关注于易用性上，符合年青一代的审美趣味。这里最具代表性的是苹果公司研发的IOS系统的UI界面设计[1]（P42），将其中的图标、界面等元素设计成简洁、明亮的效果，其中的天气、短信、拨号等功能图标，都是在原有基础上简化提炼设计而成，在保证图标直观富有趣味的基础上提高了操作的流畅性、轻快感，为用户带了最佳的体验感受，此外苹果系统的配色也十分考究，扁平插画风格的图标设计能使用户最大限度的产生好感和共鸣，进而引发用户自发的去理解图标信息。例如Apple Safari图标就是一个指南针的形象，整体配色以蓝色为主，能够凸显一种神秘感，在使用Safari浏览信息时就好比是在知识的海洋里探寻无限奥秘，无论在意向还是色彩上都达到了一种高度融合，这才使扁平插画风格发挥到最优的效果。

3.2 传统手绘插画风格UI界面

传统手绘插画具有丰富的表现力，可根据材料、画笔的不同来表现不同机理质感的画面;其次，插画设计有一定的随机性，在其勾线、上色、成稿的过程中都会产生一些意想不到的艺术效果;此外，手绘插画往往更加注重传统元素和文化的融合，能够让用户更多的产生情感上的共鸣，尤其是在一些传统节日或者地方特色类APP设计中，传统手绘插画更易表现这些特征。以2016年主题桌面获奖作品《东方印象》为例分析[2]（P36），主要运用的是传统水墨插画来表现UI界面，锁屏界面主要运用的是文房四宝;而主屏的图标设计也是取自传统元素的隐含寓意，天气的图标设计是油纸伞，以墨色打底晕开纸伞，寓意天气状况阴晴不定。计算器的图标是古代的算盘，十分具有中国传统特色，整体的界面设计十分契合主题，还可利用水墨的动态效果来做进一步的交互动画、全息投影，让用户全方位的感受传统插画下的UI界面的独特魅力。

3.3 半立体插画风格的UI界面

半立体插画也叫2.5维插画，主要以二维的手法来表现三维效果，在目前手机UI界面设计中，立体插画风格的出镜率越来越高，可以说在视觉上给用户带来了一种全新的视觉体验，通常以简洁概括的色块来表现三维图标的插画效果，让用户更为直观的理解主题APP，以“淘点点”点餐系统里的红包摇一摇界面为例，整体背景画面是一块红蓝相间的桌布，一圈缝纫线的加入令原本抽象的桌布有了质感，桌布上方是一个放入手机模型磁盘，桌布下方刀、叉、勺、筷子一次排开，全部采用半立体效果表现，让餐具的质感更加突出但和真实的餐具又有一定差距，这种设计既可以简化制作过程令APP操作流畅，同时又能给用户带来独特的视觉感受，可谓是在扁平化与传统手绘插画之间找寻的一种折中的表现形式，但不管何种表现手法，都要根据具体情况具体应用。

4 插画和手机UI界面结合的创新点

4.1 契合主题的故事插图

在这个科技至上的时代，人与人之间的交流越来越少，人们的情感交流和体验更多地依赖于手机、电脑等智能设备。有故事性的UI界面设计，能够系统地串联起产品的精神内涵。插画风格的界面设计可根据APP主题变化风格，可以是浪漫唯美、靓丽时尚，也可以怀旧温馨、水墨古风……这些风格可以满足不同认知角度和层次的用户需求。而且正是由于插画风格的细化，使其能够满足“人性内在固有尺度在不同时期与阶段”的情感需求。比起简约的符号化的界面设计，富有感染力和表现力的插画主题的UI界面设计，可以把用户的心灵诉求和体验完整而准确的表现出来，而且极具故事性和趣味性的画面能够给用户带来无限遐想的空间，进而凸显不同APP的主题特色。

4.2 以人为本的交互体验

随着科学技术的不断发展，手机APP的界面设计已不满足于静态展示，带有一定交互性质的动态插画更能强化这种趣味性，从而吸引人的注意力。这种动态的刺激，不仅能够激发用户的兴趣，而且利用互动性还可加强用户体验[3]（P17）。随着技术的不断进步，这种犹如动画短片一样的插画界面设计逐渐被大众所接受。动态插画承载的信息量更为丰富多样，甚至可以和音乐、视频短片相结合，通过多媒体更为全面地展现不同APP的主要特征，它更強调人的参与性与互动性，让用户能够快速掌握APP的使用，利用最短的时间获取更多有趣丰富的信息，降低用户理解上的歧义，将手机APP的功能特性发挥到最大。

5 结束语

随着科技的不断发展，智能手机功能的不断完善，使得插画在UI界面设计中的应用更为多样化丰富化。当今社会人们对电子产品的偏爱已然成了一种趋势，插画风格的UI界面设计让原本冰冷的图标变得易懂且富有趣味，它就好比是视觉触发器，超越任何文化和语言的隔阂，瞬间传递大量信息。作为UI设计师，我们要善于利用科技的手段为设计服务，进而更好的满足用户需求。

参考文献：

[1]仇慧琴.田世彬.智能手机UI界面设计分析[J].赤峰学院学报，2016，08.

[2]周玉成.韩思凡.黄蓉.传统元素在UI界面设计中的应用[J].科技视界，2018，01.

[3]王凡.从“少即是多”中探究移动端扁平化UI界面设计[D].广东工业大学，2015，05.