基于视觉思维的用户界面设计(全文)

基于视觉思维的用户界面设计云计算智能终端等信息处理技术为用户界面的多样性带来了可能用户增强体验界面宜人可用变得越来越重要对用户认知行为的研究将有助于提升用户界面的体验质量。文章对认知学领域下的视觉思维进行研究，的理论出发点探究其在用户界面设计中的运用总结基于视觉思维的用户界面设计方法。视觉思维认知用户界面设计方法ZG分类号：J0-05XX：XX：1003-0069（20XX）02-0109-03随着计算机硬件设备和软件及信息技术的进步用户界面逐渐从单一的呈现形式向多感官交互、实时个性化呈现方式进展。如今以用户为中心成为用户界面设计的重要原则单纯地通过技术手段已不能够满足用户界面的体验质量在用户界面设计时应深入了解用户从感官体验到理性思维的过程充分满足用户的认知行为和需求，为用户提供更为高效易用的增强性交互体验。视觉感知是用户与界面进行交互过程中最为频繁的感知行为而视觉思维活动作为感知与思维相结合的认知活动能够帮助用户在进行人机交互过程中完成―系列认知任务。因此，从视觉思维任务及作用机制角度来探究用户界面设计对提高人机界面的用户增强体验有着十分重要的意义。11视觉思维的概念20世纪早期，一个由德国心理学家组成的研究小组提出了格式塔原理（Gestlt，又称完形心理学，打破了对于视觉活动的片面理解对认知心理学的进展起到了推动作用更为设计领域带来了更为深远的影响而视觉思维理论正是基于认知心理学与格式塔原理提出的该理论得到了生理学心理学等各方面的有力支持。1.1视觉思维的概念及特征视觉思维（Visulthinking，又称视知觉，是视觉感受与理性思维的融合产物最早是由美国心理学家鲁道夫阿恩海姆（Rudolfrnheim）在其著作《视觉思维>中提出的。不同于诸如逻辑思维语言思维等抽象思维视觉思维是一种基于视觉感知的制造性思维人借助对所获得的视觉感知进行筛选从而得到心理形象产物即视觉意象视觉思维能够以这些视觉意象作为摆脱已有的认知规范从而使认识主体直接感受来自外界的视觉感知充分发挥认识主体的制造力和主观能动性。视觉思维的特点具体表现为四个方面首先视觉思维源于并受制于客体自身结构认识主体是通过对客观事物的感知接受视觉信息并将这些视觉信息的含义通过视觉思维的认知过程传递到大脑中因此认识主体的视觉思维是在客体的引导下进行信息的理解与认知。其次，视觉思维能够唤醒“无意识心理。1视觉思维往往能够诱导直觉的产生进而使深藏于意识主体中的沉默知觉快速转化为现实而有效的知识从而更为有效地被自觉视觉思维具有灵活性与选择性视觉思维受到人的主观因素影响通过视觉意象操作发挥想象作用进而产生的因此人们通常试图将所感受到的客观事物与大脑中的记忆与经验或者个人的视觉习惯与兴趣爱好相联系从而具有灵活人的视觉思维在一次次的视觉感受经验影响下产生了一种固定模式这使得此后一旦再次接收到相似的视觉信息大脑就会将其与之前的经验相联系并将主要的精力分配到对固定模式中核心信息的理解上。1.2视觉思维的任务过程对于外界事物所见所闻的过程构成感觉将输入的图像声这一信息处理的过程就是认知认知所涉及到的能力主要包括视觉搜（lh.（detection辨（discrimintion、识（gn（identifiction和记忆搜（memoryh）这几点，这其实也正是视觉思维的主要任务过程，即视觉思维是对视觉活动所接收到的信息进行再加工的过程：首先，色彩等视觉信息被探测并输入到心理世界目标信息通过一系列的视觉查询机制被视觉注意所接收视觉注意对目标信息对象进行有效筛选并决定所1筛选的信息需要进入意识进行加工处理还是可以直接反应随后意识通过视觉处理对感兴趣的信息进行特征分析以及优先排序，对未知的信息进行学习和适应将有意义的信息输入记忆中作进一步加工；最终形成经验知识以供以后的高级理性抽象认知。2视觉思维的作用机制及其启发2.1视觉思维的作用机制（1）视觉查询视觉思维的本质是对注意力的分配它是由一系列与注意相关的动作组成的大脑触发快速的眼睛运动当我们需要关注所需信息时就会调整发现信息的路径将注意力集中于特定信息，（visuls觉思维首先就是从客观的视觉世界中通过构建视觉查询来寻找和载体进行视觉交互时通常是要确定想要解决的问题然后通过对特定信息的一系列搜索，即通过视觉查询来获得答案。（2）视觉处理视觉处理首先是通过位置通道对视野中所见信息的每一部分同时进行特征分析既要从这些特征中提取有意义的部分又要考虑它们的顺序对特征的视觉处理和分析可以帮助我们了解形式等方面都是早期阶段的特征属性可以用于大脑指挥眼睛运动。接下来就是对图案的处理机制将视觉空间划分为具有轮廓的1一步的视觉处理是通过更为繁杂的内容通道，即物体的识别。（3）视觉工作记忆通过视觉感受到的外界信息中有90%以上已存在于我们的脑海中识别物体会激活认知的动作模式以便执行接下来的操作。可见，看到某个物体会令大脑倾向于特定的思维行动模式，从而引起进一步的行为这种对大脑中视觉对象的激活作用叫作“视觉工作记忆，根据视觉对象的不同，视觉工作记忆最多能够同时记录三件事物有的视觉对象从建立到保持只需要通过一次视觉注意，而对于某些对象则需要一次又一次视觉注意过程。通常留在视觉工作记忆中的对象能减小下一次视觉注意中的对象范围。2.2视觉思维作用机制对设计的启发视觉思维对设计的启发可以总结为以下几点：（1）设计要支持大脑的图案查找能力。因为人的大脑能够快速而灵活的发现视觉图案因此换为可视化的视觉设计。（2）好的设计能够优化认知过程。应该让图案和标志发挥各自的优势帮助用户有效地处理视觉查询在计算机用户界面的设计中，这一点尤为关键。（3）设计师应从认知经济学的角度出发，充分权衡学习新的工具或适应新的视觉呈现方式所带来的长远利益与所花费代1价之间的矛盾关系，选择最优化的设计方案。（4）在设计时应从多个层次考虑视觉注意力，优化认知线索。3基于视觉思维的用户界面设计方法从视觉思维的角度来研究用户界面设计要从两个方面出发：首先用户界面信息的准确传达能够使视觉思维更为快速清楚地对接收到的界面视觉信息做出相应的反应反之更多的认知任务被视觉思维快速处理将有助于认识主体对用户界面信息的深度理解，进而提高认识主体做出决策的效率。3.1构建界面信息层次为了使用户将视觉注意集中于真正想要了解的目标信息上，应对界面的内容和视觉进行简化和分层减少用户处理的信息量，提高用户在界面完成任务的效率在用户界面中多余的视觉元素会分散用户对于信息的认知注意阻碍用户的视线这可能会令用户不得不放弃对该界面的进一步操作因此在进行用户界面设计时一方面应将信息进行筛选和梳理构建信息的内容层另一方面在不影响用户界面整体易读性的前提下，尽量简化视觉设计。（1）筛选原始数据信息量在进行用户界面设计时应当充分考虑界面的使用环境了任务目标这几个问题出发把握用户在界面中想要做的是什么筛1选最具有代表性的内容呈现于用户界面幸免过多信息对用户的干扰，并同意有需求的用户能够进行更深层次信息的研究。（2）确定界面内容的主次关系在对信息进行筛选过后应该根据用户的需求首先按照信息的不同情况明确信息的主次关系将用户界面内容分为主要界面结构中根据主次关系设置一级界面二级界面三级界面在界面版面中设置主标题、次标题、小标题等，并排列相关内容。（3）创建界面视觉的层次结构视觉的注意和选择是有重点的因此通过将信息的呈现方式结构化和精炼，能够幸免重复的视觉“噪音，提高用户接受信息的效率。首先应给予用户界面内容合理的视觉分层在界面布局上，应划分不同类别不同层级内容所在的位置每一层的用户界面只用于呈现一层的内容关系并合理优化承载信息的用户界面排版和位置布局在进行界面视觉设计上应至少设置两层视觉层应向用户展示整体的内容第二层级的内容主要是针对用户在第一层所选项进行详细解释和细节展示其次在视觉设计上强化不同层次内容的对比用户界面中的视觉主体与其他不需要被关注的次要元素之间的对比界限的清楚程度能够影响主要内容在用户界面中的识别度和用户在人机交互过程中的视觉疲劳度因此在保持用户界面功能和内容的前提下，1尽可能地强化主次内容之间的对比。（4）给予信息准确的视觉转化介于某些抽象信息不易被理解在进行用户界面设计时给予信息适当的视觉转化与概念转换能够更加准确地传达信息内涵因此在用户界面设计时要利用适合的视觉元素来对信息进行形象地体现和准确地释义用户界面视觉元素的设计应与所代表的信息含义具有一定的象征意义联系例如可以采纳简化图形的方式，经过一定的形状提炼与重组设计具有代表性的图标。图3.1中SPLumir的图标设计，就是将简单几何图形组合成为具有代表性的，象征不同类型图表的视觉符号。3.2强化界面色彩搭配在用户界面中色彩通常是一个先声夺人的要素它对于界面视觉表现有着重要的作用色彩不仅可以有效地区别不同的类别及内容增强用户对界面信息的记忆还能够直观地表现用户界面带来的情感属性和营造的氛围其传达效果甚至超越了文字和图形。（1）明确色彩的象征在用户界面设计中色彩的象征性具有重要的作用色彩在不同用户界面环境具有不同的含义红色表示注意和警告等含义；绿色代表安全健康等含而在用户界面中则更多地作为背景色来突出其他鲜亮色彩。如图12展示的“MyBnk”这款P，运用的是黑色和深灰色背景，对高饱和度的文字和数据图起到了烘托的作用同时使用户的视觉注意集中到了信息主体。（2）增强形色的对比在进行用户界面信息可视化的色彩搭配时应注意图形和颜色之间的对应关系在颜色设计时若为了区分尺寸较小的视觉例如在浅色背景上的深色图形以及黑色背景上的浅色图形等以此增加用户界面信息的识别度。（3）协调色彩的搭配在用户界面设计中协调的色彩组合关系能够加强用户界面内容之间的分类和联系虽然强化不同元素之间的色彩对比能够便于用户对它们进行区分但过于强烈的对抗色会对用户的视觉造成刺激容易产生令人难受的闪烁感从而影响用户视觉在界面上的停留与注意为达到色彩搭配的美观舒适可在用户界面前景元素的色彩中运用纯度较高的色系而背景则采纳纯度较低的冷色或者深灰色、黑色，如图3.3。3.3合理运用视觉修辞所谓视觉修辞就是一种以图像图形语言等综合符号为媒介以取得最佳的视觉效果为目的的传播行为在用户界面信息可视化设计中，隐喻和反复是最为常用的视觉修辞手法。（1）符号隐喻1符号隐喻是用户界面视觉元素设计的重要方法之一计算机的命令都是通过数学公式的运算执行的而用户无法直接与这些数学计算公式进行沟通因此便需要通过形象化的视觉符号表示计算机的功能和操作信息。在计算机操作系统的进展历程中，Windows首先通过运用符号隐喻的方法设计图标，实现了用户与信息交流在对用户界面图标进行设计时首先应提炼图标要表征的主要含义寻找与之具有联系的具象图形通过对图形特征进行提炼和重组，最终形成能够明确释义的视觉隐喻符号。（2）视觉反复视觉反复修辞的方法是通过一个被人们所熟知的视觉符号作为参考依据进行解构和同构而衍生出代表其它信息的视觉符号在视觉思维过程中对视觉多次刺激形成的长期记忆会产生思维定势当用户再次感知相似的视觉元素时就会调用之前所保留的类似信息，从而准确地识别当前的视觉符号含义。因此，在设计用户界面的图形语言时应尊重认知经验对于已有的元素进行反复使用，能够使用户轻松识别，降低用户的认知成本。3.4提高使用流畅程度提高用户使用流畅度是提升界面易用度的核心之一能够为用户带来良好的认知与体验从而吸引用户不断深入使用界面功能。（1）合理规划视觉化流程人在用户界面中的视觉流程存在一定的规律性对某些区域1的关注较多并在观看用户界面时存在一定方向性在进行用户界面的内容布局设计时应按照一般用户的视觉流进行合理分配，一般来说用户界面的左侧中上部为视觉热点位置将重要内容的简介或可供选择的部分置于此处能够有效引导用户的视觉注意。（2）提高反馈效应灵敏度在人机交互的过程中对用户操作结果进行快速呈现并及时给予反馈能够缩短用户的等待时间提升用户与界面之间的互动感受认知心理学的研究表明当界面的响应出现停顿或延误的交互质量因此在不影响内容的情况下可适当降低呈现品质，例如适度缩小图形的尺寸从而加快界面加载信息的速度和反馈的灵敏度。（3）提供人性化操作帮助拖拽点击等多样的交互操作方式这对某些用户来说是陌生的为了帮助用户快速享受互动的乐趣应在用户界面中以图文、实例演示等方式提供相应的提示和指