网站建设中你注意到了版式设计视觉流程?
时间 :
2016-09-03,10:27:01
访问次数 :652
在网站建设制作过程中,网页的视觉流程设计是一个很好的很重要的设计部分,当人们在浏览网站界面的时候,视觉运动可以根据我们的设计成一定的方向和顺序去了解我们的网站。而一个好的视觉流程,对用户有一个很好的视觉引导。
那么什么叫视觉流程?
有心理学研究发现,人的视觉流动习惯,其实会在进行观察或阅读时,有一种自然的流动习惯,最为普遍的就是:由左到右,由上到下,由左上沿着弧线向右下方流动,在流动的过程中,这种流动线称做视觉动线。
这种视觉动线并不是绝对、不可改变,各个元素在设计师经过精心的编排下,能够很自然的引导用户的视觉注意力,就可以改变视线的流向,使其按照设计者的意图跟随各个元素版块之间而浏览,从而达到对用户进行视觉上的引导,重新设定视觉流程。
理想上的视觉流程,需要有方向性和顺序感,符合人们的心理顺序和逻辑顺序。在网页中,灵活而合理的运用视觉流程会提升用户在网站上的停留时间。
那么网页中的视觉流程是怎样的呢?
1.先整后细,先大后小,先看到大的物体再看到小的细节先看到文字“LET‘S TALK“然后才会注意到字里面的细节里面的细节
先看到图片里的人物再看到文字,如果文字的比重较大,我们就会先看到文字,然后才会看到图片
2.先强色后弱色,颜色鲜艳的比较容易吸引人的注意,比如红色我们首先注意到的会是红色的M,接下来才是灰色的B字,视线首先发现了由相对强烈的红色M,然后才会发现灰色B,这说明我们的大脑在接收眼睛传达信息时候,首先分析了由强烈颜色组成部分的信息,其次才是分析弱色所传递的信息。
4.先近后远,先实后虚,这就是为什么有些时候需要把背景虚化,目的就是突出前面所要展示的内容先看到近处的人物后看到远处的人物,近实远虚(学过素描的人都知道这一理论)
5.先动后静,我们视线的注意力会根据某些变化而进行转移刚进网站视线先跟随动态的,然后才看静态的,当网站某一元素运动变化时候(有些的还通过声音传递信息),我们的视线自然而然的就转移过去了。
视觉流程的设计1.不同的色彩给人的感觉给人的感觉耶不一样,对比强,纯度高,亮度高。强色比弱色更让人注意
第一眼看到的是不是红色?是不是感觉红色在前,而灰色在向后?(红色是前进色)这就是视觉心理造成的,不同的颜色会给人不同的感受,也就是暖色的、鲜艳的比冷色的、暗淡的颜色更能抓住用户的视线。
2.指示性的图形和图标
当一些的图形与符号被我们所学习、记忆、运用并赋予它特定的指向性意义时,也会对我们的视觉流程进行干扰与引导。例如箭头、手势等。
3.文字或特殊符号的引导
文字也是一种特殊的符号,但它并不是被赋予了指向性的意义来对我们的视觉进行引导,而是通过含义上或内容上的连贯性造成的引导,如数字1、2、3、4或者英文的a、b、c、d、年份等。
4.动态元素或声音进行引导
刚进网站就会被这个页面便会被这动态效果将视线吸引过去,随后就是一阵流行音乐的轰炸随着HTML5发展的越来越快,已经逐渐取代flash 。它的出现使得网页页面中的特殊效果愈发丰富
5.图片或文字暗示性/指示性的引导我们首先看到卡通头像/人物,其次我们会根据人物的视线方向看到文字及内容
网页页面设计中,图形和文字的应用关系到网页设计的成功。合理、出彩的图形能瞬间抓住人们的视线。暗示性引导是通过网页中图形元素对用户进行方向性的暗示,使用户的视线沿着图形所暗示的方向进行聚焦
6.情感化设计上进行引导
情感化不知识趣味这么简单,通过动效、文案、卡通形象、彩蛋等等元素进行情感化的引导,通过某元素或事件,唤起用户的情感共鸣,让用户去认同,从而加深用户对网页的归属感,强化对网页所传递的信息的记忆。人类的情感最为复杂,不同的人,不同的时期的情感都会产生很大的差异。认知心理学研究认为,人的大脑中已有的知识和知识结构对人的行为和当前的认识活动有决定作用。暗示的产生依赖于来自网页中的元素以及用户自身的信息。用户在观看网页的同时受到其中某些元素的暗示或者刺激,大脑开始搜索已有的经验知识与其进行对比,理解元素中的暗示性含义并对此产生反应,视线由此被干扰与引导。每个人头脑中的知识由于其所处环境都不会完全相同,所以暗示性的视觉引导在选择暗示性图像时要考虑到人与人之间的知识与文化差异,尽量选择简单明了,大众化的暗示性图像。
视觉流程在网页中的运用方法将视觉流程合理的用于设计,从选取视觉中心、吸引用户的注意力开始,到视觉流向的诱导,页面布局的规划,再到最后印象的留存为止,这就是网页视觉流程设计。运用方法1,思考网页大概框架 2.对网站页面布局的进行规划和调整 3,吸引用户的注意力,视觉上的诱导 4.成功传达信息给用户 5,用户对网站的印象存留
可以说把握好视觉流程,那么在网站建设中将会起到事半功倍的作用,视觉流程设计会为你的网站留住客户,更是提高转化率的一大利器。