3版面设计的视觉流程

单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,第二章、版面设计的视觉流程,在,视,视,觉,觉,心,心,理,理,学,学,家,家,的,的,研,研,究,究,中,中,，,，,视,视,觉,觉,运,运,动,动,规,规,律,律,是,是,其,其,成,成,果,果,之,之,一,一,。,。,一,条,条,垂,垂,直,直,线,线,在,在,页,页,面,面,上,上,，,，,会,会,引,引,导,导,视,视,线,线,作,作,上,上,下,下,的,的,视,视,觉,觉,流,流,动,动,；,；,水,平,平,线,线,会,会,引,引,导,导,视,视,线,线,向,向,左,左,右,右,的,的,视,视,觉,觉,流,流,动,动,；,；,斜,线,线,比,比,垂,垂,直,直,线,线,、,、,水,水,平,平,线,线,有,有,更,更,强,强,的,的,视,视,觉,觉,诉,诉,求,求,力,力,；,；,矩,形,形,的,的,视,视,线,线,流,流,动,动,是,是,向,向,四,四,方,方,发,发,射,射,的,的,；,；,圆,形,形,的,的,视,视,线,线,流,流,动,动,是,是,辐,辐,射,射,状,状,的,的,；,；,三,角,角,形,形,则,则,随,随,着,着,顶,顶,角,角,之,之,方,方,向,向,使,使,视,视,线,线,产,产,生,生,流,流,动,动,；,；,各种图,形,形从大,到,到小渐,层,层排列,时,时，视,线,线会强,烈,烈地按,照,照排列,方,方向流,动,动。,视觉流,程,程，是,视,视线在,观,观赏物,上,上的移,动,动过程,，,，是二,维,维或三,维,维空间,中,中的运,动,动。,这种视,觉,觉的流,动,动线极,为,为重要,，,，同时,又,又是很,容,容易被,设,设计者,忽,忽视的,因,因素。,版面设,计,计的视,觉,觉流程,是,是一种,“,“空间,的,的运动,”,”，是,视,视线随,各,各元素,在,在空间,沿,沿一定,轨,轨迹运,动,动的过,程,程。,这,这种,视,视觉在,空,空间的,流,流动线,为,为“虚,线,线”，,正,正因为,它,它虚，,所,所以设,计,计时容,易,易被忽,略,略。,经验丰,富,富的设,计,计者都,对,对此非,常,常重视,，,，他们,善,善于运,用,用这条,贯,贯穿页,面,面的主,线,线，设,计,计易于,浏,浏览的,页,页面。,从,从,某,某个角,度,度讲，,视,视觉流,程,程的设,计,计结果,就,就是版,式,式。,人们是,怎,怎样看,图,图片的,？,？,研究者,们,们发现,，,，我们,眼,眼睛浏,览,览图片,时,时不是,处,处在一,种,种连续,不,不断的,扫,扫视之,中,中，而,是,是有一,系,系列短,暂,暂的停,顿,顿和跳,跃,跃。这,种,种间断,不,不完全,是,是任意,的,的。记,住,住这一,点,点，我,们,们应注,意,意下列,一,一些情,况,况。,观看,这,这张,图,图的,时,时候,，,，你,先,先看,到,到了,什,什么,，,，后,看,看到,了,了什,么,么,A,、眼,睛,睛有,一,一种,停,停留,在,在一,幅,幅画,面,面左,上,上角,的,的倾,向,向。,B,、眼,睛,睛总,是,是顺,时,时针,看,看一,张,张图,片,片。,C,、眼,睛,睛总,是,是首,先,先看,图,图片,上,上的,人,人，,然,然后,是,是注,意,意诸,如,如云,彩,彩、,汽,汽车,等,等移,动,动的,物,物体,，,，最,后,后才,注,注意,到,到固,定,定的,物,物体,。,。,既然,我,我们,都,都有,一,一种,从,从左,到,到右,、,、从,上,上到,下,下观,察,察物,体,体的,习,习惯,，,，毫,无,无疑,问,问，,追寻,这,这些,视,视觉,规,规律,构,构建,你,你的,画,画面,是,是最,好,好的,方,方式,。,。,一、,视,视线,流,流动,规,规律,1,、当,某,某一,视,视觉,信,信息,具,具有,较,较强,的,的刺,激,激度,时,时，,就,就容,易,易为,视,视觉,所,所感,知,知，,人,人的,视,视线,就,就会,移,移动,到,到这,里,里，,成,成为,有,有意,识,识注,意,意，,这,这是,视,视觉,流,流程,的,的第,一,一阶,段,段。,2,、当人们的,视,视觉对信息,产,产生注意后,，,，视觉信息,在,在形态和构,成,成上具有强,烈,烈的个性，,形,形成周围环,境,境的相异性,，,，因而能进,一,一步引起人,们,们的视觉兴,趣,趣，在物象,内,内按一定顺,序,序进行流动,，,，并接受其,信,信息。,3,、人们的视线总,是,是最先对准刺激,力,力强度最大之处,，,，然后按照视觉,物,物象各构成要素,刺,刺激度由强到弱,的,的流动，形成一,定,定的顺序。,4,、视线流动的顺,序,序，还要受到人,的,的生理及心理的,影,影响。由于眼睛,的,的水平运动比垂,直,直运动快，因而,在,在视察视觉物象,时,时，容易先注意,水,水平方向的物象,，,，然后才注意垂,直,直方向的物象。,人,人的眼睛对于画,面,面左上方的观察,力,力优于右上方，,对,对右下方的观察,力,力又优于左下方,，,，因而，一般广,告,告设计均把重要,的,的构成要素安排,在,在左上方或右下,方,方。,5,、由于人们的视,觉,觉运动是积极主,动,动的，具有很强,的,的自由选择性，,往,往往是选择所感,兴,兴趣的视觉物象,，,，而忽略其他要,素,素，从而造成视,觉,觉流程的不规划,性,性与不稳定性。,6,、组合在一起具,有,有相似性的因素,，,，具有引导视线,流,流动的作用，如,形,形状的相似，大,小,小的相似，色彩,的,的相似，位置的,相,相似等。,可以说视觉流程,运,运用的好坏，是,设,设计师设计技巧,是,是否成熟的表现,。,。,视觉流程可以从,理,理性与感性，方,向,向关系的流程与,散,散构关系的流程,来,来分析。,方向关系的流程,强,强调逻辑，注重,版,版面清晰地脉络,，,，似乎有一条主,线,线、一股气韵贯,穿,穿版面，使整个,版,版面的运动趋势,有,有“主体旋律”,，,，细节与主体犹,如,如树干和树枝一,样,样和谐。方向关,系,系流程较散构关,系,系流程更具有理,性,性色彩。,前五项流程均为,具,具有方向和理性,的,的流程。,二、视觉流程的,形,形式,1.,视觉流程的筹划,视觉流程是版式,设,设计的重要内容,，,，可以说，视觉,流,流程运用的好坏,，,，是设计者技巧,成,成熟与否的表现,。,。,视觉流程的筹划,包,包括几个重要的,因,因素，下面就对,它,它们作具体的归,纳,纳与分析。,2,视觉流程类型,视觉流程主要包,括,括以下几种类型,：,：,线型视觉流程,曲线视觉流程,焦点视觉流程,反复视觉流程,导向视觉流程,散点视觉流程,2.1,线型视觉流程,线型视觉流程，,分,分为直线视觉流,程,程和曲线视觉流,程,程两类。,1,、直线视觉流程,使页面的流动线,更,更为简明，直接,地,地诉求主题内容,，,，有简洁而强烈,的,的视觉效果。直,线,线视觉流程表现,为,为三种形式：,竖向视觉流程：,给,给人坚定、直观,的,的感觉。,明确、简洁的竖,向,向视觉流程,横向视觉流程：,有,有稳定、恬静之,感,感。,横向的视觉流程,，,，向人们传达出,稳,稳重、可信的视,觉,觉语言,斜向视觉流程：,以,以不稳定的动势,引,引起注意。,斜向视觉流程，,使,使页面产生动感,2.2,曲线视觉流程,曲线视觉流程，,是,是由视觉要素随,弧,弧线或回旋线运,动,动而形成的。它,不,不如直线视觉流,程,程直接简明，但,更,更具流畅的美感,。,。曲线视觉流程,的,的形式微妙而复,杂,杂，可概括为两,种,种形式：,弧线形（,C,形）视觉流程：,有,有扩张感和方向,感,感。,弧线形视觉流程,，,，使页面具有很,强,强的扩张性,回旋形（,S,形）视觉流程：,两,两个相反的弧线,则,则产生矛盾回旋,，,，在平面中增加,深,深度和动感。,2.3,重心的视觉流程,其重心的位置因,其,其具体画面而定,。,。在视觉流程上,，,，首先是从版面,重,重心开始，然后,顺,顺沿形象的方向,与,与力度的倾向来,发,发展视线的进程,。,。,2.4,反复视觉流程,反复视觉流程是,指,指网页中相同或,相,相似的视觉要素,，,，作规律、秩序,、,、节奏的逐次运,动,动。其产生的视,觉,觉效果更富于韵,律,律美和秩序美。,规则排列的小图,片,片具有秩序美,书本图,12,、,13,、,14,2.5,导向视觉流程,导向视觉流程，,是,是通过诱导性视,觉,觉元素，主动引,导,导读者视线向一,定,定方向作顺序运,动,动，按照由主及,次,次的顺序，把页,面,面各构成要素依,次,次串联起来，形,成,成一个有机整体,。,。导向视觉流程,的,的应用也很多见,，,，可以使网页重,点,点突出、条理清,晰,晰，发挥最大的,信,信息传达功能。,视,视觉导向元素有,多,多种，有虚有实,，,，表现多样。,1.,文字,导,导向,“请,按,按这,里,里”,、,、“,点,点击,进,进入,”,”等,文,文字,，,，是,通,通过,语,语义,的,的表,达,达产,生,生理,念,念上,的,的导,向,向作,用,用。,另,另外,，,，也,可,可以,对,对文,字,字进,行,行图,形,形化,处,处理,，,，对,浏,浏览,者,者产,生,生自,觉,觉的,视,视觉,导,导向,作,作用,。,。,2.,手势,导,导向,手势,导,导向,比,比文,字,字导,向,向更,容,容易,理,理解,，,，且,更,更具,有,有一,种,种亲,和,和力,。,。,用卡,通,通人,物,物作,手,手势,导,导向,3.,形象,导,导向,同手,势,势导,向,向一,样,样容,易,易理,解,解，,较,较常,采,采用,的,的形,象,象为,箭,箭头,。,。,形象,导,导向,，,，简,洁,洁明,确,确,4.,视线,导,导向,一组,人,人物,、,、动,物,物面,向,向同,一,一方,向,向，,会,会因,共,共同,的,的视,线,线而,一,一致,起,起来,。,。不,同,同的,物,物品,方,方向,一,一致,，,，也,可,可以,产,产生,统,统一,感,感。,如,如果,将,将页,面,面中,人,人物,的,的视,线,线对,着,着物,品,品，,就,就会,引,引导,浏,浏览,者,者的,视,视线,集,集中,到,到物,品,品上,。,。充,分,分利,用,用视,线,线导,向,向，,可,可以,使,使视,觉,觉元,素,素之,间,间的,联,联系,加,加强,，,，结,构,构更,加,加紧,凑,凑。,页面,中,中的,图,图像,将,将视,线,线引,向,向画,面,面以,外,外,2.6,散点,视,视觉,流,流程,散点,视,视觉,流,流程,，,，是,指,指在,分,分散,处,处理,视,视觉,元,元素,的,的编,排,排方,式,式。,它,它强,调,调感,性,性、,自,自由,性,性、,随,随机,性,性、,偶,偶合,性,性。,其视,觉,觉流,程,程为,：,：视,线,线随,各,各视,觉,觉元,素,素作,或,或上,或,或下,、,、或,左,左或,右,右的,自,自由,移,移动,。,。这,种,种视,觉,觉流,程,程不,如,如其,他,他视,觉,觉流,程,程,严谨,、,、快,捷,捷、,明,明朗,，,，但,生,生动,有,有趣,，,，给,人,人一,种,种轻,松,松随,意,意和,慢,慢节,奏,奏的,感,感受,。,。,自由,的,的视,觉,觉元,素,素组,合,合成,明,明确,的,的主,题,题,运用,散,散点,和,和曲,线,线所,形,形成,的,的柔,和,和的,视,视觉,主,主题,作为,个,个性,化,化的,视,视觉,元,元素,，,，拼,贴,贴剪,纸,纸式,的,的文,字,字分,别,别占,据,据了,三,三个,点,点，,吸,吸引,视,视线,在,在它,们,们之,间,间流,动,动,人们,阅,阅读,材,材料,时,时习,惯,惯按,照,照从,左,左到,右,右，,从,从上,到,到下,的,的顺,序,序进,行,行。,浏,浏览,者,者的,眼,眼睛,首,首先,看,看到,的,的是,页,页面,的,的左,上,上角,，,，然,后,后