艺术探讨
97
视界观.2021.06
UI 界面中轻拟物图标的设计研究
鲁莹莹
(中国人民大学,北京  100872)
摘 要:时间碎片化时代到来,人们的耐心被各种手机应用消减,大量的信息有意或无意占据了人们的
目光,这也意味着具有强视觉冲击力的APP 用户界面设计会更加容易吸引用户的注意力,用户界面中图标设计的重要性也因此愈发凸显,从拟物化、扁平化、再回到轻拟物化,花样繁多的设计风格不停地更换着人们的视觉口味,图标设计朝着多样化的方向飞快的发展着,轻拟物图标作为拟物图标的升级版出现在人们面前,本文以轻拟物图标设计为主线,基于移动端用户界面中的图标设计进行研究分析。关键词:UI;图标设计;轻拟物图标
一、UI 界面概述
UI 的全称是指UserInterface,用户界面,也称人机界面。UI 界面是指人和系统之间的界面,指用户和计算机进行沟通和互动的途径。UI 可以分成两大类:硬件界面和软件界面。UI 设计特指软件界面,用户可以利用键盘、鼠标、触摸屏等工具,通过UI 界面与计算机进行交互,计算机根据用户进行的操作给予用户一定的反馈,满足用户的使用需求。
UI 界面的有限设计空间使界面设计需保持必要的设计原则,轻量化设计使界面更具有功能性,不掺杂多余的干扰信息,使用户集中于功能使用。简洁性设计使界面保持简单明了、保证了产品的功能性和间接性,避免分散用户注意力。可操作性是用户界面的基本原则,用户通过对UI 界面的交互操作完成信息检索与查阅。
二、UI 界面中图标设计简述(一)图标的定义
从字面意义上来看,APP 图标是指移动端应用上图形和标识的结合符合,从广义上来讲,APP 图标是具有指代意义的图形符号,具有高度浓缩并快速传达信息、便于用户记忆的特征,广泛应用于各种类型的APP 界面中,具有标示性、可操作性、是移动端APP 必不可少的元素。
(二)图标的分类1.线形图标
是指根据想要表达的意象使用纯线条绘制的图像,通过控制线条的粗细和形状可以绘制各种不同样式的线形图标。线条的形状富于变化,易于识别,在图形表达上可以更加灵活,对于意象的表达也可以更加清晰,线性图标轻盈有引导性,强调功能性,视觉力度较弱,不干扰重要内容。
2.面形图标
由块构成,相比线形图标有更强的视觉冲击力、展现力和重量感,在界面设计中往往作为主要功能入口,例如首页界面中的金刚区、底部导航栏的选中效果等。可有效强调页面视觉重心,视觉表现力强于线形图标。
3.扁平化图标
扁平化图标主要使用形状和彩进行组合设计,不使用阴影、透视、纹理、渐变等元素,通常使用两到三种颜、多数以一种颜作为主,颜和形状更加丰富、图形趣味性也更强。其交互核心在于
功能本身的使用,所以去掉了冗余的界面和交互。扁平化图标的优点是突出内容主题,减弱各种渐变、阴影、高光等拟物视觉效果对用户视线的干扰,让用户更加专注于内容本身,简单易用。
4.拟物化图标
拟物化图标尽可能模拟真实物体的形象,加入适当的光影和纹理,并且具有明显的透视效果,使其和真实的物体高度相似,在辨识度上最佳,认知和学习成本低,给人一种代入感,但许多拟物化设计并没有实现较强的功能化,而只是实现了较好的视觉效果。缺点是当拟物化图标在较小的尺寸上显示时,其辨识度会大大降低。大多数拟物化界面的设计需要花费大量的时间在视觉上,使其更加接近真实物体的形象,并没有实现功能化。拟物化图标也会降低信息浏览效率,所以只适合做局部的视觉强化,来加强用户对特定区域的感
知。
5.轻拟物化图标
轻拟物化图标由拟物化图标演变而来,融合了扁平化与拟物化的共同特征,轻拟物化在光影、结构、透视上也做了实现,但是相比于拟物化结构更加简洁、在光影和肌理上并不追求仿真效果,而是处于扁平和拟物之间,使拟物性质更加概念化同时又便于识别,在设计上更加简洁,兼顾了项目效率和画面的视觉呈现。
三、轻拟物图标设计原则(一)图标的可识别性
可识别性是所有图标设计的最基本原则,识别,也就是辨认和区别,用户在看到某个图标时,能够清楚的辨认和区别图标所表达和传递的含义,能够对图标进行正常的交互操作, 这是图标最基本的设计原则,如果一个图标在设计上很混乱、无法让用户准确辨别,将会给用户带来较多困扰,从而影响整个APP 的使用体验。图标设计不是简单的图形设计,而是要求设计师运用概括化的能力将图标的含义准确、清晰的表达出来,使图标具有可识别性,清晰的表达相应的功能和操作,也就是说,用户一眼看上去就知道图标是做什么的,从而提高用户使用效率,提升用户体验。
(二)图标的统一性原则
对于轻拟物图标而言、图标的统一性所指图标在彩、透视、纹理、结构上都保持一致, 使图标模块保持统一性,在整个APP 页面上产Th 协调、一致的美感,增强视觉冲击力,也能加强用户对同一模块图标的功能认知,便于用户快速查功能。如果同一个模块中图标的风格各异,会造成用户认知错乱,严重影响APP 的使用,同时不利于传达品牌的统一特性,让用户对品牌整体认知不明确。
(三)图标的差异性原则图标在风格上要保持统一性统一的配、渐变、投影、透视等、但是对于图标的外在表现,要具有差异性,从整体上具备统一性,在个体上,彼此还要有差异性,这样便于用户辨别与区分,如果图标之间很相似,用户对图标所传达的含义认知模糊,很难分辨,不利于功能和交
互上的使用。页面设计是什么
四、轻拟物图标设计在APP
中的应用
图1 美团外卖APP 图标
轻拟物图标降低了项目设计成本、也增加了视觉表现力,广泛应用于外卖、游戏等平台、以美团外卖APP 为例(如图1),五个轻拟物图标占据了首页的视觉重心、外卖APP 页面会呈现大量高饱和且暖系的美食图片,以增加用户的食欲,吸引用户下单,所以让核心功能区的图标设计富有挑战性,纯线形或面形的图标展示较为单薄,会降低视觉重心,扁平化的设计在众多功能图标入口中不具备差异性,也不能突出
视界观 OBSERVATION SCOPE VIEW
98
www.sjgzzs
显示,而轻拟物化有别于扁平化图标,使五个主要模块凸显出来,Th 动活泼的轻拟物设计使模块更具趣味性、而食物外在形象的准确提取使图标看起来很可口,进一步增强了用户对平台售卖食物很新鲜、好吃的认知,
轻拟物化也使图标具有高度辨识性,降低了用户的学习成本,提升了视觉表现力,兼具了产品的功能性与用户体验性。
四、轻拟物图标设计未来前景分析
当代设计的趋势和设计风格的变化很难准确预知,但是设计始终围绕着、易用性、以用户为核心、为功能设计而发展着,就如社会的发展是为了人民Th 活幸福安乐,设计的发展同样是万变不离其宗,为用户服务是永远不变的宗旨,设计始终围绕用户、围绕需求而存在。图标的设计随着设计风格也多次进行了转变、拟物图标曾经盛极一时,但是后来被扁平化图标所取代,而轻拟物图标,也只是扁平化设计风格中寻求的另一种新突破,设计如同一个螺旋状的圈,永远在旋转,但是永远不会回到原点,一切都在改变,所以我们不难推测,轻拟物图标也许很快会被新的图标形式所取代、比如AI 图标、动效图标、或者是根据用户喜好自我调整彩的图标。一切都围绕着渲染用户情绪去改变。可以确信的是,未来图标的设计趋势一定有着更加丰富的细节、更加细腻的情绪引导,更加智能的交互体验,使APP 界面设计始终围绕着用户这个核心去运行。
在当代互联网的大趋势下,研究图标风格的未来走向,可以使设计从业者更加明确未来的设计趋势、准确判断用户对产品的迭代需求,从产品本身的定位出发,并将其融入到产品设计中,走在用户前面、带给用户更多的体验升级惊喜,提升产品使用体验。
五、结论
互联网时代,APP 的设计愈发受到重视和期待,而图标设计作为APP 的最关键因素也为APP 带来十分重要的影响,图标设计的统一性影响着界面的统一性,图标的风格和特征也
代表了APP 整体的风格,图标融于页面设计但是又有别于页面信息呈现,图标的可操作性使其成为界面重要的操作选择和入口,对用户操作的指引起着决定性作用,如果说页面的信息内容是APP 的肌肉和组织,那么图标就是APP 的血管和骨头、起着连通所有功能入口的关键作用。因此对于图标的风格特征研究依旧任重道远。
本文以UI 界面中轻拟物图标的应用作为切入点进行分析与研究。首先对移动端UI 界面的概念进行了阐述与定义,其次对UI 界面中图标的风格进行了梳理与分类,同时又对轻拟物图标在APP 中的应用案例进行分析与研究,总结了轻拟物图标的设计风格和特征,最后通过对轻拟物风格图标的研究对未来图标的设计趋势做出了预判和分析。
轻拟物图标的设计研究尚是一个新的研究课题,虽然面临着较多的设计瓶颈,但是随着APP 设计的不断成熟与平台用户的沉淀,UI 界面的图标设计终将会步入成熟,但是也将不断地遇到新的机遇和挑战。
参考文献:
[1]朱玲玉, 张卓. 扁平化风格设计在APP 图标设计中的体现[ J]. 湖北师范大学学报,
2019,39(40):27-30.
[2]毛珊珊.手机图形界面的图标设计风格研究[D].北京:北京服装学院,2012.
[3]吕星.人机交互中图标的研究[D].南京艺术学院.2011.
[4]王钧珑.移动端图标设计的发展及应用研究[D].西北大学.2015.
[5]夏韬.智能手机APP 中图标元素形式风格设计研究[D].北方工业大学.2017.
(上接第96页)
象动作。要让观众相信他们有情感、有情绪,就是靠动作的设计,在动作设计当中好的原画师会根据
实际的动作加以设计,增加动作的节奏和幽默感。
(二)巴渝地区民间舞蹈对微动画创作的应用
巴渝地区民间舞蹈嫁接到微动画动作可以分为舞蹈类和戏曲类。在动作设计上动画原理与民间舞蹈有融合,突出地域特造就独特艺术形式。巴渝地区民间舞蹈——舞蹈类的有:铜梁龙舞、酉阳摆手舞、潼南狮舞、北泉板凳龙、大傩舞、巫舞等。
巴渝地区民间舞蹈——戏曲类的有:川剧、梁山灯戏、面具阳戏、接龙傩戏、阳戏、余家傩戏、石壕杨戏、踩堂戏等。
四、巴渝地区民间音乐资源的利用
声音是微动画作品中试听效果最为主要的组成部分,在听觉上给予情感的倾斜和表达。巴渝地区民间音乐品种众多,有民间婚丧用的吹打类、民间劳作时的号子类、民间休闲时唱的山歌民歌类、民间借助乐器演奏的曲艺类、民间戏剧类等。
微动画设计中巴渝地区民间音乐——民间吹打类有:接龙吹打、金桥吹打、梁平癞子锣鼓、永城吹打、河锣鼓、薅草锣鼓、土家斗锣、甘宁鼓乐等。
微动画设计中巴渝地区民间音乐——民间号子类有:川江号子、南溪号子、石柱土家啰儿调、龙骨坡抬工号子等。
微动画设计中巴渝地区民间音乐——民间山歌民歌类有:秀山民歌、酉阳民歌、五句子山歌、鞍子苗歌等。
微动画设计中巴渝地区民间音乐——民间曲艺类有:金钱板、车灯、四川扬琴(重庆)、四川竹琴(重庆)、四川
清音(重庆)、等。
微动画设计中巴渝地区民间音乐——民间戏剧类有:川剧、接龙傩戏、阳戏、面具阳戏、余家傩戏、石壕杨戏、梁山灯戏、踩堂戏等。
微动画设计中探索巴渝地区民间艺术资源应用实际上是对民间艺术资源的保护和传承,文化传承是我们的使命,探讨全媒体时代下传播优秀的传统文化是一个新的命题。在微动画的设计中从民间艺术汲取养分,挖掘优秀的传统文化,利用全媒体重构巴渝民间艺术传承,既给受众带来全新的视觉文化享受,同时为巴渝地区民间艺术资源提供新的展示舞台。
参考文献:
[1]刘姗.基于巴渝地区民间艺术资源的动画创作研究.[D].重庆大学硕士,2013年.
[2]岳圳.探析民间美术在动画中的应用.[D].南昌大学,2013年.
[3]马晓萍.动画制作中声音三元素的运用.[J].新闻与写作,2015年.
[4]傅国.三峡民间歌谣与民俗文化研究_以重庆市巫溪五句子歌为例.[J]. 重庆三峡学院学报,2014年.
[5]高翔.民间美术在动画中的运用分析.[J]. 艺术科技, 2014年.
[6]苟劲松,谭书晴. 浅析民间美术在动画形象设计中的应用.[J]. 美与时代(中),2015.
作者简介:陈银伟(1983—),男,重庆市丰都县,重庆工程学院,讲师。

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。