APP下载

移动终端用户界面中的视觉创新

2021-04-13钟凤鸣

媒体融合新观察 2021年1期
关键词:用户界面视觉设计移动终端

钟凤鸣

摘要:基于当前大数据与信息时代下智能移动终端覆盖率高,而信息繁多杂乱的现状,提出移动终端用户界面的视觉设计创新,以便用户快速精准地接收关键有效信息。大数据信息时代下,应用程序用户界面需结合时代要求,以创新性的视觉设计使用户界面具备信息传递快速准确、视觉呈现简洁有效、用户体验轻松愉悦的特点。

关键词:移动终端 用户界面 视觉设计

随着电子科学技术与互联网技术的日新月异,手持移动终端的持有率呈井喷式上涨趋势,移动终端设备的全面普及接踵而来的即是數量庞大、林林总总的应用程序。据国家工信部数据显示,截至2019年末,我国国内市场上监测到的本土第三方应用商店APP数量为217万款。可见人们的生活与应用程序已然无法分割,应用程序已经能够包罗人们生活的方方面面。面对恒河沙数的信息和数据,许多移动终端的用户界面在筛选和处理冗余信息及最终的视觉呈现时显得力不从心。本文旨在以用户为中心,将用户的心理需求和情感体验作为重要考虑因素,从而在用户界面进行一系列视觉创新设计,目的是使用户在应用程序界面中感受到信息传达快速精准、视觉呈现简洁有效、用户体验轻松愉悦的舒畅过程。

一、用户界面的视觉设计创新

(一)版式布局化繁为简 对于移动终端用户界面而言,将特定的信息以快速准确的方式传递给受众是重中之重。置身于当今大数据下信息泛滥的时代,人们每天生活在数不胜数的各类信息中,导致他们的注意力十分有限,这就对当下的用户界面设计师提出更高要求,通过科学合理的方式使用户在有限的注意力中快速识别目标信息。同时,就受众而言,用户界面的视觉设计不同于海报设计那么有针对性,以购物网站为例,通常其界面设计要同时面对多类人群和多种任务,而不是像海报设计一样针对特定人群进行设计,这就需要移动终端用户界面在信息的处理上,应收集整合大量数据与信息并进行筛选,有选择性地过滤冗余信息,将重要信息重点呈现。在版面布局上,分清视觉层级关系,保持版面简洁精炼,给用户轻松、流畅的体验过程。在元素分区上,合理地将相关信息进行编组,理清阅读视觉流,避免出现阅读干扰,保证准确快速传播。

(二)过滤冗余信息 前文提到用户的注意力十分有限,诚然,在大数据时代的推动下,移动终端势必要跳出长久以来信息垒积的传统传递模式,向更加有条理的方向拓展。尤其是对于许多碎片化的信息,一味的堆砌只会让用户在繁杂的环境中产生厌恶烦躁的情绪,过多的碎片化信息也会使得用户在阅读的过程中备受困扰,信息的整合与归纳此时显得不容忽视。筛选和保留重要的信息,并将之进行精简化或图像化处理,过滤无用的多余信息,使传递时更加直观明确,从而提高用户的信任度。整个过程应时刻保持高度简洁,若采用图形化处理,则应多采用矩形、方形、圆形等简单的几何形状。理清层级关系。版面的构成方式、元素的逻辑秩序、主次的排放位置等因素都会对一个版面是否简洁美观影响重大。合理的版式编排能够引导用户产生流畅的操作过程,给人一种循序渐进的秩序感。这就要求在进行用户界面设计时,首先要将筛选后的图文信息进行编组化,体现出元素与元素、信息与信息之间的亲密性;其次要清晰梳理信息层级关系,并分组对应进行视觉表现上的差异。目的是使用户在短暂的阅读时间内迅速掌握要点,并选择是否要更进一步地去了解内容。除此之外还可以结合用户的心理和行为特点创建简洁易用的交互方式,提升界面的有效性。合理分区元素。清晰的板块分区能够让受众第一时间会意该板块的内容侧重,节省阅读时间,提高阅读效率。要将逻辑相关的信息排列在一起,而剩余信息则按照对齐排列的方式凸显统一性与秩序感,使界面和谐整洁,了然于目。

以购物网站淘宝为例, 淘宝恰到好处地处理着庞杂的商品信息。在手机淘宝主界面底部导航中采用“图形+文字”的处理方式,合理利用了人们对于图形图像更高的注目度加上对文字快速识别的这两个特点,将主要分类与特定特殊分类形成视觉层级差异化。在商品分类方面,手机淘宝的导航系统从用户的角度出发,做到涵盖面广、分类明确、清晰简洁,几乎不存在购物障碍。在网页淘宝中的导航则更是琳琅满目,层级分明,仅从户外运动一栏分类中就包含六十余种商品类别,用户只需根据自身需求一层层向下点击,即可准确浏览到心仪的商品类别。简明合理的界面设计能够在一瞬间打动浏览者并增强用户黏度,随之拥有更加广泛的用户与市场。

(三)色彩与文字的一致性 色彩与文字在用户界面视觉设计中的作用已经无需赘述了。“一致性原则”甚至也作为一种安全保险的设计准则被设计师们引为参照。对于体验用户而言,界面一致能够使用户感到舒适,一旦用户掌握主要的功能或界面,就可以在其他界面不需要过多提示从而进行自由操作。不会过多消耗时间与精力,由此降低用户的学习和记忆成本。一般在同一界面中不建议使用超过三种色彩或文字的组合,这会使人眼花缭乱,降低阅读性,提升阅读成本。相反,一个秩序严谨的移动终端界面,会带来“干净”、“清爽”的感受,使体验的过程充满愉悦。

色彩的一致性。早在先秦时期就已形成了中国传统五色观。古人把蓝、红、黄、白、黑五种颜色赋予特定的文化含义,并广泛应用于社会生活的各个方面,五色观也成为我国古典色彩美学思想的核心。远在古代人们就已对不同色彩所带给人的心理反应进行了划分。发展到现如今的设计中,对各种丰富色彩的感受也已分门别类。但在同一界面中如果天马行空任意使用过多的色彩会使阅读者带来误解与迷惑,不能达到渲染或强调某一氛围的效果。

需谨记,设计不是单纯为了形式美,而是解决矛盾,从矛盾入手。在此处的矛盾即是纯粹的设计审美与用户体验之间的矛盾,为了追求绝对的视觉美感而放弃用户心理的设计就像空中楼阁,无非是自娱自乐。而一味的去附和低俗审美无疑阻碍着设计之美的传播与发扬。因此二者之间应相互协调,共同发展。在用户界面中同一分区内使用统一的、相近的色彩会使界面更加整体,引导着用户的心理感受。大面积使用同色系色彩并不意味着界面一定会呈现出呆板、无趣、木讷的状态,可以在明确色彩的属性和特点与目标受众的关系后,以有规律的重复、流体的渐变等创新技法以及打造有质感的肌理与材料的呈现方式再结合色彩本身的明度、纯度、色相,形成具有可变化的节奏感、韵律感及视觉冲击的界面,以此创新设计打造惹人注目,具有独特统一的色彩风格。

文字在应用程序的用户界面中同样发挥着举足轻重的作用。文字具有直观、清晰的传递重要信息的作用,能够直截了当表达内容,让用户首先识别界面欲想传达的信息。在移动终端用户界面内,文字字体的选择需跟应用程序整体的风格相统一。在同一个界面设计中,字体的种类同样不宜超过三种,尽量保持规范化、整体化,若界面中出现拼音或英文字母的组合方式,则每一个英文字体也都需要与中文字体风格相一致。

除此之外,还需对字体的字号、颜色、行距、布局做统一性考慮,以达到整体流畅的浏览效果,给用户行云流水的使用体验。切忌仅凭设计师个人喜好而进行个性化尝试,极具个性化字体的使用范围较有针对性,滥用恐导致字体的辨识度降低或搭配风格怪异,影响用户体验感。

以一款介绍我国古代传统家具构件的手机端软件“榫卯”为例,首先它的启动界面明快简洁,精美大气的宋体字“榫卯”二字映入眼帘,就能迅速使用户的眼神与注意力聚焦,加之附上斑驳残缺的磨损质感,显露出一种充满岁月的美感。在这款软件中,整体色彩的调性全部选取与原木相关联的暖色调,给人以温暖、人情味的情感联系。通过滑动屏幕选择任意一个构件则可进入该构件的详情页,详情页的文字信息极为精简,但却重点明确。除开标志以外的字体统一采用黑色楷体,诠释出浓厚的中华文化的意蕴,文字内容不多却恰到好处。展现出“大道至简”的精髓,既重视了用户内心对“精简”的要求,又使得信息能够得到有效传达。

二、用户界面融入动态化图形

动态化图形设计在二维的平面设计基础上增加了时间与交互的维度,是一种多维的视觉设计。将动态化图形融入到移动终端用户界面的视觉设计中,不仅能够丰富界面的表达形式,使动态信息更加扣人心弦,被用户视线所捕捉,提升注目度,还是对传统界面设计的一大拓展,是艺术设计与科学技术的创新性结合。动态化的图形设计能够引导用户对界面产生很强的吸引力,更加全面、有效地展示界面信息,同时使用户即使处在纷扰的环境下也能够沉浸式地享受在应用程序中。在使用动态风格进行展示时,由静到动的顺序应符合阅读习惯和逻辑,此外,动态展示方式与图形之间应保持契合度,动态风格应与静态风格相统一。当前的动态化图形已通过智能手机、平板电脑、公共信息平台等新的传播媒介日益进入大众视野中,逐渐成为传播界的新宠,迎来越来越广阔的空间。

用户界面中的动态化图形设计是基于传统平面设计原则的基础上,结合动画、特效中的影像规律,最终以新颖的多维度动态效果展示出界面中的关键信息,同时提高整个界面的趣味性、层次感和美感。在动态化图形设计中,首先要考虑在传统的界面设计形式上需要进行的转变。例如,运动方向遵循从左到右或是从右到左?关键图形展示的顺序是否存在逻辑关联?动态化的速度或节奏是否与用户心理值相契合?要时刻“以人为中心”,这意味着要时刻以用户的心理感受为中心,设想并调研普通受众可接受的范围,尽可能达到最舒适愉悦的视觉感受,将用户因等待而产生的焦虑感大大缓解或降至最低。除此之外,还需要考虑图形动态化设计的形式美感要与静态化界面之间产生联系性。例如,动态元素以何种运动方式呈现?聚散、虚实、叠合、碰撞、跳跃等皆可根据静态界面风格要求进行相应设定。

以某一音乐类应用程序的动态化启动界面为例,使用动态标志或动态标语进行启动界面的展示能够生动形象传达出品牌的格调与类型,使用点、线、面等元素进行跳跃、闪烁、流淌去营造与用户一致的期待音符在心中跳动的心理感受。既在短时间内加强了用户对该音乐品牌的直观印象,也使用户在等待进入程序的这一时间段感受到趣味性而不觉乏味。这种将动态形式与内容的高度统一,实现了一加一大于二的效应,丰富了界面表现语言。还需注意的是,避免盲目套用动态模板,在整个动态设计的过程中必须保持图形的动作命令与界面风格、内涵、元素、音乐之间和谐统一,巧妙的关联性会使用户产生全新的不同于静态界面的视觉体验,创造典雅独特的视觉盛宴,强化整体风格。

移动终端用户界面的视觉设计经历了不同时代的洗礼,迎来了百花齐放的盛况,同时也随着科技的发展与审美的提升而注入更高要求,对用户界面的视觉创新已成为必然之势。面对生活环境中繁多杂乱的各类数据和信息,如何去分析提取关键点并借助用户界面创造性地呈现,使之直达受众的内心,透过冰冷的移动终端使用户在思想和感情上产生情感共鸣,对每一位设计工作者都是一个很大的挑战。在新媒体与新技术日益交融的时代潮流中,既要把握时机,又要勇于创新,才能呈现出更多富有感染力的、令人叹为观止的设计作品。

参考文献:

[1]高海军,历泉恩,张超军.色彩构成[M].北京:中国青年出版,2010.1.

[2]林嘉怡.大数据时代移动终端界面设计创新趋势研究[J].包装工程,2017,38(02):239-242.

[3]杨洁.基于用户认知特点的移动终端APP界面设计[J].传媒,2017(04):63-65.

[4]殷俊,王婉晴.基于注意和视知觉的移动端界面设计应用[J].包装工程,2019,40(10):68-72.

[5]杨琴.平面视觉元素在界面设计中的应用[J].包装工程,2019,40(06):278-281.

[6]彭纲.论网页的色彩[J].装饰,2004(02):94.

[7]彭芳.移动终端的网页设计优化的思考[J].科技创新导报,2018,15(15):130+132.

[8]黄兰.动态图形设计在信息传播中的创意途径研究[J].包装工程,2018,39(22):52-56.

[9]李濯缨.动态图形设计的动态表现原则——以“第25届金曲奖颁奖典礼”视觉设计为例[J].装饰,2018(09):142-143.

(作者单位:贵州日报当代融媒体集团)

猜你喜欢

用户界面视觉设计移动终端
微软新专利展示可折叠手机设计
物联网用户界面如何工作
计算机软件用户界面设计分析
蚌埠市双墩遗址对视觉符号的传承与影响
基于移动终端的高校移动学习体系构建研究
移动终端云计算应用分析
基于新媒体的视觉设计研究
电子商务网站视觉设计的策略
手机APP在学生信息化管理中的应用探索
线上品牌视觉设计研究