摘要：随着移动互联网的出现以及智能手机等移动终端设备的普及，人们在生活中逐渐习惯了用移动客户端的上网方式，这也就促进了APP开发以及界面设计的发展。对于APP界面设计而言，除了需要把握基本的视觉元素的设计性与美感之外，用户体验也是另一个需要考虑的重要方面。APP界面设计侧重于产品的实用性与易用性，界面的视觉设计需要以用户为中心，帮助用户快速的适应APP整体运行环境，传递关键交互信息。
关键词：APP界面设计；交互设计；用户体验
随着智能手机的出现与飞速地发展，触屏的操作方式带来了对移动设备更为便利的操作，而在智能手机发展的过程中也随之形成了APP的概念。APP为Application的缩写，定义为在移动设备如智能手机上所使用的第三方应用程序，也可以称之为应用，应用程序，移动互联网产品，移动客户端等。一款APP产品的界面设计包括很多方面，比如界面的布局形式，颜色，文字字体尺寸，图形风格搭配等，这些视觉元素的设计都是为了让界面呈现出更加合理美观的效果。本文以移动应用产品界面视觉设计为切入点，侧重于研究界面设计中视觉元素的应用对产品实用性的影响，探究在“以用户为中心”的设计理念下交互产品的界面如何在保持良好的视觉体验的同时提高产品的实用性与易用性。
一、APP界面视觉设计
用户界面（User Interface),也称人机交互，是指人与机器或者系统之间进行信息交换或行为交互的媒介，其本质作用是让用户更方便地获取有效信息并完成任务，获得良好的使用体验。
移动应用产品的交互性，关联性和功能性是进行界面设计时需要着重考虑的因素。首先是交互性，人对移动设备具有操作与控制感，并通过控制设备完成相应任务；第二，一款APP的界面并非单独存在，其界面与界面之间，界面与图标之间都是围绕着主题相联系的；其次，APP不同于一般的视觉产品，它通常具有强大的功能性，实用的功能才能提高用户的留存度。因此，基于移动应用产品的特性，有三个原则是用户界面设计时需要遵循的：1）将界面置于用户可控制的范围内，使用用户的语言组织界面，；2）减轻用户的记忆负担，为用户提供直观的界面；3）保持界面的一致性，一致性为用户提供可预测的熟悉环境。
一款APP包含与之对应的图标及众多操作界面，这些图标与操作界面的设计就是界面视觉设计，即UI视觉设计，如界面的布局形式，主色调，文字，图形风格等等。传统的视觉设计重在协调图形，文字与色彩这三大视觉要素之间的关系，将设计师的想法用视觉的形式呈现在观者面前，第一时间吸引观者的注意力，提高观者对作品的关注度，我们可以用“美感”“创意”来概括传统视觉设计。但是APP界面中的视觉设计，虽然同样包含了图形，色彩和文字这三个要素，APP是动态的，它最大的特点就是人机交互，而这一特点便要求在进行界面设计时需要考虑到用户体验，所以“易懂”“易用”才是APP界面设计的关键。APP的界面视觉设计是利用三大视觉元素的合理搭配设计出具有美观视觉感受的产品，如上文所述，由于其具备交互性，关联性和功能性的特点，因此在设计时还需要考虑到“用户体验”这一层面，做到以用户为中心来设计。
二、用户体验与界面视觉设计
用户体验(User Experience)是以用户为中心的一种设计方法，以用户需求进行设计，从用户的角度来感受产品，要求产品具有吸引力和趣味性，并且设计过程始终围绕用户的使用体验。认知心理学家Donald.A.Norman在20世纪90年代中期最早提出用户体验这个概念，用来表示用户与系统产生交互行为时的感受，包括富有美感，令人愉悦，具有成就感，得到情感满足等，所以用户体验贯穿在界面设计甚至交互产品开发的所有阶段。
如上文所述，不难发现用户体验其实在一定程度内可以通过界面视觉设计的优化去提升和改进，同时，用户体验也引导了APP界面视觉设计，使用户获得更好的体验，从而体现APP产品的使用与实用价值。
Donald.A.Norman提出用户体验处理的是用户与产品交互时的所有方面，即如何理解，学习和使用产品。而这些方面包括与产品性能相关的所有交互和视觉设计。《用户体验要素》中将用户体验分为5个要素，自下而上分别为战略层，范围层，结构层，框架层，表现层，这五大要素层层建设由抽象到具体。其中，表现层包括界面视觉设计，是与用户关系最紧密也是给用户带来最直观感受的层面。它包含着之前四个层面所有的目标，产品或者系统就是通过表现层与用户产生交互行为来实现自身的价值。所以，在最具体的表现层，需要运用视觉设计元素，结合美学和用户体验把APP的内容和功能细致化具体化，以符合用户的感受。如果一个APP产品的界面设计风格凌乱，内容编排无序，色彩不协调或者字体识别度不高，这些因素都会影响用户体验从而导致用户快速流失。也有很多界面视觉设计精良的APP产品，依然存在不能进入市场或用户留存度低的问题，原因之一就是这类产品虽然界面视觉表现很好，但是缺乏实用价值，在开发的过程中如果过于关注视觉层面的设计而忽略了用户体验，产品就不能满足企业的战略目标也不能成为满足用户需求的高效实用工具，而仅仅是美观的概念设计作品而已。综上所述，用户体验与产品界面设计的关系是双向的，用户体验是进行界面视觉元素设计的重要依据，而界面设计则是将用户需求以视觉的形式表现出来，以此来提高产品的实用性价值。
三、视觉元素在界面设计中的应用
1.视觉元素对界面实用性的影响
（1）图形图像
相比文字信息，图形图像对于用户而言更容易被理解。在多数情况下，图形图像能够传达出复杂的信息，作为界面设计中最有表现力的元素，图形图像具有很强的可控性，容易发挥创意，营造氛围。在APP界面设计中图形图像常常用来引导、启发和呈现信息，更有针对性地、视觉化地同用户进行交流，并且具有易于识别，有针对性，能够被不同的用户轻松理解的特征。
APP内的一些空白页因为重要性并不高，只是需要告诉用户一个状态，所以并没有得到过多的设计，展示的形式一般是图标配文案，但如果用一些具有创意的图形来表示空白状态（图1-1），可以使空白页变的更富趣味性，即使在没有内容的情况下也是饱满的，让App的每一个维度都变的更丰富，同时这样的形式对用户来使用体验说也更加友好。图形图像能够将复杂的概念简化为易于理解的视觉信息，这也是为什么它会常常运用到用户引导页中（图1-2），新用户引导页常常会介绍APP主要功能,插画以图形化的形式为用户提供使用环境，让界面所要传递的信息更加明朗，帮助用户学习产品的功能。当APP界面采用极简设计的时候，界面搭配一幅简单的插画来传递关键性的信息，不需要过多的文本，简单明了又不乏设计感。
（2）色彩
色彩本身就能够创造出独特的情感体验，色彩在界面当中的应用影响着许多不同的功能和属性，其中包括可用性和可读性，用户视觉和交互，信息组织，品牌认知度和品牌意识，以及设计整体体验等。系统地对UI界面的色彩进行管理，可以创建清晰易懂的导航，直观的交互，为整个项目设定情绪，呈现设计的主题，营造氛围。
图2-1所示的是一款婚礼策划类APP，由于APP中的内容主要是以小版块和列表的形式来展现，考虑到信息的层次和可读性，所以整个配色方案采用了柔和的色调，浅色的背景搭配渐变效果，营造出柔和、浪漫细腻的质感，符合产品本身定位，又不会喧宾夺主破坏功能和体验。除此之外，这样的色彩设计还能够让行为召唤元素更加突出，强化对比度使得核心元素和内容容易被感知到，强化信息层级。图2-2为一款理财类APP，为了让用户可以更加轻松地管理日常的收入和支出，提供全面的统计信息，界面采用深色的背景色，提高了数字和文本的可读性，并且吸引用户关注到关键性的区域和重要的数据。
（3）文字
文字是视觉设计中最重要的传达元素之一，文字本身的视觉特性和品质也影响着信息传递的质量，恰当的字体运用，可以使产品的定位和内容的情感更加清楚的传达给用户。“简书”作为一款写作类APP,为了优化阅读体验，选择了思源黑体作为内嵌字体，用户不管使用简体中文还是繁体中文，甚至其他文字都能有比较理想的表现（图3-1）。另一方面，字体及字体尺寸在界面当中的应用对产品争取用户的注意力，提升界面层次，提高特定元素的视觉重量和阅读效率有着一定的影响，如图3-2所示，大字体在界面当中能提升页面的特色，强化重要信息的传达。
2.以用户体验为核心的界面设计趋势
（1）模糊背景
模糊背景符合时下流行的扁平化和现代风的设计，可以很好的和幽灵按钮以及时下流行的元素搭配起来，提升用户体验。以图4为例，采用虚化电影海报作为背景，突出电影信息等主要内容，让内容模块变的清晰，用户阅读起来也会更加轻松，同时还可以规避复杂的设计，降低设计成本。
（2）渐变色与双色调
渐变色设计可以调节界面中过度使用的视觉元素，为页面增加层次感，帮助完善视觉表现以吸引更多的用户（图5-1）。而双色调比同类色渐变的视觉效果要更加强烈，突出页面更加重要、关键的元素（图5-2）。
（3）轻设计
产品界面的“轻设计”已成为一种发展趋势，其出现的重要原因在于现代人每天所接受的信息量巨大，轻设计则减少了接收的负担，其次，移动设备屏幕较小，显示信息有限，轻设计可以更加清晰、直观的呈现内容。在细节上，如图6所示，轻设计追求质感上的细腻丰富，不会过多使用强烈的对比或是复杂的图形去呈现画面的层次，所有元素的应用都围绕产品功能内容的本质，轻设计减少或去掉没用的设计元素，突出重要内容，减少用户的识别成本，让用户直接、轻松的理解设计所表现的内容。
参考文献
[1]Sun I视觉设计，超级APP视觉设计大揭密[M]北京：电子工业出版社，2015
[2]蒋晓，产品交互设计基础[M]北京：清华大学出版社,2016
[3]NORMAN D A, The Design of Everyday Things[M]S.I:Basic Books,2002
[4]艾伦.库伯著，丁全钢译，交互设计之路-让高科技产品回归人性[M],北京：电子工业出版社，2006
[5]PREECT J等著，刘晓辉等译，交互设计-超越人机交互[M],北京：电子工业出版社，2003
[6]加瑞特，用户体验的要素：以用户为中心的WEB的设计[M],北京：机械工业出版社，2008
[7]SHEDROFF N,Experience Design[M],S. I:New Publishing ,2001
[8]https://www.uisdc.com/
论文作者:陈诗雅
论文发表刊物:《知识-力量》2019年1月中
论文发表时间:2018/11/26
标签：用户论文; 视觉论文; 界面论文; 产品论文; 元素论文; 界面设计论文; 信息论文; 《知识-力量》2019年1月中论文;