摘要:UI设计主要是用户界面设计。在网络科技快速发展的时代,如何更好地提升产品界面品质,实现良好的人机互动,成为当下UI设计领域的重要问题,文章主要阐述设计师在设计过程中如何将视觉元素合理布局,同时加入设计师独到的设计创意,为不断对用户界面的功能和艺术性进行优化提出有价值的参考。
关键词:UI设计; 视觉元素; 用户视觉交互;
Research on visual thinking of UI design under network information technology
He Jing
School of industry and design,Jiangxi Institute of environmental engineering
Abstract:UI design is mainly user interface design. In the era of rapid development of network technology,how to better improve the quality of product interface and achieve good human-computer interaction has become an important issue in the field of UI design. This paper mainly describes how to reasonably layout the visual elements in the design process,and add the designer's unique design creativity,so as to continuously optimize the function and artistry of the user interface Value reference.
0 引言
随着网络信息技术的发展和应用,人们的日常生活也发生了极大的变化,越来越多的智能电子产品走进了人们的生活,比如:平板电脑,智能手机,电子手环,智能家电、儿童学习电子书等,极大提升了人们的生活品质[1]。作为连接产品界面与用户的UI设计也开始为人们重视起来,许多高校为了应对发展,纷纷开设了UI设计课程。但是由于UI设计属于新兴行业,发展尚不成熟,在设计过程中存在诸多问题有待改进。
1 UI设计的视觉元素
分析UI设计的视觉元素,有助于对UI设计进行整体思考,为视觉传达设计工作的开展发挥指导性作用,进而对用户界面进行积极的优化。UI设计的视觉元素主要有以下几个方面。
1.1 文字
文字是日常生活中传递信息的重要方式,在UI界面可以简洁、准确地将信息传达给用户,发挥着重要的作用,文字也是视觉传达设计中最基本的表现形式,不同的文本形式可以配合不同的界面环境,增强用户的记忆。其由两部分组成,一部分是系统的默认字体,使界面大面积的字体在大小、样式、颜色、层次等方面进行统一,提高用户阅读效率,减少视觉负担。例如苹果专门为中国用户打造的苹果苹方字体,和原先黑体字相比较字形扁平化,笔画更加细致耐看,中文显示效果更加清晰优美,提升阅读观感。另一部分的字体为了突出产品的特色,吸引用户眼球,将个别的字体图形化,加入艺术化效果,从而达到宣传的目的例如淘宝App图标就是用了淘宝的首字“淘”字为设计元素,将“淘”字笔画设计得非常圆润,有一个像小喇叭的形态,表现淘宝在喊话消费者前来购买。
1.2 图形
除文字以外,图形也是UI设计里重要的表现元素,相对于文字而言,图形更加的直观突破了文字区域限制,图形也包括两部分,一部分是功能性图标,包括按钮、图标等,用点、线、面构成,有些图标也会用文字的形式,图标所蕴含的内容必须要准确,虽然要准确地表达它,但是图标是一个隐喻,表达这个图标代表的含义,所以图标的形状、构思、颜色、质感等都有讲究;另一部分图形是装饰图形,按照图形构成的法则构成,比文字更加直观,还有图形海报的形式,大部分由装饰图形作为背景,烘托产品或者人物,将联想和认知相结合[2]。目前,UI设计里有静态图和动态图两种不同形式,静态图像主要使用JPEG格式,这种文件格式的优点是:文件小,图形清晰度较高,可以广泛地使用在图标,展示产品详细信息、静态广告和字体图形等方面,在很多页面首页最醒目的位置就是产品的广告位,当顾客对此商品有兴趣可以点击广告,进入产品详情页,内页详情图片清晰,新颖,多方位展现产品角度,有很多产品的详细信息;App欢迎页面也做得非常精彩,为了吸引顾客,拉近和顾客之间的距离商家也是费尽心思,比如闲鱼的欢迎页面,不同时期会有不同的主题,618、双十一是商品促销日,欢迎海报里会出现琳琅满目的时尚商品,也有为消费者省钱的优惠券等插画展示。母亲节闲鱼页面有和母亲通电话的温馨场景,还不忘给母亲带上爱心小礼物。这些都是商家为了打消顾客视觉疲劳所用心的地方;随着我国科技的不断发展,动态图形在很大空间上得到应用,成为UI设计的主流格式,最常用的格式是GIF,PNG,SVG等3种,GIF格式图片色彩还原不高,图像不清晰,一般用在要求不高的动态图形上,如一些简洁的动态表情包的使用,为顾客沟通增添了情趣,但是这样的表情包是不能用大图的,大图虽然画质高,但是在传输速度上不占优势,一个表情不能瞬间传达此分此秒的心情,下一秒也许又是另一种表情了,会影响使用者使用的感受。PNG格式和GIF格式不同,两者同为动态效果,但是PNG是无损格式,图像清晰,色彩还原度高,在缩小的画面上仍旧以清晰的画质展示,所以是UI界面设计里面运用最多,是主流动态的格式,这样质感的格式在展示产品信息的时候丰富了展示形态,当静态图形看多了有厌倦感的时候,动态效果正好改善了人们的疲倦感。SVG可以缩放矢量图形,并以文本格式来储存[3]。虽然这些图形只是配角,但起到了装饰美化的作用,在UI用户高要求的今天,缓解了用户的视觉疲劳,激发了用户的感官视觉,使用户在使用的过程中得到良好的互动体验。
1.3 色彩
色彩能够使人们在视觉上第一时间得到冲击,这种感受能够在使用UI界面的过程中贯穿始终,最终保持在人们的脑海里,人们也许不记得界面具体的内容,但是却始终记得界面色调的搭配,例如提到淘宝,人们会想起橘红的暖色,一般来说橘红色象征着欢乐、愉快,消费者在淘宝购物消费,自然心情要好,情绪要高涨,才会不停买买买;提起百度,人们会联系到蓝色,蓝色有如浩瀚的星空,有无尽的知识带人们探索和提问,给人知识渊博之感。大红颜色又让人想到了拼多多,你看这就是色彩的魔力,也许你不记得App标志详细的样子,但是你一定记得它主打是什么颜色。确定界面主色调,合理搭配色彩,激活人们的感官世界,对UI产品产生充分的联想,使界面功能得到满足,通过色彩提升用户对界面的认同感,界面的统一性,形成对界面固有的观念和习惯,而这宝贵的习惯将会引导人们继续使用该界面,提高该移动终端或者软件的使用率,进而提升UI产品本身的价值。
2 UI设计的视觉优化重点
通过上述分析,在UI设计中视觉表现主要在文字、图形、色彩等视觉元素的组合方面,这和视觉传达设计存在相似地方,又有明显的差异,为了更好地满足用户的需求,设计师在UI设计过程中应该注意以下的几个方面。
2.1 形成良好的视觉交互逻辑
UI设计主要是为用户和界面形成良好互动而存在的,合理的交互设计能够为用户带来更好的交互体验,从而达到使用要求。所以一个好的UI设计首先就是界面形成良好的视觉交互逻辑。UI视觉设计师常常会说:“这个内容我可以换个位置吗?”但交互设计师也许会说:“你这样表达会产生歧义,用户容易误解,需要改进”。为什么会出现这类问题呢?因为两者所站的角度不同,作为UI设计师必须对界面的内容有充分的了解,对界面之间的逻辑关系有深层次的掌握,并且通过一系列精准数据作为最终设计的准绳,和交互设计师做好配合。在这准备的基础上发挥设计师的长处,做好视觉效果处理,以满足用户的视觉需求。结合UI产品特色,完善UI界面设计,保证界面里所有的信息都能被用户理解、接受、处理,满足用户使用需求[4]。
2.2 符合用户的视觉需求
UI设计的最终目的是需要用户使用的,用户在进行阅读的时候都有相应的阅读顺序,UI设计的逻辑性也是服务于用户视觉习惯的,经过大量的数据分析能够使设计师能够精准地分析用户的使用特点,将对应的模块内容和层级关系交互视觉流程设计保持一致。这就要求设计师在进行UI设计的时候,需要以客观调查为准绳,对界面设计的整体风格,页面布局,图形创意都围绕用户视觉需求来进行[5]。在设计期间结合设计师个人的设计思维,不仅使得UI界面画面质量可以得到明显提升,加深用户对产品使用的感官体验,更有助于发掘潜在用户,为UI产品的发展发挥重要作用。
2.3 合理安排布局
布局也可以说是对UI界面的视觉排版,要求设计师运用点、线、面、图形、文字、色彩等元素进行合理规划。在设计布局的过程中,可以用色彩展现UI界面的性格特点,传递产品魅力;利用图形和文字传递产品详细信息,提升浏览舒适度;同时,在界面布局上还可以分为横向、纵向和三维立体3种布局方式,设计师可以根据具体的界面内容,和移动终端呈现方式,结合用户视觉和思维习惯之后来设计的具体布局方案,例如在手机上展现内容的时候适合竖向布局方式,方便操作;如果是平板展示的话,可以用横向的方式,因为大部分在使用平板的时候都是横向放置的,内容用横向展示方便用户浏览。从界面风格上,一方面可以利用UI产品的内容对界面进行模块化的设计,使得界面呈现出理性,规范之感;如果UI产品带有文艺色彩,也可以运用艺术化的表现方式,对画面进行分割,节奏变化,来提升界面的艺术效果。
3 结语
综上所述,在网络科技快速发展的时代,如何更好地提升产品界面品质,实现良好的人机互动,成为当下UI设计领域的重要问题,为了解决这一问题设计师在设计过程中应融入用户的视觉需求,将色彩、文字、图形等视觉元素进行合理布局,同时加入设计师独到的设计创意,不断对用户界面的功能和艺术性进行优化,使UI设计在新时期能够良性发展。
参考文献
[1]仇慧琴,田世彬.智能手机UI界面设计分析[J].赤峰学院学报:自然科学版,2016(16):41-43.
[2]董楷.徐昊.视觉传达艺术设计的创新设计理念分析[J].中国民族博览,2019(5):161163.
[3]周玉成,韩思凡,黄蓉.传统元素在UI界面设计中的应用[J].科技视界,2018(3):35-36.
[4] 詹雯舒.视觉传达设计在新媒体时代的变化探究[J].数码设计(上),2019(8):13.
[5]王财富.试论UI设计中的视觉表现[J].美术教育研究,2018(5):77.