第一篇:基于视觉搜索因素的网页设计论文
经典的视觉搜索模式是Sternberg于20世纪60年代提出来的,它从短时记忆信息提取方式的研究中得出信息提取匹配的两个假设:平行扫描(平行加工或平行搜索)和系列扫描(系列加工或系列搜索)。视觉搜索主要包含序列搜索和平行搜索两种模式。在所呈现的项目集合中,目标刺激和所有的项目同时进行比较,来找到目标刺激,是平行搜索;序列搜索则是把目标刺激和集合中的所有项目一一进行比较,直到找到目标,是系列搜索;Kristjansson和Tse(2001)对平行搜索和系列搜索分类是通过研究说明的,认为在一系列弯曲不连续的图形中搜索弯曲连续的图形,叫做系列搜索,反之则叫平行搜索;在一系列椭圆形中搜索圆形叫做系列搜索,反之则叫平行搜索。显而易见,平行搜索所消耗的认知资源比较少,被测试者反应也比较快,其效率要远远高于序列搜索。但是究竟被测试者或者个体选择或偏好哪种搜索模式,则取决于目标刺激物的特点。一般有规律且等级结构清晰的刺激物能吸引用户的平行搜索,在网页信息设计中,尽量使信息的呈现变得有规律,使结构更清晰,或通过给不同的信息添加某种视觉刺激,引起浏览者采用平行搜索的视觉模式来获取信息,提高视觉搜索的效率。
视觉搜索的特性及其影响因素
视觉搜索中,眼跳是其重要的组成部分,是反应视觉信息加工过程的外显行为。观察者获取外界信息的视觉行为一部分会通过眼跳和注视表现出来。视觉搜索过程中的眼跳,分为内源性眼跳和外源性眼跳。内源性眼跳是由个体机体主动发生的眼跳,比如按指导语要求进行的眼跳;外源性眼跳是由外部刺激引起的眼跳,比如由一个新的、奇特的刺激的出现所引起的眼跳。在视觉搜索中引起外源性注意的外部刺激是指刺激物的基本特征,包括颜色、亮度、动态、形状、大小、方向等。网页界面中的元素主要影响的是个体的外源性眼跳。视觉搜索的非对称性现象。若视觉搜索的非对称性是指在若干个甲类项目(干扰刺激)中找到一个乙类项目(目标刺激),与从同样的若干个乙类项目(干扰刺激)中找到一个甲类项目(目标刺激),两者的搜索速度不一样,且具有显著差异,出现非对称现象。而且,当甲乙两个项目交换干扰刺激和目标刺激的角色时,它们的反应速度还是存在显著性差异。基于刺激相似性和熟悉性的视觉搜索非对称性。Duncan和Humphyeys(1989)提出的刺激相似性理论认为,目标物和干扰物以及干扰物和干扰物之间的相似性决定目标搜索。
目标物与干扰物越相似,干扰物与干扰物越不相似,就越容易形成局部对比,进而使目标从干扰物中突显出来,引起人们的视觉注意和搜索。但是如果目标物和干扰物之间的差异足够大,例如用两种很醒目的颜色或者两种闪动的文字做刺激,那么两种刺激都会突显,非对称将消失。熟悉性很好理解,即阅读者对刺激材料的熟悉与否。熟悉性可以通过学习改变,与阅读者的经验和视觉模式有关,它和相似性一样是影响视觉搜索的一个因素。有学者认为目标刺激与干扰刺激之间的熟悉与否引起的搜索类型不同,材料之前越熟悉越会引起平行搜索,熟悉的项目激活度小,新颖的不熟悉的项目激活度大。当目标刺激和干扰刺激熟悉度相同,即同为熟悉或新颖,则激活度就没有差别。由此可知,熟悉性可作为影响视觉搜索的基本特征之一。视觉搜索的位置特征。视觉搜索的位置特征表现为,人在对静态物体的特征进行加工时,表现出了颜色加工和形状加工的分离,即视觉系统在对颜色和形状进行加工时,是独立的,不存在相互干扰,并表现出了位置的分离。有学者对眼动追踪技术进行研究发现,当刺激物呈现在边缘视野时,人们对颜色的搜索目标会有较多的眼跳,表示边缘视野的颜色加工的目标指向性比较好,而对于形状搜索时这种目的性则较差。由此说明,人们运用边缘视野能够对颜色特征属性的目标进行较好的加工,而对形状特征的加工则更多地依赖中央窝来完成。视觉刺激响应,是指人对刺激物的基本物理特征,如图片、动画以及颜色搭配等产生的带有一些较为稳定的具有倾向性的反应,它是影响用户视觉搜索效率的一个重要因素。就有效信息的搜索而言,有学者研究发现,动态图像对用户的信息搜索能力帮助不大;动态信息中的动画对用户的信息搜索能力还会有严重影响;有时用户会本能地忽略网站上的图片;动态图像会干扰用户对围绕在图像周围的文字的注意,不利于用户对含有大量信息的网页中其它信息的加工,也会导致用户对网页的信息加工和信息搜索的时间增加。
基于视觉搜索影响因素的网页设计
考虑到视觉搜索的特征及其影响因素,并在参阅了之前学者多视觉搜索与网页设计研究的基础上,得出以下的设计建议,旨在为网页的优化设计提供一些指导性意见。
(1)内源性眼跳由浏览者自身因素引起,是个体主动发起的,比如个体本身对某些信息感兴趣或者个体在指导语的提示下,主动进行的眼跳,它主要与返回抑制与眼运动记忆相关联。外源性眼跳则是主要与刺激物的基本特征有关,在研究者对引起眼跳的外源性刺激的研究中,从颜色特征到后来的方向、运动、大小、亮度、形状等目标特征,都会引起较大的眼跳,影响视觉搜索的效果。所有这些目标特征中,颜色特征的影响最大。国内有关研究还发现,在注视时间方面,注视时间由短到长依次是图画、中文词、英文词;在反应时方面,人的反应时从短到长依次为图画、英文词、中文词;在眼跳距离方面,眼跳距离从小到大依次是中文、英文、图画。有学者对分栏设计的视觉搜索效率的眼动研究发现,1大开本(1/16开本)设计材料在眼跳距离、行内与行间回视次数在阅读理解指标上均显著优于小开本(1/32开本)材料一栏、二栏、三栏设计材料,表现为一栏最优。在进行具体的网页设计时,如果设计的目的倾向于引起读者的注意,那么首选图片和动画,颜色可以选择鲜艳的能与周围信息区分开的;如果倾向于信息的获取或理解,应该首选文字,其次是图片或视频,最好不要选择过多的颜色,会增大眼跳,不利于信息的获取和理解。此外,和网页屏幕上呈现的网页材料相比,人们接触最多的文本材料更容易引起人的眼疲劳。因此,在有大量文本信息的网页设计中,为了减少被测试者的疲劳,可以采用大开本的一栏设计以方便浏览者的视觉搜索和理解。
(2)在网页设计中,重要信息和目标信息是需要引起用户较多关注的。基于相似性的规律,可以尽量减少重点信息和非重点信息;基于目标信息和干扰信息之间的相似性,可以增加重要信息或目标信息的新颖性、诱目性、独特性,且背景信息尽量简洁,减少干扰,以使重要信息和目标信息从背景信息群中“脱颖而出”,以此吸引浏览者的注意,提高他们的搜索效率;在文字与背景颜色选择上,最好设置为深色文字,浅色背景;在超链接颜色选择上,最好选用不同的颜色来区分已访问和未被访问的链接,这样有利于用户将两者区分开来进而搜索还没有浏览的超链接,而忽略已经访问的超链接。
(3)有学者研究发现,形状加工和颜色加工存在中央凹和边缘视野的分离。视觉的注意选择中存在这种空间位置效应,注意资源的分配也存在位置效应,当刺激呈现在中央凹视角时,被测试者对任务的反应时较刺激呈现边缘视角时的反应时变大。据此可以将文字信息置于网页中心位置,颜色图形等信息置于网页的边缘位置。
(4)视觉刺激效应告诉我们,旨在让用户从网站中搜索或获取信息(例如一些新闻类站),设计者应避免那些会引起强烈刺激的视觉呈现方式,或者过多的信息呈现也会影响用户的信息搜索能力。如果旨在让用户获得信息,最好不要添加一些动态图片、动态文字等动态效果强烈而很容易干扰用户注意力的信息元素,这会干扰用户对文字信息的搜索。
(5)文章通过眼动实验对于Web页面视觉信息搜索行为的研究发现,人们在网页上进行视觉信息搜索时,更多地注视周边区域,而对于中心区域的注视较少,呈现视觉搜索的周边特性。而且,在带有浮动广告的网页上进行视觉信息搜索时,同样呈现视觉搜索周边特性。实验结果表明,从视觉搜索角度来看,在网页布局时,对于具有超级链接性质的标题信息,放置在网页的周边区域比放置在网页中心区域更利于人们的视觉搜索行为。而且,在视觉信息搜索时,人们很少去看浮动广告,说明浮动广告的广告效应并不明显,应该改变其广告形式。
结语
笔者在前人研究的基础上,根据人的信息加工特点和视觉搜索规律,提出了网页设计的一些意见和建议,旨在通过科学的网页信息呈现来促进网页浏览者高效地获取网页中的有效信息,提高视觉搜索的效率。对于如何使人们高效获取信息的同时也保证视觉上的舒适性,则是需进一步研究的问题。
第二篇:视觉设计论文
创新是视觉设计的灵魂
视觉设计是针对眼睛官能的主观形式的表现手段和结果。与视觉传达设计的异同:视觉传达设计属于视觉设计的一部分,主要针对被传达对象即观众而有所表现,缺少对设计者自身视觉需求因素的诉求。随着人类社会从工业化社会到信息化社会的发展,视觉设计经历了商业美术、工艺美术、印刷美术设计、装潢设计、平面设计等几大阶段的演变,最终成为以视觉媒介为载体,利用视觉符号表现并传达信息的设计。
创新是设计本质的要求,也是时代的要求。作为“为传达而设计”的视觉设计,如何正确充分地传达信息是每一个设计者始终要面临的中心问题。但是,在当今社会,仅仅把传达信息的关键词定位于正确和充分显然是不够的。必须要把视觉传达设计的创新重视起来,从设计理念、视觉语言和技术表现方式的创新入手,正确充分地传达信息。
江泽民同志曾经说过,“创新是一个民族进步的灵魂,是一个国家兴旺发达的不竭动力”。创新表现在人类社会历史发展的每一个方面。就视觉设计来说,创新同样也是灵魂,是本质要求。不论是纵观历史,还是着眼现实,一幅优秀的视觉传达设计作品,都是在创新的基础上,对其所表现设计主题的信息进行正确、充分地传达。没有创新的视觉设计,就千篇一律、失去内涵、底蕴,甚至毫无价值。对于视觉设计而言,创新就要做到:创新设计理念、丰富设计语言、美化表现形式、增强感染力,坚持人性化发展方向。唯此,才能赋予视觉设计以内涵、活力乃至生命力,推动视觉设计繁荣发展。
一、创新视觉设计理念
视觉设计的创新的根本是创新设计理念。在现代设计中,视觉设计的主要功能是调动所有平面的因素,达到视觉传达准确的目的,同时给观众以视觉心理满足。视觉传达的方式变得越来越复杂和发达,设计师在视觉设计中,应充分考虑受众群体的视觉心理,清醒地认识到信息接受者不是机械的、被动的受纳器,而是一个具有积极主动的内驱力的主体,只有在充分理解和掌握有关视觉心理的知识之后,才能更好地在更大的范围内发挥各种现代制作技术的优势。其中,观者的视觉经验对视觉信息的准确传达起着重要的作用。设计者应根据观者的视觉经验充分调动观者视觉心理的能动反应,使其“所看”与“所知”同时发生感觉,从而积极主动地参与到设计作品的理解和感悟之中,让观者通过欣赏与设计者的审美体验相沟通,以此来达到信息传达的目的。
一是对过去设计经验和知识进行创新。视觉设计应以一种开放性思维探索新的经验,以一种全新的观念看待熟悉的事物,从而创造出独特的形式。简言之,就是对过去的设计经验和知识的创新。创新根据性质、程度的不同可以理解为继承传统式的创新和激进式的创新,后者发展到一定程度上甚至成为一种否定和反叛,尤其是对于长期以来自我潜意识所形成的一种固定思维框架的否定和反叛。用马克思主义哲学观来看,创新就是事物螺旋式上升的运动。在信息时代,人类生存方式上新观念的介入,在思维的引导和情感的表达上,以往贯穿于视觉传达设计中运用的法则正逐渐被打破,人类在跨越世纪的里程中力求找到合理化的视觉空间。个性化、多元化、民族化、国际化、绿色设计、人性化设计„„,怎样才是好的新的视觉设计?视觉设计怎样才能正确体现未来的价值观?面对新技术革命的浪潮的冲击,面对设计的平庸化、程式化,设计师不得不面对现实,让自己的设计理念和思维接受信息化时代的洗礼。设计师只有始终以明锐的目光、独特的角度、多重的层面去观察生活,更深层次地挖掘对生活的体验与理解,在不断肯定与否定的思索中碰撞出设计的火花,并执着地坚持对设计理念的探寻,才能不断地创造出优秀的设计作品。
二是注重视觉设计的冲击力。我们所看到的视觉设计作品都是将各种元素整合在一起的视觉设计作品,然而在实际的设计工作过程中,它却是一个很复杂的过程。在此过程中,设计者要将所有创意分成若干个小的创意单元,然后添入图形、文字、符号、色彩等元素来提高其视觉冲击性。随着人们对于视觉设计审美标准的不断提高,设计师在突出视觉冲击性的同时,还应保持广告整体内部的各个组成语素的相互联系。注重突出色彩、形状、姿态之间的细节差异,来体现组成与结构形式的视觉冲击性。比如:如今使用较为广泛的大型户外广告而言,设计师通常更注重突出其视觉冲击性来吸引消费者的注意力。由于该种户外广告的特殊性,通常还会采用效果显著的表现形式来增强其连续感。在此过程中,设计师会更注重对于文案、图形以及色彩的变化来增强广告的空间层次感,以给消费者一种耳目一新的视觉冲击感。
三是追求新颖、奇特的创意。在现实生活中,大部分视觉视觉设计作品都是以视觉美感为基础,然后通过对于各种元素的概括、夸张或取舍来得以实现的。这种形式的视觉语言虽然具有一定的功能美,但在后期不断的使用过程中,消费者已经对其司空见惯,甚至存在着习以为常、视而不见的现象,这也就使视觉设计发挥不出其应有的功能。但是,如果能够在视觉设计中注入一些新颖、标新立异的元素,如一些与自然规律相悖的元素,便能够更好地吸引人们的关注。这种巧妙地利用消费者的好奇心理,通过新颖、奇特的表现画面来带给消费者微妙感觉的视觉传达方式已经成为现阶段广告设计的发展趋势。由此可见,对于视觉设计的创新,新颖、奇特的创意设计已经成为关键环节。
二、丰富视觉设计语言
视觉设计创新的重要途径是不断丰富设计语言。语言是人类交流思想的工具,是传达意义的媒介。从某种意义上讲,视觉设计就是“图形语言化”和“语言化图形”的过程。为了达到信息传达的目标,设计师需要始终不渝地寻找、挖掘并创造出最佳的视觉语言,借以表现传达自我的设计理念和艺术主张。19世纪和20世纪的很多艺术和设计运动都是以探索视觉语言新形式为基本目标的,一种新的形式往往就是由反传统的艺术通过反对过往时代的艺术而创生的,“工艺美术运动”、“新艺术”、“现代主义”、“波普设计”和“后现代主义”等流派的设计运动在形式方面的试验与革命,以及为寻找并获得体现时代特征的形式和视觉语言而进行的探索都说明了这一点。丰富视觉设计语言要做到:
一是找寻时代视觉语言,突出时代特色。视觉设计的各种视觉语言,具有不同的诉求职能,它们相辅相成共同建立起美好的形色世界,即视觉传达设计关系到各设计语言之间的美学性构成。对于设计师来说,每一种视觉元素都是其表现自己设计作品的功能与风格的基本要素,在选择这些视觉元素来传达信息时,应该突破一般视觉所习惯的东西,力求以简约化、符号化的形式表现最丰富、最深刻的内容。设计师要把握时代的脉搏,突出时代特色。经济在不断的飞速发展,设计要适应新环境,就必须丰富设计语言,找出设计语言的最新、最佳、最优设计方法来解决设计中的不断涌现出的问题,满足人们的物质需求和精神需求—审美、道德、文化、价值等等。因此,探索发现时代的经济、文化、观念的特征,找寻时代的视觉语言,突出时代特色必然成为新时期“好的设计”的着力点,所以要求设计师通过新颖独特的视觉语言和极具创意和内涵的构图秩序传达预想的意义。
二是开发和利用高科技的。视觉设计对于高科技的运用主要表现在对于新型材料和高科技技术产品的运用,同时在很大程度上也提高了视觉传达的科技水准。如对于全自动化操作的电脑彩色喷绘技术的利用,在增加广告视觉传达表现空间的同时,也使广告所突出的表现元素更为贴切、感人。同时,相关软件的开发和利用也有效提高了关高视觉传达的效果,设计师可以借此设计出图形准确、效果好的二维、三维作品。人类的每一次科技进步势必会给社会各个行业带来巨大的变革。数字化多媒体技术在视觉设计中的应用,也必然会给设计师带来更大的创作自由度与空间,从而使视觉设计作品重现出良好的艺术效果与视觉感染力,这也使视觉传达超出了其应有的范畴,从而迈向更为广阔的领域。因此,视觉设计也发生了由原来的静态化、平面化和单一化逐渐向动态、立体化方向发展的转变。同时,新思维、新技术以及新媒体的应用也为视觉传达提供了更为广阔的空间,借此设计师可以随心所欲地借用艺术视觉语言来反应现实。毋庸置疑,对于高科技技术的开发应用也已经成为丰富视觉设计语言,推动视觉设计创新的重要手段。
三、美化视觉设计表现形式
视觉设计的魅力在于视觉设计表现形式的美化,视觉设计与美学的有机融合。艺术品最终的功能在于重现美感经验,而设计除了捕捉美感,更注重实用与使用的功能。所以设计活动与设计作品,通常比起艺术品更加与生活密切结合,这也是设计中的美学愈显重要的根由。作为“为传达而设计”的视觉设计,如何正确充分地传达信息并将美学融会于设计中,是每一个设计者始终要面临的中心问题。
视觉设计表现形式的美化即视觉设计必须遵循美学的原则,还要坚持创新。第一,是提升美的感受能力以及由此所开拓的技术。第二,事、物、情的感受能力以及由此所开拓的技术。第三,美感与诗意的结合能力及由此所开拓的技术。设计要捕捉美感,特别是视觉设计。视觉传达设计擅以文字、符号、造形来捕捉美感,捕捉表达意象、意念与企图,进而达到沟通与说服的效果,因此视觉传达设计也可称为商业设计,这层领域还包括:广告设计、包装设计、企业识别设计、橱窗设计、展示设计、舞台设计等等,主要以传达讯息、注重“视觉”效果,以达说服消费者的目的。另一方面,视觉传达设计的发展对空间设计、产品设计有相当程度的影响。如舞台、景观设计与之相辅相成,以及同产品语意表达的敏感性等等。视觉设计过程中,除了对造型美的感受能力之外,如何从日常生活事件中,找出“着力点”,这种能力就是心眼的开发。视觉传达设计作品受到设计的目的性、材料性、沟通性的条件影响,设计者必须具有一种对于事务描述及沟通的能力,称为“心眼”,也就是巧思、想点子的能力。这些能力包括了:文学性、沟通性、两面性、生活性、议题性、语文性等。公益广告、竞选海报、立体包装等运用媒体电视、网际网站等的设计作品之共同因素,第一就是运用视觉媒体材料,第二就是以沟通、说服为目的。所以可以说,视觉传达设计是运用视觉因素来进行沟通、说服,视觉的要素,除了点线面体以及明度、彩度、色相的组合与探讨之外,还须有心理层面与文化知识层面的探讨。心理层面,即是指美感的捕捉,只是不同时期的定义不同而已。文化层面,需要运用受众的文化习俗里熟悉的文化代码来完成美感的捕捉,以实现视觉设计表现形式的美化。
四、增强视觉设计感染力
视觉设计的生命力在于视觉设计作品与受众的共鸣,得到受众的认可。视觉设计元素是否能引起观者视觉经验的共鸣,取决于刺激物的结构所拥有的力量与它唤起的有关记忆痕迹的力量相互作用的结果。因而,将视觉设计的视觉表现置于特定文化背景中来感染受众的精神世界的确是一个不错的选择。视觉设计在体现民族化、地域化的同时,还应利用传统的、地域的图形语言优势来表现现代的精神观念,用解构的民族化图形与现代设计思想相结合,创造一种既有传统文化元素又具现代意识的形象,以独特的个性参与世界文化的发展。中国人有对万物祈福的心理,并由此形成了特有的吉祥文化,希望事物朝着美好的方向发展,标志设计中有吉祥的寓意就容易被受众接受。例如:中国联通公司的标志设计,就是针对人们吉祥如意的心理期待,标志中的“中国红”是蕴含着中国人几千年情结的颜色,无形中又增加了企业形象的亲和力,进一步拉近了与观者的距离。香港著名设计师靳埭强的作品就具有浓厚的东方文化色彩。在作品中我们时时发现设计家对简约空灵的水墨语言精妙的阐释,还不时可见中国传统文人智慧与现代商业文明的和谐对话。如果一幅画、一个图形、一种抽象的形式可以唤起观赏者丰富的审美感受,那是视觉“调动”了观者兴趣,产生了共鸣。
因此,创新视觉设计,增强视觉设计的感染力、生命力,设计者必须感同身受,与观赏者所处的环境条件相适应,以观者的共有经验为根据,充分考虑到观赏者视觉心理的能动反应,与观赏者一道,把与传达信息有关的知、情、意等心理联系起来并统一到“一种经验”中,从而形成互动。
五、把握视觉设计人性化的发展方向
一是视觉设计要坚持面向大众化。随着社会市场经济体制由卖方市场逐渐向买方市场的转变,对于视觉设计,尤其是对于广告视觉传达的设计,越来越注重满足更多消费者的消费需求。因消费者的心理观念、消费观念等都会随着社会进程和外界环境的变化而发生变化,因此,在进行视觉设计时,应把握住影响消费者观念发生变化的因素,并借此来提高消费者对于广告视觉传达信息的认知程度。因此,对于广告视觉传达的设计应站在消费者的角度,以其消费心理为出发点,在充分把握消费者消费心理的情况下,积极为他们塑造出良好的视觉传达效果。值得一提的是,为使视觉设计满足社会不同群体消费者的消费需求,在对广告视觉传达方式选择时,应从不同人群的视角出发,以便于他们对于广告信息的接收和转化,从而使更多的消费者得到心理上的满足。
二是视觉设计要更加注重符号化、简洁化。在快节奏的现代化信息社会中,人们时时刻刻都面临着林林总总的视觉设计信息。因长期处于这样一种频繁的信息覆盖氛围中,人们已经疲倦了对于广告信息深层含义的挖掘,唯独等够感觉得到的是来自于感官上的短暂刺激。因此,在今后的视觉设计中,应充分发挥自己的想象力,采用简洁化的传达方式来准确完成信息的视觉传达。最好的办法是加强对于简洁文字、图形符号信息的利用来完善信息的视觉传达,并借助对于简洁图文符号的构建来引发人们对于信息的深入思考。这种简明的视觉传达方式能够有效刺激人们的视觉感官,同时也满足了当前社会环境下对于视觉传播形式的要求。这种将组成语素进行简化的视觉传达方式,能够将相对复杂的物理价值概念转化为简单的视觉符号元素,以实现消费者视觉感官与理性消费观念的有效结合,从而真正达到高效视觉传达的目的。
进入新世纪、新时代,技术正在重新构造我们的现实,它已经成为一种强大力量,在很大程度上控制和决定了社会、经济、文化及其未来的发展。计算机技术、网络信息技术、多媒体技术使人们直接面临“数字化生存”,与此同时,它们也冲击着传统的传达方式,视觉设计正在经历着一场数字化的革命。而这些先进的技术、先进的探索设备、先进的研究方法和手段,也为设计师观察事物的角度和思维方式提供了不断延伸和扩展的机会。因此,只有主动地迎接信息时代的洗礼,从设计理念、设计语言、表现形式、增强感染力等方面入手,牢牢把握人性化发展方向,才能推动视觉设计在创新中发展,在发展中创新。
参考文献:
[1]门德来.现代图形设计创意与表现[M].西安: 西安交通大学出版社,2002.
[2]李砚祖,芦影.视觉传达设计的历史与美学[M].北京:中国人民大学出版社,2000. [3]尹定邦.设计概论[M].长沙:湖南科学技术出版社,2003.(end)[4]熊琴琴.视觉传达设计艺术 [J].艺术百家,2005(3).
[5]李砚祖,芦影.视觉传达设计的历史与美学[M].北京:中国人民大学出版社,2000. [6]尹定邦.设计概论[M].长沙:湖南科学技术出版社,2003. [7]王爱之.世界平面设计史[M].中国青年出版社,2002.9 [8]何爽.网络多媒体技术与视觉传达设计[J].大众科学(科学研究与实践),2007(7). [9]余义虎.视觉传达设计多元特征与表现[J].甘肃联合大学学报(社会科学版)[10]曹方.视觉传达设计原理[M].江苏美术出版社,2005.1 [11]朱胜甲.浅析现代广告的视觉传达特点[J].科技信息,2009,(10):223.
第三篇:网页设计论文
网页设计基础课程论文
摘要:随着互联网的不断发展和中国网络人口的日益增长,建立个人网站,不但可以更好的展示自己,而且可以提高自己在计算机应用方面的能力,网站越发普及,网站建设也有新的要求,网站已发展为一种工具,一个企业对外信息展示的工具.以前网站上常见的大幅图片,长达几十钟的flash动画,已悄然而逝,浏览者再也不用为了查找一些信息而必须等待动画的时间,可以简单方便的找到自己想要的东西,是浏览者主要的目的,也是网站设计时应该考虑的问题。以前只是一味的追求网站的外观,其实网站是一个公司的对外信息窗口,因此在考虑美观的同时也得考虑浏览者的感受,如有些色调是很亮丽,但是这些过于亮的色彩看的时间长了会让你的眼睛不舒服,这样浏览的人就不会长时间在网站上逗留,网站没把公司的信息完全的传达给客户. 关键词:网站网页设计发展趋势网站标准 正文:一:网页设计发展趋势: 1.更多的CSS3 + HTML5 这是期待已久的事情。在过去的几年设计师已经开始关注和使用CSS3+HTML5,但在以后CSS3+HTML5将会得到更广泛的应用。网页设计师最终会抛弃Flash。Flash不再是昔日的王者,新技术(指CSS3+HTML5)将会取而代之 2简单的配色方案
没有比纯色的背景更直观更简洁。纯色可以有很多种表达方式。不要老是黑白灰神马的,太不给力了。多点考虑绿、黄或者红作为你的网页主色调。当然,颜色最好保持使用2到3种。调整颜色的透明度,或许会给你意想不到的效果 3.移动互联网时代的到来
智能手机,ipad和上网本随处可见,将来这个将会更加明显。这意味着你的设计需要考虑更多的设备。4.Parallax Scrolling 先来解释下Parallax Scrolling,Parallax scrolling 是让多层背景以不同的速度移动,形成运动视差 3D 效果,虽然纯属视觉效果,但在内容滚动时形成的视觉体验仍然非常出色。2011年的网页设计趋势热点就是要创造这样的深度视觉效果。5.设计需考虑更多的触屏设备
触屏技术应用越来越广泛,触屏设备随处可见。这意味着,你的导航设计不再只是鼠标导航,你必须要要考虑你的设计适合触屏设备。6.深度判析
深度判析是关于在网页设计使用维数,这样可以使你的网页变得更加真实。如果运用得恰当,那将会是一个虚拟的3D效果,就像3D电影阿凡达那样。尽管3D技术还没有去到网站设计,你仍然尝试使用维数进行设计。7.大背景图
大背景图的网页设计应用在2011年将会更加明显。这些背景图像一般是高分辨率,覆盖这个网站。高清照片是一个迅速抓住你的读者的好方式,可以产生极具冲击力的视觉效果-游客的视线会不自觉地落在宽大的背景上。8.不拘谨于顶级域名
严格意义上这一点与网页设计无关,但这一点也是发展的趋势,将出现更多创造性的域名。.com域名的吸引力越来越少,主要是你很难再找到一个比较短的.com域名。2011年人们开始将视线慢慢转移到.me、.co和.cc等身上。想想域名的发展,抢先一步,不然你很可能再次错失先机。9.QR: Quick Response 如果你注意现在越来越多的名片、杂志或者其他地方出现方形条形码,证明你已经看到2011年的这个趋势热门
10.缩略图设计(Thumbnail Design)
Google已经向浏览用户推出它们的浏览预览技术。过去我们只能通过点击链接才能看到网页的内容,现在你只需点击放大镜然后将鼠标悬停在链接上就可以预览该链接的网页内容。11.持续联系/ Life Stream Lifestreaming, 一种在线记录个人日常活动的网络应用,包括直接通过视频feed或通过聚焦一个人的网络在线内容,比如博客日志,在社会性网络上面的更新,在线相册,聊天内容甚至只是一些喜欢的网站的链接等等.二:网站标准是在W3C(W3C.org)的组织下,商业公司(Netscape、Microsoft等)也认识到统一标准的好处。网站标准开始被建立(1998年2月10日发布XML1.0为标志),并在网站标准组织(webstandards.org)的督促下推广执行。
为什么要建立网站标准: 我们大部分人都有深刻体验,每当主流浏览器版本的升级,我们刚建立的网站就可能变得过时,我们就需要升级或者重新建造一遍网站。例如1996-1999年典型的“浏览器大战”,为了兼容Netscape和IE,网站不得不为这两种浏览器写不同的代码。同样的,每当新的网络技术和交互设备的出现,我们也需要制作一个新版本来支持这种新技术或新设备,例如支持手机上网的WAP技术。类似的问题举不胜举:网站代码臃肿、繁杂浪费了我们大量的带宽;针对某种浏览器的DHTML特效,屏蔽了部分潜在的客户;不易用的代码,残障人士无法浏览网站等等。这是一种恶性循环,是一种巨大的浪费。如何解决这些问题呢?有识之士早已开始思考,需要建立一种普遍认同的标准来结束这种无序和混乱。商业公司(Netscape、Microsoft等)也终于认识到统一标准的好处,因此在W3C(W3C.org)的组织下,网站标准开始被建立(1998年2月10日发布XML1.0为标志),并在网站标准组织(webstandards.org)的督促下推广执行。
采用网站标准的好处:
对网站浏览者的好处:
1、文件下载与页面显示速度更快
2、内容能被更多的用户所访问(包括失明、视弱、色盲等残障人士);
3、内容能被更广泛的设备所访问(包括屏幕阅读机、手持设备、搜索机器人、打印机、电冰箱等);
4、用户能够通过样式选择定制自己的表现界面;
5、所有页面都能提供适于打印的版本。对网站所有者的好处:
1、更少的代码和组件,容易维护;
2、带宽要求降低(代码更简洁),成本降低。举个例子:当ESPN.com使用CSS改版后,每天节约超过两兆字节(terabytes)的带宽;
3、更容易被搜寻引擎搜索到;
4、改版方便,不需要变动页面内容;
5、提供打印版本而不需要复制内容;
6、提高网站易用性。在美国,有严格的法律条款(Section 508)来约束政府网站必须达到一定的易用性,其他国家也有类似的要求。
参考文献: 一:温谦.HTML+CSS网页设计与布局从入门到精通[M].北京:人民邮电出版社,2010.3 二:http://www.xiexiebang.com
三:http://btgyjlbjx.nease.net(北极星网站域名)
课程论文
系院:土木工程学院
专业:建筑工程 姓名:王奎
学号:105140340043 网页设计基础
第四篇:商业网页设计论文
摘要:商业网页设计中具体的字体、图形、图象、标志等等,常常表现为点线面、色彩、动静、主次等视觉因素,这些因素的不同使用都会影响读者的视觉习惯和心理变化。本文将分析商业网页设计视觉因素的心理规律,揭示网页设计如何通过视觉因素更有效、更合理的表现与传达信息。
关键词: 网页设计 视觉心理因素 构成要素 视觉流程
商业网站是企业向用户和网民提供产品和服务的一种方式,是企业开展电子商务的基础设施和信息平台,其网页页面由具体的文字(标题、广告语、单位名称、Email地址等)、企业标志、商标、产品图形、和信息菜单等内容组成,这些内容又常常表现为点线面、色彩、动静、主次等视觉因素,这些因素的不同使用都会影响读者的视觉习惯和心理变化。
本文将试析商业网页设计视觉因素的心理规律,揭示商业网页设计如何通过视觉心理因素更有效、更合理的表现与传达信息。展现企业形象、介绍产品和服务、体现企业发展战略。
一、商业网页设计中点、线、面视觉心理因素的运用
点、线、面是商业网页设计基本的视觉元素,是表现视觉形象的基本设计语言。从视觉角度看网页设计主要是如何经营好三者的关系,因为不管是任何视觉形象或者版式构成,归结到底,都可以归纳为点、线和面。
1.网页设计造型要素中的点
商业网页设计中的点是构成网页的最基本单位,是指页面中具备点的视觉特点、体积较小的物象。相对于整体背景而言一个单独的点是相比较而言的;是有大小、形状和体积的。点的大小、形态、位置不同,所产生的视觉效果、心理作用也不同。一个网页往往需要有数量不等,形状各异的点来构成,可以是具体产品、商品标志等,也可以是感觉上的点。例如,天空中的飞鸟、沙滩上的脚印、花瓣上的蜜蜂等,在其周围背景衬托下,都给人以“点”的视觉心理感受。
点在设计中即可以起一种稳定造型的作用,亦可起到活泼生动、吸引视觉中心的作用,使用得当,甚至可以画龙点睛;点的形状、方向、大小、位置、聚集与发散,还能够给人带来不同的心理感受。
(1)单点的应用:点在人们的视觉中具有很强的吸引作用,如:点(商品)设计在网页的上方或左右位置,则给人不稳定感和相对的动感。
(2)多点的应用:两点(二商品)之间会产生心理连线的感觉,多点时则会出现不同排列,顺序的虚拟的面或形体。
2.网页设计造型要素中的线
点的延伸形成线。线在页面中的作用在于表示方向、位置、长短、宽度、形状、质量和情绪。线是分割页面的主要元素之一,是决定页面现象的基本要素。商业网页设计视觉因素中的线主要指文字的行线,商品图形、图象的轮廊线,各种装饰线。线的形态主要有直线和曲线两大类:
(1)直线给人一种紧张、锐利、简洁、刚直感,从心理或生理感觉来看具有男性特点。直线又有:细直线,给人纤细、敏锐的心理感觉;粗直线,给人豪爽、拙朴、厚重的感觉;垂直线,给人一种挺拔、庄严感;水平直线则给人方向感和强烈的动感。
(2)曲线表现出一种动态,活泼,轻快的意味,显示了女性美的特征,商业网页设计中运用文字行、图象轮廊线或装饰线的造型,创造一种女性化的审美感。自由曲线是最好的情感抒发手段。打破了水平线组成的庄严和单调,给商业网页增加了丰富、流畅、活泼的气氛。水平线和自由曲线的组合运用,形成新颖的形式和不同情感的对比。
3.网页设计造型要素中的面
线的推移形成面。面是无数点和线的组合。面具有一定的面积和质量,占据空间的位置更多,因而相比点和线来说视觉冲击力更大更强烈。面在网页设计中通常指各种图形、色块的形状设计,不同形状的面具有自己鲜明的个性和情感特征,能给人不同的心理感受,如方形的面具有沉着,稳重,厚实,坚强的男性特征;三角形、梯形面常给人一种稳定、端正之感;但如果将它们倒过来设计,则给人一种轻、不稳定的感觉。圆形充实、圆满、活泼的感觉,比较适合表现儿童产品或者女性用品。菱形或不规则形体则给人一种活泼、轻快之感。
在商业网页的视觉构成中,点、线、面既是最基本的造型元素,又是最重要的表现手段。在确定商业网页主体形象的位置、动态时,点线面将是需要最先考虑的因素。必须熟练掌握设计语言。要善于根据商业特性采用不同的组合去体现不同的情感诉求,达到推销、销售商品和服务的作用。只有合理的安排好点线面的互相关系,才能设计出具有最佳视觉效果的页面,充分的表达出商业网页最终的诉求!
二、商业网页设计中色彩视觉心理因素的运用
商业网页设计中色彩是确立网站风格的灵魂。色彩能产生强烈的视觉效果,使页面更加生动。色彩设计的好坏直接影响阅读者的观赏兴趣与心理变化。因此,地位十分重要。商业网页的色彩设计应从以下几个方面把握和利用其心理特征:
首先,整个页面要确定一个主色调,其有利于体现网站主题。每一种色彩都具有它自身的性格,如:彩度高,明度高的色彩常给人一种华丽感,相反彩度低,低明度的色彩则给人一种朴实感。暖色系、高明度的色彩能给人一种面积大的前进感。冷色系、低明度的色彩则能给人一种面积小的后退感。每个人群对色彩的喜好也有所不同,如男性较喜欢冷色,女性则偏好暖色或高明度、高彩度的色彩,儿童喜好纯色,讨厌浊色,老人则偏好浊色,中年人或文化层次较高的人偏好冷灰色等。因此在设计中要考虑主要读者群的背景和构成以及如何与商品的属性相呼应。
其次,在主色调下的色调搭配。若页面空间整体、色彩和谐统一,则给人一种幽雅、宁静感;若以对比手法处理,图形文字色彩明快突出于背景色,则页面空间氛围会显得活跃而有生气。但是,要注意不能有强烈的色彩对比,因为过于丰富的背景色彩会影响前景商品图片和文字的取色,使文字溶于背景中,不易辨识。所以背景一般应以单纯为宜。
最后,作为设计师在考虑网页设计时,还应考虑到时代流行性色和企业标准色的问题。所谓流行色,是指在一定范围内和时间内,非常盛行并易为人们接受的某些式样或颜色。而标准色的运用在网上扩大了品牌效应,也是对公司整体形象的统一应用,从而构成了企业识别系统(CIS)的重要部分。
三、商业网页设计中动、静的视觉心理因素的运用
商业网页设计构成要素可分为两种状态:静态与动态。静态要素设计具体指静止的商品图形、文字、按纽等;动态要素,具体指动态按纽、按纽连接、网页动画和视频等,它们是丰富、生动网页、张显个性、突出主题重要手段。
动静以及不同的动静组合都可以反映不同的心理与性格,如,动大体上给人活泼、生动的印象,但极慢的动常给人忧虑感;迅速或突然的动常给人焦虑、惊慌感。另外,静也常给人宁静、沉闷两种感觉。
商业网页设计中要注意处理好动静的关系,要整体和谐统一,给人生动而不躁动或厌恶感。同时还要遵循动态性原则与交互性原则。
1.动态性原则,即要有四维空间或五维空间的运作观念。一件网页商品、图片不仅是二维的平面或三维的视觉,也要有时间与空间的变换,情感与思维认识的演变等多维因素。
2.交互性原则,即界面设计强调交互过程。一方面是物的信息传达,另一方面是人的接受与反馈,对任何物的信息都能动地认识与把握。
四、商业网页设计中视觉流程心理因素的运用
商业网页设计是通过视觉元素引起人注目而实现商品信息内容的传达,为了使网页获得最大的视觉传达功能,使网页真正成为可读强性而且新颖的媒体,必须适应人们视觉流程的心理和生理的特点。
视觉流程的形成是由人类的视觉特性所决定的。心理学家葛斯达认为:人们阅读时,版面的上部比下部的注目价值高,左侧比右侧的注目价值高。因此,版面的左上侧位置最为引人注目,因此,在网页设计中一些突出的商品信息,如主标题、每天更新的内容等通常都放在这个位置。以便于一开始就吸引受众的视线,诱导其由上到下,由左到右地移动。此位置也被称作视觉的最佳视域。也就是最优选的地方。当然视觉流程是一种感觉而非确切的数学公式,只要符合人们认识过程的心理顺序和思维发展的逻辑顺序,就可以更为灵活地运用。设计者可以利用视线移动规律,诱导读者的视线作左右流动、上下流动以及斜线的不稳定流动,通过编排设计,人为地产生最佳视域,突出主要商品,以达到一定的视觉效果,传递商品信息。
商业网页作为一种新的企业开展电子商务的基础设施和信息平台,它的发展虽然没有多长时间,却兼容了传统平面设计的特征,又具备其所没有的优势,成为今后商品信息交流的一个非常有影响的途径。其设计是一种综合性的设计,它所涉及的范围非常的广泛,包括消费者心理学、视觉设计美学、人机工程、哲学等诸多方面,而本文中只从视觉心理因素的角度进行了一些阐述与分析,仅作抛砖引玉之用。
参考文献:
[1]李彬彬:设计效果心理评价[M].北京:中国轻工出版社,2005.1
[2]赵殿泽:构成艺术[M].沈阳:辽宁美术出版社,1994
[3]赵国志:色彩构成[M].沈阳:辽宁美术出版社,1994
[4]张国良:传播学原理[M].上海:复旦大学出版社,2000.1
第五篇:个人网页设计(论文)
炎黄职业技术学院信息工程系
毕业设计(论文)
个人网页设计
年 级: _ 2009级___ _ 学 号: _ 0******17 _ 姓 名: __ _****_____ 专 业: 网络数字媒体 _ 指导老师: __ ****__ __
二零一一年十二月 炎黄职业技术学院 信息工程系毕业设计(论文)
摘 要
本论文将对个人网页设计与制作的方法、工具等展开研究和探讨。在介绍网页设计与制作语言的基础上,着重使用CSS样式表作为工具语言进行网页设计与制作的实际操作,分别对基于对象的JavaScript语言、用于编辑HTML语言的软件进行了详细的介绍。
本论文主要章节如下,炎黄职业技术学院 信息工程系毕业设计(论文)
炎黄职业技术学院 信息工程系毕业设计(论文)
炎黄职业技术学院 信息工程系毕业设计(论文)
1、是一种脚本编写语言
JavaScript是一种脚本语言,它采用小程序段的方式实现编程。像其它脚本语言一样,JavaScript同样已是一种解释性语言,它提供了一个易的开发过程。
它的基本结构形式与C、C++、VB、Delphi十分类似。但它不像这些语言一样,需要先编译,而是在程序运行过程中被逐行地解释。它与HTML标识结合在一起,从而方便用户的使用操作。
2、基于对象的语言。
JavaScript是一种基于对象的语言,同时以可以看作一种面向对象的。这意味着它能运用自己已经创建的对象。因此,许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。
3、简单性
JavaScript的简单性主要体现在:首先它是一种基于Java基本语句和控制流之上的简单而紧凑的设计, 从而对于学习Java是一种非常好的过渡。其次它的变量类型是采用弱类型,并未使用严格的数据类型。
4、安全性
JavaScript是一种安全性语言,它不允许访问本地的硬盘,并不能将数据存入到服务器上,不允许对网络文档进行修改和删除,只能通过浏览器实现信息浏览或动态交互。从而有效地防止数据的丢失。
5、动态性的
JavaScript是动态的,它可以直接对用户或客户输入做出响应,无须经过Web服务程序。它对用户的反映响应,是采用以事件驱动的方式进行的。所谓事件驱动,就是指在主页(Home Page)中执行了某种操作所产生的动作,就称为“事件”(Event)。比如按下鼠标、移动窗口、选择菜单等都可以视为事件。当事件发生后,可能会引起相应的事件响应。
6、跨平台性
JavaScript是依赖于浏览器本身,与操作环境无关,只要能运行浏览器的计算机,并支持JavaScript的浏览器就可正确执行。从而实现了“编写一次,走遍天下”的梦想。
实际上JavaScript最杰出之处在于可以用很小的程序做大量的事。无须有高性能的电脑,软件仅需一个字处理软件及一浏览器,无须WEB服务器通道,通过自己的电脑即可完成所有的事情。
总之,JavaScript 是一种新的描述语言,它可以被箝入到 HTML 的文件之中。JavaScript语言可以做到回应使用者的需求事件(如:form的输入),而不用任何的网路来回传输资料,所以当一位使用者输入一项资料时,它不用经过传给伺服端(server)处理,再传回来的过程,而直接可以被客户端(client)的应用程式所处理。
炎黄职业技术学院 信息工程系毕业设计(论文)
JavaScript 和 Java 很类似,但到底并不一样!Java 是一种比 JavaScript 更复杂许多的程式语言,而 JavaScript 则是相当容易了解的语言。JavaScript 创作者可以不那麽注重程式技巧,所以许多 Java 的特性在 Java Script 中并不支援。
2.3 CSS样式表
级联样式表(Cascading Style Sheet)简称“CSS”,通常又称为“风格样式表(Style Sheet)”,它是用来进行网页风格设计的。比如,如果想让链接字未点击时是蓝色的,当鼠标移上去后字变成红色的且有下划线,这就是一种风格。通过设立样式表,可以统一地控制HMTL中各标志的显示属性。级联样式表可以使人更能有效地控制网页外观。使用级联样式表,可以扩充精确指定网页元素位置,外观以及创建特殊效果的能力。
CSS目前最新版本为CSS2,能够真正做到网页表现与内容分离的一种样式设计语言。相对于传统HTML的表现而言,CSS能够对网页中的对象的位置排版进行像素级的精确控制,支持几乎所有的字体字号样式,拥有对网页对象盒模型的能力,并能够进行初步交互设计,是目前基于文本展示的最优秀的表现设计语言。
在网页上使用样式表有三种方法可以在站点网页上使用样式表:
将网页链接到外部样式表。
在网页上创建嵌入的样式表。
应用内嵌样式到各个网页元素。
当要在站点上所有或部份的网页上一致地应用相同样式时,可使用外部样式表。在一个或多个外部样式表中定义样式,并将它们链接到所有网页,便能确保所有网页外观的一致性。如果人们决定更改样式,只需在外部样式表 — 中作一次更改 — 而该更改会反映到所有与该样式表相链接的网页上。通常外部样式表以.css 做为文件扩展名,例如 Mystyles.css。
当人们只是要定义当前网页的样式,可使用嵌入的样式表。嵌入的样式表是一种级联样式表,“嵌”在网页的
标记符内。嵌入的样式表中的样式只能在同一网页上使用。使用内嵌样式以应用级联样式表属性到网页元素上。
如果网页链接到外部样式表,为网页所创建的内嵌的或嵌入式样式将扩充或覆盖外部样式表中的指定属性。
炎黄职业技术学院 信息工程系毕业设计(论文)
炎黄职业技术学院 信息工程系毕业设计(论文)
图2-2 随笔
相册效果图2-3如下:
图2-3 相册
音乐效果图2-4如下:
图2-4 音乐
关于我效果图2-5如下:
炎黄职业技术学院 信息工程系毕业设计(论文)
图2-5 关于我
3.2 网站主题
本网站是一个简单的个人网站设计,以动漫为主题,主要包括了本人的自我介绍、比较喜爱的动漫作品以及平时的娱乐等。
3.3 网站风格
1.本网站主要体现了清新自然的风格,以简洁为主。2.网站的主色调为绿和白,充分衬托清新自然的风格。
炎黄职业技术学院 信息工程系毕业设计(论文)
炎黄职业技术学院 信息工程系毕业设计(论文)
(1)执行“插入”—“新建元件”命令,创建一个名称为“拉伸的叶片”的影片剪辑元件。
(2)选择矩形工具,设置填充颜色,在舞台上绘制一个无描边举行,在属性面板中设置宽和高。
(3)选择矩形,将其转换成“名称”为“叶片”的图形元件。(4)选择
onmouseout=“makevisible(this,1)”
onmouseout=“makevisible(this,1)” 炎黄职业技术学院 信息工程系毕业设计(论文)
2.输入文字,制作超链接。
4.6 xiangce4.html页面的制作
1.制作图库页面。
(1)新建一个网页文档,建立图库页面的基本布局。
(2)将光标定位在页面左侧的 炎黄职业技术学院 信息工程系毕业设计(论文)“1”,单击[确定]按钮回到行为面板,将此行为事件改为“onclick”。
(2)用同样的方法,给另外3张图像添加同样的行为,将 炎黄职业技术学院 信息工程系毕业设计(论文)
致
谢
本论文历时两个多月,我系统综合地将我所学的知识运用于毕业设计的全过程。在完成毕业设计中,首先我要感谢我的指导教师****老师。*老师耐心细致地指导我毕业设计,提出了很多精辟而富有建设性的建议。*老师认真负责的工作态度,严谨的治学态度都给我留下了深刻的印象,在学习上给予了我极大的关心和帮助,在此表示衷心感谢!
同时,感谢炎黄职业技术学院为我提供了一个良好的学习环境,感谢学院的领导和老师们!他们无微不至的关怀、精心的培养使我到了很多的知识,终生受益!
炎黄职业技术学院 信息工程系毕业设计(论文)
参考文献
[1] 缪亮.Dreamweaver CS3 基础与实训教程.电子工业出版社,2008年.[2] 李冬芸.Flash动画实例教程.电子工业出版社,2010年.[3] 缪亮,郭刚.Photoshop平面设计实用教程.清华大学出版者,2008年.