欢迎访问发表云网!为您提供杂志订阅、期刊投稿咨询服务!

网页界面设计论文大全11篇

时间:2022-07-21 14:53:40

网页界面设计论文

网页界面设计论文篇(1)

据我国互联网信息中心(CNNIC)的2014年互联网报告显示,我国网民规模已达6.94亿人,人均周上网时间为26.10小时,超越美国,成为拥有网民最多的国家。同时网民对浏览网页界面的要求也越来越高,对网页的需求不再仅仅是功能和便捷性,审美标准也相应地提高,传统的设计模式已经逐渐不能满足广大网民的需求。人们更多的是将目光转移到网页人性化的设计,而网页界面的情感化设计能否为网民带来愉悦感、舒服感,逐渐成为网站设计水平的标准之一。

一、网页应用界面概述

网页应用是指用网页语言编写的程序通过浏览器来运行的软件,它可以广泛应用于企业网站或互联网。由于网页语言程序可以直接应用于各个PC终端和手机移动终端,不需要像其他应用软件进行升级或运行前安装复杂的程序,深受用户的青睐,例如,较常见的有基于计算机终端的网络论坛、网络游戏、网络超市等,也有基于手机移动终端的APP、网页浏览等应用。

虽然我国网络化快速发展,但是,网页界面的情感化设计起步较晚,最早的网页界面概念是由国外发达国家提出来的,在国外已经有了相对成熟的设计理论和实践经验,如欧美、日本等国家一方面提出了网页界面设计的理论基础,如依据艺术设计理论和社会心理、人机交互理论等理论进行情感化设计;另一方面,还要遵循简约化、一致性、统一性、均衡性等原则。目前我国对这方面的发展主要是针对网站的文字、色彩等视觉方面进行了一定程度的设计,但总体上缺乏对情感化设计的深入探究。

二、网页应用界面的情感化设计分析

“情感”是人们对自身周围的事物以及对自身的态度的体验,它是人对客观事物的主体反映。根据唐纳德教授在《情感化设计》一书中的论述,情感化设计分为本能、行为以及反思三个层次。本能层次是用户通过外界的刺激而做出的第一反应,具有先天性,因此,在对网页界面进行设计时需要充分考虑本能层次的物理特性,将本能层次的特征融入设计的界面当中。行为层次主要是指利用简单有趣的设计为用户提供最方便网页浏览布局和清晰明确的操作导向,使用户在运用中在情感上得到体验。反思层次是意识反作用于客观事物的一种表现形式,是人们最高的情感水平。网络用户通过浏览网页界面后产生的更深层次的感知和情感,往往受到不同主体认识的不同而有不同的情感变化。通常反思层次有助于提高用户的忠诚度,建立起用户与产品的长期联系。情感设计的三个层次相互影响,在本能层次得到满足后,产生行为层次,然后体验后,产生对网络界面的反思层次,在对网络应用界面设计中应当注意三个层次的相互作用,将情感化设计贯穿于三个层次中,提高用户的认知度,为用户带来情感愉悦和舒服的体验。

三、我国网页应用界面设计的现状及存在的问题

由于我国情感化网页设计起步相对较晚,缺乏理论依据,存在着众多不足,其主要有以下几个方面。

1.内容方面的问题

通常网站网页是进行信息传播的承载体,往往包含了众多的内容,但在国内的一些网站网页设计时内容相对混乱,分不清主次。还有一些网站为了向用户传达更多的信息,对网页界面嵌入各种软件以及各种各样的内容,使用户感觉杂乱无章,忽略了页面设计的整体性和主次感。此外,还有一些网站为了商业利润,在网页界面中填充了大量的广告,容易让用户在使用时产生抵触情绪,降低了情感化的体验效果,同时,网页广告界面往往自动弹出,强制用户“消费”,缺乏对用户的尊重。

2.网页界面板式雷同化严重,缺乏创新

网页应用界面在设计上大多都是遵照一种设计样式,除一些网站在设计时根据自身的实际情况,对界面内容进行分栏分类,对色彩字体进行搭配,其他大多数设计的版本内容布局高度雷同化,缺乏创新,使用户容易产生视觉疲劳,很难吸引用户的注意力,降低了情感化的体验。

3.网页应用界面设计普遍缺乏情感

情感化的网页设计能提高用户在浏览网页时的舒服程度,还能提高用户的自我标识,但是在实际的网站网页界面设计的过程中,往往只是满足功能上的需求,追求界面的效果,忽略了在网页中添加情感因素,在视觉色彩的应用上也相对混乱,造成用户情感体验的效果不明显。

四、网页应用界面的情感化设计

通常进行网页界面的情感化设计需要明确进行网络界面设计的目的,即构建一个使用户在视觉上产业愉悦的网站,以提高用户对该网站的忠诚度。一般来讲,网页界面设计目的包括实现网站服务、良好的视觉效果以及可行性和易用性三方面。因此,网站的网页界面的情感化设计需要围绕着上述的三个目的展开。

1.色彩的设计

网页的应用界面的色调通常包含了文字的颜色、主板的色彩、所含图片的色调等几个方面。首先,图片的设计是将抽象化的物体转化为直观的视觉效果,图片的色调可以直接进入用户的视觉体验,进而产生本能层次的情感,因此,图片色调的选择要符合主题内容,与整个网页的风格相匹配。其次,文字色调的设计,文字是传达网页内容的主要方式,是网页界面的主体,其字体的颜色需要与整个网页界面的设计搭配,使用户在阅读时不产生疲劳感;最后,主色调的设计,主色调是整个网页界面的背景,在对主色调设计时要遵照使用户舒服的原则,防止色调太强,而影响文字主体阅读的困难。

2.合理统一的布局

对网页界面合理统一的布局是指在网页界面有限的空间内,对文字、图片、色彩等元素进行统一的设计编排,使整个界面显得和谐统一,不至于出现内容混乱的局面。因此,在对网页界面设计中,既要加入人的情感因素,同时又要进行合理的布局,这样才能让用户在使用过程中产生情感上的依赖。

3.方便易用的操作功能

通常网页界面设计要以方便易于操作的功能为前提,使用户在使用过程中,能够用最短的时间进行操作,并接受该功能的应用。

4.对网页界面的情感化设计的创新

创新是设计的动力源泉,一方面,只有不断创新才能满足人们提出新的需求,另一发面,创新是人们劳动性的创造,将情感和抽象思维相融合,设计到网页界面的布局中去,提高用户网页界面体验的情感效率。

5.和谐统一的人机交互

人机交互是指用户在浏览网页界面的过程中,人们从网页的内容得到了情感上的满足。因此,交互作用是让用户在应用时产生愉悦心情的设计。在网页界面人机交互设计中,设计师要灵活运用设计方法,使人机能够充分进行信息交换,让设计出来的网页界面更能打动用户的心灵。

网页界面设计论文篇(2)

随着互联网络的迅猛发展,信息传播业面临一场深刻的变革,网络作为一种全新的大众传媒,具有迅捷、及时、价廉、交互性好、传播面广的特点.作为网络传播中最主要的载体――“网页”,其设计是一种新的视觉表现形式,它兼容了传统平面设计的特征,又具备其所没有的优势,是将技术性与艺术性融为一体的创造性活动。本文尝试从网页界面设计的形式、方法和特点等三个方面,对这个新的艺术设计领域进行初步的归纳总结和理论探讨。强调网页界面设计“技术”和“艺术”两方面的内容;提出网页界面设计应具备艺术性、交互性、多媒体性、实用性、操作性、技术性等六大特点。在明确了网页界面设计与网站主题的关系的基础上,提出了“美观”和“功能”都是为了更好地表达网站主题这一观点。[1]

互联网里面的信息是以二进制的数字化形式存在的,用户要看懂这些信息,必须使用网页浏览器将数字化的HTML语言转换为普通的文字,图片,声音,视频。因此人与网络信息之间存在一个相互作用的网页界面。网页界面设计的中心便是“信息传达”这一主要目的。与传统媒体不同,网页除了文字和图像以外,还包含声音、视频和动画等新兴多媒体元素,更借助由代码语言所实现各种交互效果,使得网页设计者需要考虑更多页面元素的排布、优化。所以网页界面设计是一门新兴的设计和网络的交叉学科,它本身以网络为载体,要把各种信息以最快捷、方便,美观的方式传达给网站的浏览者。网页不光是把各种东西放上去,能看就行。要考虑网站的浏览者能更多的和更有效率的接收网页上的信息。这就需要结合使用方便的要求,制作出清晰、整体性好的页面。接收信息也会更加容易,同时提升网站的形象。

网页设计是伴随着计算机互联网络的产生而形成的视听设计新课题,是设计者依照设计目的和要求进行的创造性思维活动,在此过程中包括了“技术”与“艺术”两个必需的网页元素,因此在进行网页设计中要考滤到以下3个方面;

1.网页界面的尺寸大小;不同于传统平面媒体的设计,网页页面尺寸和显示器大小和分辨率有关系,分辨率越高页面尺寸越大。浏览器的工具栏也是影响页面尺寸的原因。一般目前的浏览器的工具栏都可以取消或者增加,当显示全部的工具栏时,或关闭全部工具栏时,页面的尺寸是不一样的。[2]

2.导航操作方便快捷;网站是一个整体,网页在设计时就要考渡到各个页面之间的链接和网站之间的超链接。一个优秀的网站也是一个易操作的网站。

3.兼顾美观与网络速度;为了达到界面美观漂亮的视觉效果,不能以牺牲网页下载显示速度为代价,图像和动画是网站中最主要造成传输速度缓慢的文件,在保证所需清晰度的条件下,尽量压缩图像和动画文件的大小。

在充分理解以上三点的前提下如何设计出兼顾“艺术”和“技术”的网页作品,本文认为主要是“版式设计”、“组织内容”和“颜色搭配”三个方面;

版式设计就是网页中的文字、图像、动画和装饰图案在网页版面上编排形式的设计。版面设计相对于网页设计来说是一门相对具有独立性的设计艺术,它研究的是平面设计的视觉语言与艺术风格,版式设计一般表现为平面,它具有这样的特点:形式灵活,一个版面有文字、有图案,文字可以横排、可以竖排,字号可大可小,字体可方可圆,能够增加美感,吸引受众注意。网页版式设计就是将文字、图形、动画等视觉元素进行组合配置,使页面整体视觉效果美观和谐,便于阅读,实现信息传达的最佳效果

何理组织网页内容;总的来说网页内容主要包括文字、图形、多媒体等几个方面。

文字

文字元素是信息传达的主体部分,从网页最初的纯文字界面发展至今,文字仍是其他任何元素无法取代的重要构成。这首先是文字信息符合人类的阅读习惯,其次因为文字所占存取空间小,节省了下载和浏览时间。网页中的文字主要包括标题、信息、文字链接、几种主要形式。标题和传统媒体中信息传达的基本作用相同,是内容的简概说明一般比较醒目、优先编排。文字作为占据页面重要比率的元素,同时又是信息重要载体,它的字体、大小、颜色和排布对页面整体设计影响极大,应精心处理。[3]

图形(图像)

图形在网页界面中具有重要作用。图形的出现,打破了网页初期单纯的文字界面,也带来了新的直观表现形式。很多网页中,图形占据了重要页面,有的甚至是全部页面。图形往往能引起人们的注意,激发阅读兴趣,图形给人的视觉印象要优于文字,合理的运用图形。可以生动直观、形象地表现设计主题。网页中常用的图形格式包括jpg和gif,这两种格式压缩比高,得到了规范浏览器的支持,下载速度快,不需要浏览器安装插件即可直接阅览。以图像作为标题和链接可以使网页具有更好的视觉效果,配合文字增强生动和形象性。需要特别注意的是背景和主图的作用。以图形为背景能衬托主题的表现,增加网页的层次感,使网页不再但点枯燥,融入设计者的风格。主图与背景和装饰性小土不同,背景是衬托主题,主图则是突出表现主题。主图是整个网页的视觉中心,它具有直观性强的特点,可以为单调的文字信息增强活力,不需要象文字那样去逐句阅读,可以不受文化水平的限制,能给人强烈的视觉信息。

多媒体

利用屏幕显示的优势,运用多媒体元素(主要包括音频、视频和动画),网络传播可以说是多媒体的传播,网络传播,实际上是三大媒体的综合体,网上音频、视频、节目,等于开办了网上电台、电视台、这些构成了网络信息最吸引人的元素。

理搭配网页颜色:网页的色彩是树立网站形象的关键之一,色彩搭配却是网页设计的主要问题。网页的背景,文字,图标,边框,超链接...,应该采用什么样的色彩,应该搭配什么色彩才能最好的表达出预想的内涵呢?本文认为可以将颜色分非彩色和彩色两类。非彩色是指黑,白,灰系统色。彩色是指除了非彩色以外的所有色彩。网页制作用彩色还是非彩色好呢?根据专业的研究机构研究表明:彩色的记忆效果是黑白的3.5倍。也就是说,在一般情况下,彩色页面较完全黑白页面更加吸引人。

因此网页设计中可以将主要内容文字用非彩色(黑色),边框,背景,图片用彩色。这样页面整体不单调,看主要内容也不会眼花。根据网站主题选择好切合自己的色彩,使用与网站内容相关的颜色;无论用非彩色、单一色彩或彩色都可以设计出简洁精美的网页界面。

参考文献:

网页界面设计论文篇(3)

引言

格式塔一词来源于德文“gestalt”的音译,本意指的是形式、形状、方式、实质。格式塔心理学是一种与艺术有缘的心理学理论,其主要目标是探讨视觉感知及其与学习、思维的关系,它所研究的出发点就是“形”,“形”是经由知觉活动组织成的经验中的整体,与视知觉活动密不可分。而网页界面设计是视觉传达设计向网络媒体的延伸,主要是通过浏览者的视觉感知来接受网站信息。因此,研究格式塔理论在网页界面设计中的运用,无疑对网页界面的设计具有很大的指导作用。

格式塔理论在网页界面设计中的应用

网页设计是将特定的视觉信息要素,根据主题表达的需求在特定的页面上进行的一种编辑和安排,其基础是视觉生理学和视觉心理学。格式塔心理学派通过对视觉感知的生理研究,提出了一系列视感知规律,其中包含了“图底”这个核心概念,和“简明原则”“接近原则”“相似原则”“闭合原则”等视感知特性,将这些规律引入页面设计,有助于我们优化视觉时代“形象过剩”状态下盲目的网页设计,提高信息传达的速度与准确度。

1.图与底

在人的知觉系统中最基本的一种知觉能力是在图形与背景间作出区分。“图”是居于前部的区域,“底”被看成是用来衬托图的背景。WWw.133229.cOm相对而言,图比底,轮廓较为完整、封闭,形状较为规则,面积比较小,色彩比较鲜艳;此外,更重要的是,能组织成为一定意义的区域倾向于被感觉成图。

由于图与底之间存在的这种相对性质,在网页设计中,应当明确区分图与底,主体与背景。另外,主体自身结构要清晰明了,背景不能过于复杂,这样才有利于浏览者辨别需要了解的信息。在背景的色彩搭配上应尽量选用同一色系的颜色,尽量避免同时使用色相环中相对的颜色,大面积同一颜色宜采用低对比度,避免用强烈刺激的颜色引起浏览者的视觉疲劳与厌烦情绪。格式塔理论的图-底规则不仅说明了主体从背景中分离出来的条件,而且指出了背景在一个格式塔中的重要作用。因此在网页设计中我们同样不能忽视背景的作用,图形是依赖于背景而存在的,要使主体感到存在,必然要有底将它衬托出来。因此无论在文字、色彩、图像,还是动画和视频方面都要坚持图底原则。

2.简明原则

格式塔心理学家认为,人们的知觉有一种“简化”倾向,所谓简化并非仅指一般意义上的“简单”,即物体中包含的成分少或成分之间的关系简单,而是一种将任何刺激以尽可能简单的机构组织起来的倾向。我们的眼睛只能接受少数几个不相关联的整体单位,如果一个格式塔中包括太多不相关的单位,眼睛就会试图将其简化,把各个单位加以组合,使之成为一个知觉上易于处理的整体,否则,整体形象将无法被正确感知,这种形象势必会被人们忽视,以至拒绝接受。

我们可以将这一观点延伸到网页界面设计中。首先,在网页界面结构的设计上,应避免使用过于复杂的网格结构,结构的设置应尽量简单明了,符合人的视觉流程,也符合人们对规则形的喜好,利于浏览者以最短的时间找到最需要的信息。

其次,在图像的选择上,应避免使用过于繁复杂乱的、容易分散浏览者注意力的图像,这样会增加浏览者找寻信息的难度。

再次,在进行文字编辑时,应该考虑编辑的最终效果。文字应给人以清晰的视觉印象,避免页面繁杂凌乱,减少不必要的装饰变化,使人易认、易懂、易读,不能为造型而编辑,忘记了文字本身是传达内容和表达信息的主体。在字体的选择上,虽然可供选择的字体很多,但同一页面上的字体种类最多只能有三四种,这样才不会显得花哨。字体的选择应依据段落大小和内容层次,由重到轻、由粗到细。字号的选择也应该依据内容层次由大到小,但到了节以下的层面,可以选用同一字号但用不同的字体加以区分。在文本密度方面,文本应该以短小的组块形式出现,并且应该经过编辑,以简化内容。

3.接近原则和相似原则

接近原则和相似原则的本质上都是简化和整体化知觉对象的组织原则,与前面的简明原则类似,人们在倾向于简化认识对象的同时,也倾向于将近似、接近的元素组合起来作为一个整体加以认知。也就是说如果不同的文字或图形组成部分位置靠近,浏览者就比较容易看出它们是一起的。根据这一原理,对于页面上的任何元素,如果在功能或内容上是相同或相近的,就应在一定程度上保持相对较小的空间距离,做到“物以类聚”。比如,页面中用以解释图形或用以表明某一部分图形的文字就应当紧挨其所指的图形或部分图形。

相似的物体也很容易被认为是从属于一个系统,具有相似的功能。因而,需要通过将浏览者注意力集中于视觉范围内的关键概念,帮助他们获得信息。在网页界面设计中,可以通过强调、动画、对比色的使用或其他手段达到这一目的。假如一个图形中的组成部分都属于同一风格,这个图形就被视为一个整体。为了使浏览者重点关注图形中的特定部分,对这一部分可采用不同的颜色、动画、闪烁或其他区分方式。但是,如果一幅画面中区别过多,也会使浏览者难以注意需要获得的信息。因此,这些方法应该用于强调关键信息或图形的关键部分,而不宜用于大片信息。

4.闭合原则与网页界面设计

闭合原则是指一种完成某种完形的行动。这一规则表明,每一种视觉样式都可以被看成是一种陈述,对于模棱两可的视觉样式,人们会根据以往的经验按照不同的样式加以组织,这时不同的人会看到不同的东西。因此,在网页界面设计时,应当避免出现不完整的图形,以免使浏览者花费过多的时间去琢磨图形的含义,而不是从网页上获取信息。

闭合规则还表明,视觉形象被知觉的形式是首先作为一个统一的整体被知觉,然后再以部分的形式被知觉。因此,在进行网页界面设计时,要强调整体风格的统一,内容与形式的统一。

结语

将格式塔心理学引入网页界面设计,目的是希望网页设计向理性化的方向发展。随着网络的不断发展,浏览者对页面的要求也越来越高,但现在的页面设计大多还是从直觉出发,离科学的页面设计还有相当大的距离,因此要想达到科学的页面设计,就要在设计时遵照人类的认知规律,并且将这些规律正确地应用到设计实践中。而如何将格式塔理论与设计结合起来,仍是我们需要投入大量精力去研究与探讨的问题。

参考文献 :

[1]曹方著.视觉传达设计原理,江苏美术出版社

网页界面设计论文篇(4)

引言

格式塔一词来源于德文“Gestalt”的音译,本意指的是形式、形状、方式、实质。格式塔心理学是一种与艺术有缘的心理学理论,其主要目标是探讨视觉感知及其与学习、思维的关系,它所研究的出发点就是“形”,“形”是经由知觉活动组织成的经验中的整体,与视知觉活动密不可分。而网页界面设计是视觉传达设计向网络媒体的延伸,主要是通过浏览者的视觉感知来接受网站信息。因此,研究格式塔理论在网页界面设计中的运用,无疑对网页界面的设计具有很大的指导作用。

格式塔理论在网页界面设计中的应用

网页设计是将特定的视觉信息要素,根据主题表达的需求在特定的页面上进行的一种编辑和安排,其基础是视觉生理学和视觉心理学。格式塔心理学派通过对视觉感知的生理研究,提出了一系列视感知规律,其中包含了“图底”这个核心概念,和“简明原则”“接近原则”“相似原则”“闭合原则”等视感知特性,将这些规律引入页面设计,有助于我们优化视觉时代“形象过剩”状态下盲目的网页设计,提高信息传达的速度与准确度。

1.图与底

在人的知觉系统中最基本的一种知觉能力是在图形与背景间作出区分。“图”是居于前部的区域,“底”被看成是用来衬托图的背景。相对而言,图比底,轮廓较为完整、封闭,形状较为规则,面积比较小,色彩比较鲜艳;此外,更重要的是,能组织成为一定意义的区域倾向于被感觉成图。

由于图与底之间存在的这种相对性质,在网页设计中,应当明确区分图与底,主体与背景。另外,主体自身结构要清晰明了,背景不能过于复杂,这样才有利于浏览者辨别需要了解的信息。在背景的色彩搭配上应尽量选用同一色系的颜色,尽量避免同时使用色相环中相对的颜色,大面积同一颜色宜采用低对比度,避免用强烈刺激的颜色引起浏览者的视觉疲劳与厌烦情绪。格式塔理论的图-底规则不仅说明了主体从背景中分离出来的条件,而且指出了背景在一个格式塔中的重要作用。因此在网页设计中我们同样不能忽视背景的作用,图形是依赖于背景而存在的,要使主体感到存在,必然要有底将它衬托出来。因此无论在文字、色彩、图像,还是动画和视频方面都要坚持图底原则。

2.简明原则

格式塔心理学家认为,人们的知觉有一种“简化”倾向,所谓简化并非仅指一般意义上的“简单”,即物体中包含的成分少或成分之间的关系简单,而是一种将任何刺激以尽可能简单的机构组织起来的倾向。我们的眼睛只能接受少数几个不相关联的整体单位,如果一个格式塔中包括太多不相关的单位,眼睛就会试图将其简化,把各个单位加以组合,使之成为一个知觉上易于处理的整体,否则,整体形象将无法被正确感知,这种形象势必会被人们忽视,以至拒绝接受。

我们可以将这一观点延伸到网页界面设计中。首先,在网页界面结构的设计上,应避免使用过于复杂的网格结构,结构的设置应尽量简单明了,符合人的视觉流程,也符合人们对规则形的喜好,利于浏览者以最短的时间找到最需要的信息。

其次,在图像的选择上,应避免使用过于繁复杂乱的、容易分散浏览者注意力的图像,这样会增加浏览者找寻信息的难度。

再次,在进行文字编辑时,应该考虑编辑的最终效果。文字应给人以清晰的视觉印象,避免页面繁杂凌乱,减少不必要的装饰变化,使人易认、易懂、易读,不能为造型而编辑,忘记了文字本身是传达内容和表达信息的主体。在字体的选择上,虽然可供选择的字体很多,但同一页面上的字体种类最多只能有三四种,这样才不会显得花哨。字体的选择应依据段落大小和内容层次,由重到轻、由粗到细。字号的选择也应该依据内容层次由大到小,但到了节以下的层面,可以选用同一字号但用不同的字体加以区分。在文本密度方面,文本应该以短小的组块形式出现,并且应该经过编辑,以简化内容。

3.接近原则和相似原则

接近原则和相似原则的本质上都是简化和整体化知觉对象的组织原则,与前面的简明原则类似,人们在倾向于简化认识对象的同时,也倾向于将近似、接近的元素组合起来作为一个整体加以认知。也就是说如果不同的文字或图形组成部分位置靠近,浏览者就比较容易看出它们是一起的。根据这一原理,对于页面上的任何元素,如果在功能或内容上是相同或相近的,就应在一定程度上保持相对较小的空间距离,做到“物以类聚”。比如,页面中用以解释图形或用以表明某一部分图形的文字就应当紧挨其所指的图形或部分图形。

相似的物体也很容易被认为是从属于一个系统,具有相似的功能。因而,需要通过将浏览者注意力集中于视觉范围内的关键概念,帮助他们获得信息。在网页界面设计中,可以通过强调、动画、对比色的使用或其他手段达到这一目的。假如一个图形中的组成部分都属于同一风格,这个图形就被视为一个整体。为了使浏览者重点关注图形中的特定部分,对这一部分可采用不同的颜色、动画、闪烁或其他区分方式。但是,如果一幅画面中区别过多,也会使浏览者难以注意需要获得的信息。因此,这些方法应该用于强调关键信息或图形的关键部分,而不宜用于大片信息。

4.闭合原则与网页界面设计

闭合原则是指一种完成某种完形的行动。这一规则表明,每一种视觉样式都可以被看成是一种陈述,对于模棱两可的视觉样式,人们会根据以往的经验按照不同的样式加以组织,这时不同的人会看到不同的东西。因此,在网页界面设计时,应当避免出现不完整的图形,以免使浏览者花费过多的时间去琢磨图形的含义,而不是从网页上获取信息。

闭合规则还表明,视觉形象被知觉的形式是首先作为一个统一的整体被知觉,然后再以部分的形式被知觉。因此,在进行网页界面设计时,要强调整体风格的统一,内容与形式的统一。

结语

将格式塔心理学引入网页界面设计,目的是希望网页设计向理性化的方向发展。随着网络的不断发展,浏览者对页面的要求也越来越高,但现在的页面设计大多还是从直觉出发,离科学的页面设计还有相当大的距离,因此要想达到科学的页面设计,就要在设计时遵照人类的认知规律,并且将这些规律正确地应用到设计实践中。而如何将格式塔理论与设计结合起来,仍是我们需要投入大量精力去研究与探讨的问题。

参考文献 :

[1]曹方著.视觉传达设计原理,江苏美术出版社

网页界面设计论文篇(5)

【论文摘要】在互联网飞速发展的今天,网络已成为人们生活中不可缺少的一部分,无论是在商业、工业还是政府部门中都早已普及开来,如今就连教育事业也都承载着网络这四通八达的命脉迅速的发展起来。网站建设越来越接近于一门艺术而不仅仅是一项技术。网页界面艺术设计,日益被网站建设者所注重。结合自身的经验,阐述了如何制作一个完整的丰富多彩的页面,主要从色彩、框架,布局、优化这几个大方面对页面设计进行描述,对网页界面艺术设计的文字、图形、色彩、多媒体四个要素做了具有特色的分析和归纳,最后对其艺术设计风格进行了深入的分类和阐述,这一部分的重点是对网页界面艺术设计风格的研究。网页作为新兴媒体,有着比报刊、杂志、广播、电视等传统媒体更多的构成要素,如文字、图形、声音、图像和动画等。最后得出页面设计需要时间和耐心去钻研,才能做出好的网页界面艺术设计这一观点。

网页界面艺术设计是伴随着计算机互联网络的产生而形成的艺术设计新课题,是网页设计者以所处时代所能获取的技术和艺术经验为基础,依照设计目的和要求自觉地对网页的构成元素进行艺术规划的创造性思维活动,必然要成为设计艺术的重要组成部分,并随着网络技术的发展而发展。表面上看,它表面上看,它不过是关于网页版式编排的技巧与方法,而实际上,它不仅是一种技能,更是艺术与技术的高度统一。?网页设计包括风格定位、版面编排、色彩处理、浏览方式、链接功能等诸多方面,其中色彩处理有着举足轻重的作用。色彩既是网页作品的表述语言,又是视觉传达的手。所以首先要了解一个问题那就是:

1 制作网页包括具体都包括哪几部分呢?

1.1图形、图像处理制作网页界面艺术设计,提到界面还有艺术,那在网页上插入一些精美、适当的图片是必要的,否则,不会有人去浏览你的页面,因此,在设计网页之前,就应搜集或制作一些好看、适用的图片。提到图形、图像处理,大家都会想到的软件是Photoshop这个软件,对,这个软件是进行图形、图像处理的软件,但是,它不是专门的处理网络图像的软件,Photoshop这个软件会用到去进行一些平面的图形图像,我们网络的图形、图像处理用的是Fireworks软件,它可以制作出传输较快的gif格式的图片,占的空间也比较小,一般大小也就是KB,而Photoshop制作出来的是jpg格式的位图,并且是有损压缩,象素大了图像就清晰,但这样的话上传到网上会影响浏览速度,象素小了就会出现模糊或者马赛克小方格,所以我们采用的是Fireworks软件进行处理图形、图像。

1.2动画制作网页界面艺术设计,肯定也少不了动画的加入,并且还要有艺术气息在里面,这就要求我们的设计者要有艺术修养和对颜色的综合把握了,在没有FLASH软件之前,用的是Go live这个软件,再后来就用传统的做法,在html中嵌入Java程序编写的动画,但这要求设计者要对Java语言熟悉。随着软件的发展,如今有了许多制作动画的软件,二维的、三维的等等,如现在我们用的FLASH软件,用它制作的动画,小巧迷人,只需作为一个.swf格式文件导出,再导入到网页编辑器里就可以了。

1.3文本的编写一般是采用在网页中用html语言中的标签编写,也可以用网页编辑工具的“所见即所得”功能直接写入文字,如:Dream weaver软件或者Front page软件等都可以进行文本的编写。还有一点要注意的就是,显示文本的时候,设计者的机器上装了很多漂亮的字体,设计的时候采用了,但是等上传到网上以后,别人在浏览的时候,如果别人机器上没有安装字体,那就显示不出来我们采用的漂亮样式字体,因此,在考虑网页界面艺术设计的基础上,我们是把文字提前在Photoshop或Fireworks可以将字体先选择自己喜欢的样式,然后转换栅格化图片再用切片切成小块,分别进行优化。输出的格式可以为gif或jpeg,再导入到Dream weaver进行具体编辑,做链接可以用图片特有的属性进行热区链接,这样就完成我们想要的字体样式效果了,就不会出现字体样式显示不出来的情况啦。

1.4框架的应用框架是网页的常用形式,它可以使网页更为清晰,可以把不同的页面超链接到同一框架中,使的页面更加紧凑。一般框架用在小说浏览页面,或者介绍图书章节的部分,或者教学网页用到的的框架比较多。

1.5表格的应用表格是网页中用处最广泛的,可以布局,定位等等,它是网页中最活跃的元素。它的应用可以使用网页更加灵活。表格(table)是页面中的重要元素,是页面排版的主要手段。我们可以设定表格的宽度、高度、边框、背景色、对齐方式等参数。很多时候,我们将表格的边框设为0,以此来定位页面中的元素,或者籍此确定页面中各元素的相对位置。我们知道:浏览器在读取网页html源代码时,是读完整个table才将它显示出来的。如果一个大表格中含有多个子表格,必须等大表格读完,才能将子表格一起显示出来。我们在访问一些站点时,等待多时无结果,按“停止”按钮却一下显示出页面就是这个原因。因此,我们在设计页面表格的时候,应该尽量避免将所有元素嵌套在一个表格里,而且表格嵌套层次尽量要少。在使用Dream weaver制作网页时,会自动在每一个td内添加一个空字符。如果单元格内没有填充其它元素,这个空字符会保留,在指定td的宽度或高度后,可以在源代码内将其删去。

2 色彩的运用

网页界面艺术设计离不开色彩的应用,当打开一个网站的时候,给用户留下第一印象的既不是网站丰富的内容,也不是网站合理的布局,而是网站的色彩,尤其是在体现界面的时候,色彩对人的视觉效果非常明显,一个网站设计的成功与否,在某种程度上取决于设计者对网页界面设计颜色的运用和搭配。

网页界面设计是一种审美活动,成功的设计作品一般都很艺术化。但艺术只是设计的手段,而并非设计的任务。设计的任务是要实现设计者的意图,而并非创造美。网页界面页面设计的任务,是指设计者要表现的主题和要实现的功能。站点的性质不同,设计的任务也不同。从形式上,可以将站点分为以下三类:第一类是资讯类站点,像新浪、网易、搜狐等门户网站。这类站点将为访问者提供大量的信息,而且访问量较大。因此需注意网页界面设计页面的分割、结构的合理、页面的优化、界面的亲和等问题。第二类是资讯和形象相结合的网站,像一些较大的公司、国内的高校等。这类网站在设计上要求较高,既要保证资讯类网站的上述要求,同时又要突出企业、单位的形象。第三类则是形象类网站,比如一些中小型的公司或单位。这类网站一般较小,有的则有几页,需要实现的功能也较为简单,页面设计的主要任务是突出企业形象。这类网站对设计者的美工水平要求较高。

3 网页界面的优化

在页面设计中,网页界面的优化是较为重要的一个环节。它的成功与否会影响页面的浏览速度和页面的适应性,影响观者对网站的印象。

在资讯类网站中,文字是页面中最大的构成元素,因此字体的优化显得尤为重要。使用css样式表指定文字的样式是必要的,通常我们将字体指定为宋体,大小指定为12px,颜色要视背景色而定,原则上以能看清且与整个页面搭配和谐为准。在白色的背景上,我们一般使用黑色,这样不易产生视觉疲劳,能保证浏览者较长时间地浏览网页。一般我们网页默认的字体是宋体。为了体现站点的“与众不同”和特有风格,我门可以根据需要选择一些特别字体。例如,为了体现专业可以使用粗仿宋体,体现设计精美可以用广告体,体现亲切随意可以用手写体等等。当然这些都是个人看法,你可以根据实际情况,选择更贴切的字体。目前常见的中文字体有二三十种,常见的英文字体有近百种,网络上还有许多专用艺术字体下载,要寻找一款满意的字体并不算困难。需要说明的是:使用非默认字体只能用图片的形式,因为很可能浏览者的PC里没有安装你的特别字体,那么你的辛苦设计制作便将付之东流。

网页的适应性是很重要的,在不同的系统上,不同的分辨率下,不同的浏览器上,我们将会看到不同的结果,因此设计时要统筹考虑。一般我们在800×600下制作网页,最佳浏览效果也是在800×600分辨率下,在其它情况下只要保证基本一致,不出现较大问题即可。现在我们设计网页,一般要考虑800×600和1024×768两种分辨率,因此我们的表格一般为居中的770左右的表格,表格的宽度最宽不要超过778。事实上,"做网页"不是单纯意义上的"制作网页",如果想让自己制作的网页美观大方,就必须要考虑"设计网页"的过程,一个好的作品,不通过仔细的"设计"就成形是绝对不可能的。

我国的网页界面页面设计水平总体上不及韩国,创新的页面极少,基本都是一种风格,这也是因以前我国的宽带水平跟不上有原因,一个漂亮的页面,必然体积会比较庞大,网络比较慢的话打开的速度也就可想而之,打开速度慢正是网页的一个最大杀手,所以我国以前的页面基本都是以框架式居多。随着我国宽带的普及,我们也迅速括起了一阵韩风,很多大胆创新的页面出现,这是一个好现象,但是一味的模仿韩国也不行,我们也要有自己的特色,不能一味的拿来主义。

网页界面页面设计的一个基本特色便是吸引浏览者,一个美观漂亮的页面不管内容多么空洞,也会有人欣赏,反之一个内容充实但页面简陋却往往不会有人去浏览,从这便可看出网页界面艺术设计是多么的重要。

网页界面设计论文篇(6)

【论文摘要】在互联网飞速发展的今天,网络已成为人们生活中不可缺少的一部分,无论是在商业、工业还是政府部门中都早已普及开来,如今就连教育事业也都承载着网络这四通八达的命脉迅速的发展起来。网站建设越来越接近于一门艺术而不仅仅是一项技术。网页界面艺术设计,日益被网站建设者所注重。结合自身的经验,阐述了如何制作一个完整的丰富多彩的页面,主要从色彩、框架,布局、优化这几个大方面对页面设计进行描述,对网页界面艺术设计的文字、图形、色彩、多媒体四个要素做了具有特色的分析和归纳,最后对其艺术设计风格进行了深入的分类和阐述,这一部分的重点是对网页界面艺术设计风格的研究。网页作为新兴媒体,有着比报刊、杂志、广播、电视等传统媒体更多的构成要素,如文字、图形、声音、图像和动画等。最后得出页面设计需要时间和耐心去钻研,才能做出好的网页界面艺术设计这一观点。

网页界面艺术设计是伴随着计算机互联网络的产生而形成的艺术设计新课题,是网页设计者以所处时代所能获取的技术和艺术经验为基础,依照设计目的和要求自觉地对网页的构成元素进行艺术规划的创造性思维活动,必然要成为设计艺术的重要组成部分,并随着网络技术的发展而发展。www.133229.coM表面上看,它表面上看,它不过是关于网页版式编排的技巧与方法,而实际上,它不仅是一种技能,更是艺术与技术的高度统一。?网页设计包括风格定位、版面编排、色彩处理、浏览方式、链接功能等诸多方面,其中色彩处理有着举足轻重的作用。色彩既是网页作品的表述语言,又是视觉传达的手。所以首先要了解一个问题那就是:

1 制作网页包括具体都包括哪几部分呢?

1.1图形、图像处理制作网页界面艺术设计,提到界面还有艺术,那在网页上插入一些精美、适当的图片是必要的,否则,不会有人去浏览你的页面,因此,在设计网页之前,就应搜集或制作一些好看、适用的图片。提到图形、图像处理,大家都会想到的软件是photoshop这个软件,对,这个软件是进行图形、图像处理的软件,但是,它不是专门的处理网络图像的软件,photoshop这个软件会用到去进行一些平面的图形图像,我们网络的图形、图像处理用的是fireworks软件,它可以制作出传输较快的gif格式的图片,占的空间也比较小,一般大小也就是kb,而photoshop制作出来的是jpg格式的位图,并且是有损压缩,象素大了图像就清晰,但这样的话上传到网上会影响浏览速度,象素小了就会出现模糊或者马赛克小方格,所以我们采用的是fireworks软件进行处理图形、图像。

1.2动画制作网页界面艺术设计,肯定也少不了动画的加入,并且还要有艺术气息在里面,这就要求我们的设计者要有艺术修养和对颜色的综合把握了,在没有flash软件之前,用的是go live这个软件,再后来就用传统的做法,在html中嵌入java程序编写的动画,但这要求设计者要对java语言熟悉。随着软件的发展,如今有了许多制作动画的软件,二维的、三维的等等,如现在我们用的flash软件,用它制作的动画,小巧迷人,只需作为一个.swf格式文件导出,再导入到网页编辑器里就可以了。

1.3文本的编写一般是采用在网页中用html语言中的标签编写,也可以用网页编辑工具的“所见即所得”功能直接写入文字,如:dream weaver软件或者front page软件等都可以进行文本的编写。还有一点要注意的就是,显示文本的时候,设计者的机器上装了很多漂亮的字体,设计的时候采用了,但是等上传到网上以后,别人在浏览的时候,如果别人机器上没有安装字体,那就显示不出来我们采用的漂亮样式字体,因此,在考虑网页界面艺术设计的基础上,我们是把文字提前在photoshop或fireworks可以将字体先选择自己喜欢的样式,然后转换栅格化图片再用切片切成小块,分别进行优化。输出的格式可以为gif或jpeg,再导入到dream weaver进行具体编辑,做链接可以用图片特有的属性进行热区链接,这样就完成我们想要的字体样式效果了,就不会出现字体样式显示不出来的情况啦。

1.4框架的应用框架是网页的常用形式,它可以使网页更为清晰,可以把不同的页面超链接到同一框架中,使的页面更加紧凑。一般框架用在小说浏览页面,或者介绍图书章节的部分,或者教学网页用到的的框架比较多。

1.5表格的应用表格是网页中用处最广泛的,可以布局,定位等等,它是网页中最活跃的元素。它的应用可以使用网页更加灵活。表格(table)是页面中的重要元素,是页面排版的主要手段。我们可以设定表格的宽度、高度、边框、背景色、对齐方式等参数。很多时候,我们将表格的边框设为0,以此来定位页面中的元素,或者籍此确定页面中各元素的相对位置。我们知道:浏览器在读取网页html源代码时,是读完整个table才将它显示出来的。如果一个大表格中含有多个子表格,必须等大表格读完,才能将子表格一起显示出来。我们在访问一些站点时,等待多时无结果,按“停止”按钮却一下显示出页面就是这个原因。因此,我们在设计页面表格的时候,应该尽量避免将所有元素嵌套在一个表格里,而且表格嵌套层次尽量要少。在使用dream weaver制作网页时,会自动在每一个td内添加一个空字符。如果单元格内没有填充其它元素,这个空字符会保留,在指定td的宽度或高度后,可以在源代码内将其删去。

2 色彩的运用

网页界面艺术设计离不开色彩的应用,当打开一个网站的时候,给用户留下第一印象的既不是网站丰富的内容,也不是网站合理的布局,而是网站的色彩,尤其是在体现界面的时候,色彩对人的视觉效果非常明显,一个网站设计的成功与否,在某种程度上取决于设计者对网页界面设计颜色的运用和搭配。

网页界面设计是一种审美活动,成功的设计作品一般都很艺术化。但艺术只是设计的手段,而并非设计的任务。设计的任务是要实现设计者的意图,而并非创造美。网页界面页面设计的任务,是指设计者要表现的主题和要实现的功能。站点的性质不同,设计的任务也不同。从形式上,可以将站点分为以下三类:第一类是资讯类站点,像新浪、网易、搜狐等门户网站。这类站点将为访问者提供大量的信息,而且访问量较大。因此需注意网页界面设计页面的分割、结构的合理、页面的优化、界面的亲和等问题。第二类是资讯和形象相结合的网站,像一些较大的公司、国内的高校等。这类网站在设计上要求较高,既要保证资讯类网站的上述要求,同时又要突出企业、单位的形象。第三类则是形象类网站,比如一些中小型的公司或单位。这类网站一般较小,有的则有几页,需要实现的功能也较为简单,页面设计的主要任务是突出企业形象。这类网站对设计者的美工水平要求较高。

3 网页界面的优化

在页面设计中,网页界面的优化是较为重要的一个环节。它的成功与否会影响页面的浏览速度和页面的适应性,影响观者对网站的印象。

在资讯类网站中,文字是页面中最大的构成元素,因此字体的优化显得尤为重要。使用css样式表指定文字的样式是必要的,通常我们将字体指定为宋体,大小指定为12px,颜色要视背景色而定,原则上以能看清且与整个页面搭配和谐为准。在白色的背景上,我们一般使用黑色,这样不易产生视觉疲劳,能保证浏览者较长时间地浏览网页。一般我们网页默认的字体是宋体。为了体现站点的“与众不同”和特有风格,我门可以根据需要选择一些特别字体。例如,为了体现专业可以使用粗仿宋体,体现设计精美可以用广告体,体现亲切随意可以用手写体等等。当然这些都是个人看法,你可以根据实际情况,选择更贴切的字体。目前常见的中文字体有二三十种,常见的英文字体有近百种,网络上还有许多专用艺术字体下载,要寻找一款满意的字体并不算困难。需要说明的是:使用非默认字体只能用图片的形式,因为很可能浏览者的pc里没有安装你的特别字体,那么你的辛苦设计制作便将付之东流。

网页的适应性是很重要的,在不同的系统上,不同的分辨率下,不同的浏览器上,我们将会看到不同的结果,因此设计时要统筹考虑。一般我们在800×600下制作网页,最佳浏览效果也是在800×600分辨率下,在其它情况下只要保证基本一致,不出现较大问题即可。现在我们设计网页,一般要考虑800×600和1024×768两种分辨率,因此我们的表格一般为居中的770左右的表格,表格的宽度最宽不要超过778。事实上,"做网页"不是单纯意义上的"制作网页",如果想让自己制作的网页美观大方,就必须要考虑"设计网页"的过程,一个好的作品,不通过仔细的"设计"就成形是绝对不可能的。

我国的网页界面页面设计水平总体上不及韩国,创新的页面极少,基本都是一种风格,这也是因以前我国的宽带水平跟不上有原因,一个漂亮的页面,必然体积会比较庞大,网络比较慢的话打开的速度也就可想而之,打开速度慢正是网页的一个最大杀手,所以我国以前的页面基本都是以框架式居多。随着我国宽带的普及,我们也迅速括起了一阵韩风,很多大胆创新的页面出现,这是一个好现象,但是一味的模仿韩国也不行,我们也要有自己的特色,不能一味的拿来主义。

网页界面页面设计的一个基本特色便是吸引浏览者,一个美观漂亮的页面不管内容多么空洞,也会有人欣赏,反之一个内容充实但页面简陋却往往不会有人去浏览,从这便可看出网页界面艺术设计是多么的重要。

网页界面设计论文篇(7)

随着互联网的高速发展和高校网络化、信息化步伐的加快,高校网站受到越来越多人的关注,它不仅向社会各界展示高校办学特点、文化内涵,同时还和外界信息资源形成了互通,扩大了学术交流的范围,使大学校园走向了世界。目前,高校网站作为网络宣传的信息平台,正在充分发挥着高校教育资源的优势。如今的高校网站界面设计,早已脱离单纯追求功能的时代,网站界面设计不仅要考虑如何把有效的信息放在界面上,还要考虑到浏览者是如何感知网站界面上的各种视觉要素的。怎样通过网页视觉要素设计来实现高校网站界面设计? 本文从文字、图形图像、版面、色彩及动态元素这五个视觉要素的设计来论述。

1 文字

在高校网站界面设计中,经常会使用大量的文字来对需要传达的信息进行描述。不同的网页信息内容以及网页主题决定了网页中文字的风格以及编排形式。文字通常单纯作为文本,有时还可以充当图形来使用,在这一点上应该根据网页的主题来进行设计。例如学校的名称。网页上的大多数中文文字是以容易被大众接受的宋体字、黑体字来设置,这是为了在不同系统设置的电脑上网页的显示没有误差来设置的。文字通过各种各样的巧思妙想,虽然也可以用来美化页面,对网页起到一定的装饰作用,但最终目的还是要传递信息,为准确的传递某种信息来服务。所以文字的装饰设计不应该抛离其可读性,合适的文字能使网民舒适的浏览网页并快速获取有效信息。

2 图形图像

图形图像和文字相比,更加的形象具体,不需要进行解释翻译。在现代的网页设计中,由于信息量的激增,人们更加愿意从图片获取所需的信息,图片能够打破文字较为呆板的视觉效果,丰富网页的视觉表现。

网页中的图形图像包括图标、图片、背景图片。图标以功能性、操作性、标记性信息的传达为主旨,力求通过对字体、构图等抽象符号的位置、比例、对比、渐变等关系浓缩在一方小图,从而更直接、生动的揭示要表达的信息内容。图片在网页设计中不仅仅是作为装饰功能来使用,更多的是作为辅助文字信息传递的功能来使用的。

3 版面

网页的版式设计需要对信息资源进行特定有序的编排,才能够保证浏览者在浏览网页的时候不用花费很多的时问来从某个页面上寻找一些共性链接、菜单、按钮所在的地方,有利于更快更好的信息传递。

根据我国大部分高校网站进行观察分析,所采用的版式结构大概分成以下几种:(1)上左右结构。上部为校名、校标或广告,下方左边为导航菜单,右边为内容。这种结构布局清晰、主次分明,被我国绝大部分高校网站采用。(2)左右结构。里面填上所要内容,一半深色,一半浅色,这种设计性较强的结构,一般在国外高校网站设计中常见。比如哈佛大学网站的主页,就是采取这种布局方式。(3)上左中右结构。一般上下都有广告条,左右两边为导航和链接,中间为主要内容。这种结构在我国高校网站中也较常见。

4 色彩

高校网站是高校对外宣传的窗口,良好、恰当的色彩运用可以提升高校网站品质与网络形象,正确传达出高校的文化内涵。在高校网站色彩运用时,应当庄重、大气,整体色调协调统一,避免使用怪诞与另类的色彩。

在为高校网站页面设计选择色彩方案时,应当先确定一种主色调,这一色调应有利于体现网站主题宗旨。主色调应当根据学校的整体风格、学科特色、地域特色、人文特色、传统特色等各方面的因素来确定。二是确定配色方案。主色调确定后,就要合理运用色彩规律,以主色调为中心,利用色彩的明度、纯度、色相三要素的变化,适当增加其他色彩作为对比色和补色,选取辅色调、点睛色、背景色等组成配色方案。三是正确使用色彩。确定好主色调和配色方案后,在色彩的使用中应注意“总体协调、局部对比”,即网页的整体色彩效果应该是和谐的,只有局部小范围的地方可以有一些强烈的色彩对比。

5 动态元素

动态元素主要指声音、动画和视频文件。声音是多媒体技术的重要组成元素,在网页里,浏览者可以通过享受音乐获取所需要的信息。动画一般为GIF或FLASH。优秀的动画和具有震撼力的音效结合,常常使观者身临其境。考虑到目前的网络技术和视频文件的播放效果,在设计上应首选较小的显示尺寸。视频在传递声音和影像上的优势,将会为未来网络信息传播提供更大的发展空间。

网页作为一种新的视觉表现形式,兼容了传统平面设计的特征,又具备其所没有的优势,成为今后信息交流的一个非常有效的途径。高校网站页面设计,作为宣传和展示高校的门户,我们要从高等学校的教育主旨出发,同时学习和借鉴国内外优秀网站作品的设计经验,并且从传统的艺术思想理论和形式美法则中汲取营养,对高校网站建设进行更多、更深入的艺术设计实践活动。

[参考文献]

网页界面设计论文篇(8)

全新的网络经营模式让商业活动的利益链条不断扩增,在线交易平台为人们提供了一个非常便利、快捷的消费环境。中国拥有数量众多的网络消费群体,在联营方式和网络销售模式上,C2C电子商务网站通过界面设计为用户提供了一个良好的用户体验。与此同时,用户体验也影响着消费者对网站的忠实度和访问诉求,所以如何通过界面设计提高用户体验效果,已成为广大网站设计研究者讨论的热点问题。

一、国内外电子商务网站界面设计

(一)国外研究现状

在世界市场环境的影响下,国外的电子商务网站的发展速度飞快,面对机遇与风险并存的网络消费市场,国外发达国家在网站界面设计上,更注重满足用户需求,为用户提供不同的文化背景和消费模式,在满足用户消费诉求的情况下,拓展网站展业结构链条,增加消费项目[1]。所以相对于美国、英国、法国等发达国家来讲,用户需求的差异性是主导其网站界面设计主题的关键因素,不同文化体现不同设计理念,不同设计理念影响网站界面产生不同的设计风格。美国著名网站界面设计专家Patricia L在研究网上商店的消费格局中发现,用户体验是影响其消费行为的决定性因素,同时电子商务网站可以利用界面设计产生的视觉刺激增强用户的购买欲望。

(二)国内研究现状

目前,我国有75.34%的网络购物人群选择在C2C电子商务网站中购物,作为最具影响力的两大网站――淘宝和易趣,无论是商品数量还是注册人数都居全国前列。淘宝和易趣在网站界面设计方面都采用了先进的设计理念,针对不同种类的消费者制定不同的消费购买程序,如果用户初次进入网站进行消费,则网站会在用户注册之后,随机附赠一个体验调查表,用户根据自己的消费经历,对网站服务情况进行综合测评[2]。以用户体验为主导C2C电子商务网站的界面设计项目都具有高度的科学性和消费价值。综上分析可知,文化背景、消费理念以及用户体验对网站界面设计的影响存在某种关联性的差异。

二、电子商务网站设计中用户的重要地位

在C2C电子商务网站中,网站界面是呈现给网络消费者最直观的经营表象,作为消费行为的主导者,网站界面能否让用户产生依赖感,感受到网站的消费信用和经营魅力,是促成在线交易行为的关键。所以用户对于C2C电子商务网站设计内容的影响很大,与传统实体经营模式不同,电子商务网站呈现给消费者的产品实体价值地位很弱,在整个交易过程中,消费者都是通过网页浏览研究并制定消费计划的,所以在消费者看来,界面的规整度、真实性、感官价值是其衡量产品质量的重要标准,在虚拟的消费环境下,用户的一切消费思想和行为都会依附于网站界面呈现给他的直观感受[3]。由此可见,用户体验对C2C电子商务网站设计项目的主导意义非常强,网络运营商需以用户体验为中心,制定合理化、科学化的界面设计方案。

三、以用户体验为中心的界面设计

(一)用户体验的理解

1.用户体验概念分析

用户体验是指用户在操作网站界面时的感受,在进行消费动作过程中一切心理活动,从心理学角度讲,每个人对事物的体验感受存在明显差异性,所以作为一种消费情绪,用户体验的消费价值和营销价值并不固定,很难以固定模式来展现[4]。

2.用户体验的构成要素

根据C2C电子商务网站的经营特征和发展结构,可以将用户体验分为五个模块,战略模块、范围模块、结构模块、框架模块以及表现模块,这五个模块的功能是具有关联效应的,对网页设计与消费结构的影响很大。战略层是围绕整个网站页面的设计定位组成的,交易内容和价值体系是战略层主体的设计内容;范围层,运营商会将产品进行分类,在加入检索功能后,消费者可以轻松、快速的找到所要购买的商品;结构层可以帮助用户设置商品,简化操作环节,让消费者能够随着消费心理的变化自由更换消费物品;框架层融合了信息布局、导航布局、界面布局等多个结构设置信息,注重的是各商品元素的交互排列;表现层是与用户距离最近的功能模块,通过文字、图像、动画、音乐等感知因素,给用户提供消费提示,为消费者创建一个良好的印象和感受。

(二)以用户体验为中心进行文字编排

文字是最早引入C2C电子商务网站界面的元素,透过文字网站可以提供给消费者多样化的消费信息,在文字编排上文字具有高度解释和说明功能。用户体验在界面文字设计中应保持原始解释功能,还应突显出消费者最关注的消费信息。通过动态图形渲染、符号化文字衬托、图文结合设计采用主次穿插的形式来表现文字信息,可以增加各种文字信息在构图关系上的关联性[5]。网页设计人员还应针对不同模块功能的页面,个性布局,让文字体现出信息感染力和体验价值。综上分析可知,文字大小、格式、布局、信息组合结构等对网站界面构图情况的影响很大。

(三)以用户体验为中心的色彩设定

1.色彩在视觉流程中的应用

色彩在页面设计中占有主导性地位,大量信息在表现层中会出现色彩的偏差,这些偏差不仅可以增强页面视觉效果,还能提高色彩信息的融合程度。色彩对比是使用色彩的唯一标准,利用画面色彩调合以增进文字与图像之间的设计关系,尽可能的突显出页面的消费主题。用户对色彩的认知程度和理解程度对色彩的应用细节有着重要影响,所以在视觉流程中色彩要想突显出其设计作用必须依靠色彩焦点感应,利用画片色彩的多样性提高消费者对网页的关注度,同时提高色彩布局的规范化、合理化[5]。色彩不仅可以奠定网页的主题,还能提高内容与画面的连接作用,展现出网页设计的形态美和动态美。内容与结构上的统一也可以从色彩中表现出来,所以色彩设计最根本的目的在于通过色彩抓住消费者的视觉聚焦。与此同时,色彩的生理平衡和心理平衡常常是无法分开的,唯有色彩与表现的内容与情感统一才能最充分展示色彩的动人心弦的力量。

2.色彩与主题的联想

从认知的角度分析,色彩与网页设计主题具有高度的联系作用和价值,色彩不仅能够引起消费者消费行为,还能让消费者对网页销售产品产生一定的主观联想。对用户体验进行系统的调查分析可知,C2C电子商务网站在网页设计风格上、色彩搭配上、商品色彩主题呈现上都具有很高的决策作用。消费者在浏览网页过程中,会依照网页展现出来的色彩设计理念判断网络商店中商品种类、商品质量、店家可信度等因素。与实体经营不同,网络经营的产品对消费者知觉的影响并不大,因为消费者并不能触摸到、了解到商品[6]。色彩主题会增强店铺的品牌形象,一个具有特色的色彩品牌会提高经营产品的商业价值,所以以用户体验为主导的色彩主题设计是网页界面设计中的重点和难点。

(四)以用户体验为中心的图片交互性设计

图片能客观的反映出经营商品的实体形态,所以选择正确的交互界面元素布局对网站设计的指导意义很大。网站上各功能模块能够间接、直观体现整个网站系统的经营关系,所以每个页面都需利用实体产品图片实现元素的交互与融合。图片交互性设计主要体现在页面布局设计中,通过界面色彩、元素的划分,网站各经营页面会呈现出不同的视觉效果。图片交互性设计主要从三方面来体现[7]:

1.线框图整合

由于线框图有明显设计边界,所以如果要引入大量线框图做边框设计,应将不同种类的图按照产品价格、使用性能、信息内容来分类,在整合边框的前提下,尽可能的增加线框与色彩的融合程度。让消费者能够轻松分辨出不同商品种类的信息特色,以最大限度的提高用户体验价值。

2.定义核心导向

图片交互性设计虽然能够改变网站界面的传统设计理念,在色彩组合上突破固有设计观念,大胆启用先进设计思想。但是图片交互的影响内容也很多,如果处理不好,会让用户感受到整体页面是通过图片堆积而产生的,让消费者感到毫无美感,多商品失去消费意愿。所以应在图片交互设计中引入定义核心导向,在增加视图美感的情况下,明确产品与信息的经营关系,做到页面设计的和谐统一。

3.整合信息框架

图片与文字相同,具有整合信息的作用,所以为给消费者提供丰富的信息资源,在网页设计上一定要突显出图片信息整合的作用,在主导页面设计格局的同时,引入视觉设计理念,在结合用户体验的前提下,提高图片与文字的和谐统一性,提高图片与色彩的共融性。

四、C2C电子商务网站页面设计发展展望

本文基于用户体验对C2C电子商务网站页面设计内容进行了系统分析,通过分析可知,C2C电子商务网站作为我国主流的在线消费网站,其市场经济价值很高。要想推动C2C电子商务营销的效益额增长,首先要抓住消费者心理,提高用户体验对营销策略、网站页面设计、网站营销能力的影响作用[8]。目前,网络运营商对网站页面设计内容非常重视,其战略性发展内容已逐渐从经营策略转化为设计策略。今后几年,随着互联网消费应用的深入发展,人们消费理念向审美角度不断演变,C2C电子商务网站仍面临着严峻的设计与创新压力[9]。

将建模理论引入了网页设计思想,通过理论模型和探究心理学内容,找到了反映用户体验的终极设计原理,S-O-R原理和设计信息传播框架是网站页面设计的新型结构。在C2C电子商务网站运营环境的影响下,C2C电子商务网站页面上合计的用户体验价值会充分的展现出来。从图片交互设计上,研究者应努力革新传统色彩应用理念,增加现代色彩布局原理与传统色彩应用内容之间的关联性。将用户体验设计要素直接、主观的展现在网站页面中,让用户从感官、认知、情感等体验层,了解网站营销产品的信息。同时,还应在此基础上制定符合网站营销理念的网页设计方案,以成功设计案例为主要研究对象,在设计之前积极主动搜集一切有关用户体验的信息和数据,将数据引入评价模型,按照评价模型建设并创建网站页面主题。找到具有针对性价值的C2C电子商务网站设计原理和研究方法,通过用户体验设计来提升网站价值,作为今后C2C电子商务网站的新功能模块时的标准参考[10]。

通过上文对C2C电子商务网站界面设计内容进行深入分析可知,以用户体验为主要设计思想的设计理念,可以增强运营商与消费者之间的信任感,为长期交易发展提供良好的交流平台。中国网络消费者的消费理念更注重长期效应,所以C2C电子商务网站要想提高界面设计的消费价值和理念意义,必须时刻关注用户体验的变化情况,适当调整运营界面布局和信息,以保证网站对信息的显示功能、设计功能、解释功能、刺激功能最大化。

参考文献:

[1]苏倩.基于中国C2C电子商务网站的用户体检研究[J].北京邮电大学学报(社会科学版),2013,12(06):119-123.

[2]潘越.基于可用性研究的C2C电子商务网站界面涉及[J].重庆师范大学学报,2012,11(01):119-124.

[3]周懿.基于用户体检研究的C2C电子商务网站设计[J].上海交通大学学报(社会科学版),2012,14(25):125-137.

[4]张海昕,郭丹,刘正捷.中国C2C电子商务网站的用户体检[J].大连海事大学学报(社会科学版),2012,13(05):129-136.

[5]梁擎.试论我国C2C电子商务网站服务中的用户体验[J].信阳农业高等专科学校学报,2012,23(04):125-129.

[6]郭丹,钱凯,郭志伟.C2C电子商务网站本地化建设中的用户体验研究[R].第二届和谐人机环境联合学术会议――第2届中国人机交互学术会议论文集,2012,11(11):178-193.

[7]罗古松.基于用户体验的B2C电子商务网站服务质量综合评价[J].商场现代化,2012,14(08):110-126.

网页界面设计论文篇(9)

中图分类号:TP393.092 文献标识码:B

文章编号:1671-489X(2015)08-0057-03

1 简约化及相关概念厘清

简约化与饱和化的辩证 饱和,在化学中的解释是:在一定温度和压力下,溶液所含溶质的量已经达到最大限度不能够再溶解时表现出的形态。也用来比喻事物发展到最高限度时所表现出来的状况和态势。从视觉接受的角度分析,饱和化是指视觉信息达到人们所承受的最大限度。简约化与饱和化是相对的。简约化就是对人视觉信息的简化,它是用简洁明快的视觉语言来满足受众对视觉环境感性的、本能的和理性的需求。

简约化与简单化的厘清 简约不同于简单。“简单”解释为结构单纯、容易理解,与复杂、困难、繁琐是相互对立的词语。在网页设计中简单表现为页面结构单一、色彩单调,在形式表达上比较呆板,无法给人视觉带来亮点,功能缺乏交互性等。简约并不是缺乏设计要素,它是一种更高层次的创作境界[1]。简约是针对不同对象,筛选适合于设计对象的、经过不断精心组合或者选择的精华。它遵从人类的生理和心理状态,强调的是以人为本的更为情感化的设计。

2 简约化网页界面设计的内涵分析

形式统一与和谐 凡是简洁美的东西都有一条共同的原则,就是在外观造型中的各元素存在一定的和谐、统一的关系[2]。人的视觉和心理惯于接受有序、简洁与和谐的形态。即使人们遇到一些看似凌乱无序的画面,也尽量从各种角度对其进行归类、整理,以求从中找出内在的规律与美的因素。因此。视觉美感产生于有序与和谐之中。有序与和谐让人对事物的心理感觉单纯化、规律化以及整洁化。

网页功能的简洁性 简约的网页在功能上能明确表达功能效用,强调用户体验,是一种人性化的设计。王晓蓉、杨治明曾经建议人性化网页界面设计要具有美观性、舒适性、简洁性、一致性、高效性和安全性[3]。简约的网页功能针对用户的心理动机、认知心理、智力发展状况进行设计,表达意义简明醒目,易被用户注意和认知,而不是浪费时间去寻找功能。

形态的易记性 从记忆的角度来说,简洁单纯的网页元素要比复杂的网页元素更容易被人们记住。简洁单纯的事物视觉点突出,不会分散用户的注意力,能够保持长时间的注意力稳定。

情感表达的丰富性 简约化的网页呈现的不仅仅是一个视觉画面,它还蕴含着深刻的思想和丰富的情感。针对用户的情感心境,使用合理的文字、色彩、图像,能使用户对产品产生亲和力,从而加深品牌印象。因此,网页不仅注重它的美观度,更注重它的情感表达的丰富性。

3 网页界面设计中简约化要素分析

简约化设计与文字元素 文字是人类用来记录语言的符号系统,在网页界面设计中占有十分重要的作用,因为人们大多信息的获知都是以文字的形式表达出来的。众多构成要素中文字具有最佳的直观传达作用以及最高的明确性。文字传达本身语义之外,还传递其他一些信息。文字视觉形态的大小、颜色、曲直、排列的疏密,以及语言的强弱、缓急、和谐或嘈杂,以及表情、姿态等,能够引起浏览者内心相应的不同感受。文字简约化设计表现为以下几点。

1)易读性:文字的表达要能被大众理解,在排版形式上能够符合人们的视觉流程,在文字颜色和大小设计上要符合网页的设计风格。

2)明确性:信息表达简洁明了,不繁琐不模糊,能够明确表达网页设计的中心主题;在语义的传达上不会让人产生歧义,传达的信息容易被用户理解。

3)美观性:文字的大小、颜色、编排等的设计要符合人的视觉审美,选择适合于网页风格的文字编排;通过文字形体的统一变化、文字编排的节奏韵律、文字量感的对比和谐来增强网站的美观度。

4)适合性:针对不同的用户,使用合适的文字大小、颜色、语气、形态,拉近用户的心理距离,引发用户的情感共鸣,达到产品宣传的最终效果。

5)创新性:将文字图形化、意象化,以更富创意的形式表达出深层的设计思想,能够克服网页的单调和平淡,从而打动人心。这种方式的处理既是文字内容的直观表达,又是文字含义的延伸表达。它增加网页的视觉亮点,给用户耳目一新的感觉。

简约化设计与图像元素 图像在网页设计中扮演着不可缺少的角色,能够简化网页设计的各种复杂的信息,这也是大多设计师喜欢它的原因之一。图像简化信息的具体表现包括以下几点。

1)图像的直观性和简易性:图像取代了文字多而繁杂的缺陷,相对于大片的描述文字,人们更愿意去选择简洁和直观的图片,它易被理解和认知。尤其是在体现产品特质的网页中,与其使用大量的文字耗费精力,不如使用更直观的产品图片,提高信息的传递效率。

2)图像的丰富性和真实性:图像含有丰富的色彩,具有设计艺术的美观度和视觉的空间感,所以能够吸引人们的眼球。同时,图像多是真实的生活采集到的摄影图片,在艺术的表达上自然、不做作、真实,更符合人们简约化思维的模式。

在新闻资讯类网站中,图文结合是经常见到的现象。网站中都会把今日的重点新闻配上小块的图片放在网页中,不仅简化了文字的数量,还提高了用户处理信息的效率。图片的应用就是对信息的简约化处理,图像将信息以最直观、简洁的形式呈现出来,省去了人们阅读大篇文字的时间,也避免了因文字过多而迷失重点。

另外,图形的简约化还表现在LOGO设计上。LOGO可识别性强,使用简单的图形表达丰富的含义。简约化的标志更容易获得受众的认知,更具有时代性,是信息简化的产物。

简约化设计与色彩元素 色彩在网页设计中占有很重要的位置,因为就生理而言,人们对色彩的敏感度特别的高。马克思说:“色彩的感觉是一般美感中最大众化的形式。”[4]当打开一个网页时,关注色彩元素比其他的元素都要强,色彩最具表现力与识别性,出色的色彩搭配可以在瞬间吸引用户的目光[5]。同时,它能够体现企业产品的特质,在不需要过多繁琐的文字、版式等元素的搭配下,色彩就能直接简洁明了地给用户第一印象。

简约化的网页色彩设计就是根据网页类型的特质,从复杂的客观色彩中提取出最能凸显设计神韵的一到三种主观性的色彩,通过色彩的色相、纯度、明暗、色块面积等的对比,简化用户的视觉流程,给受众带来视觉和心理的轻松,具体表现为以下几点。

1)配色的统一和谐:同一色彩的大量使用,可以使页面整体化和秩序化,能快速给用户留下深刻的印象。

2)配色的强调和突出:使用和其他元素颜色对比强烈的某一色彩,可以引起受众的注意力。

3)配色的留白使用:采用大面积色块的留白,增强了页面的节奏感和韵律感,能够使页面简洁大方。

简约化设计与版式设计 如果把网页界面中的文字、图形、点线面等元素比喻成员工的话,那么版式设计就是一个管理者,根据员工的职能特点,依据一定的管理理论和方法,有效地激发员工优势,从而更好地完成任务。因此,版式设计就是将文字、图像、色彩、图标等元素有机组合,表达美与和谐[6]。

简约化的网页版式设计并不是将各种元素杂乱无章地编排,而是按照人们的视觉流程规律以及形象思维,有秩序统一地进行规划整合。基于受众的视觉流程规律,简约化的网页版式设计应该具有以下特征。

1)清晰易读:网页的不同元素位置设计,框架构造上和谐统一。每个元素不是混乱的搭配,而是根据人的视觉流程特点,将设计元素进行合理规划,能够在人的大脑中呈现出清晰明了的信息。

2)统一有秩序:统一和秩序增强了网页各元素的联系和轻重关系,符合用户的阅读习惯、心理秩序和思维发展的逻辑认知顺序。

3)相互呼应:呼应是指两个以上的形态之间通过“呼

唤”和“相应”的关系达到画面的均衡。有效的网页元素呼应能够增加元素之间的内在联系,使网页整体感突出。

4)中心突出:视觉中心是人的视觉心理量感所偏向的视觉位置。视觉中心突出的网页能够主次分明地把网页的元素进行位置编排,以突出网页要表达的重点信息。

简约化设计与留白 顾名思义,空白区域是指不同元素之间的区域。在网页设计中,文字之间、段落之间、图片之间等网页设计元素之间的区域都是空白。网页设计的留白并非意指白色,而是设计界面中内容的空白。认知心理学的研究证明,留在空白之中的东西更容易被人注意和想起[7],它是符合人们的认知需求的,人们的注意力和记忆力不可能长期保持稳定的状态,他们需要外界的事物给予一个“缓冲”和“喘息”,以获得视觉和心理的缓和,因此,留白体现的是一种单纯轻松的理念。

“留白”在某种程度上代表着简约[8]。留白正是用这种“此时无声胜有声”的视觉语言,诠释了简约化设计的以少胜多之美。留白能控制视觉量感,保持了网页整体的统一性和平衡感,增加了网页页面的内涵和丰富性。网页设计中一般包括以下几种常用的留白技巧。

1)背景和元素间隔的空白:它能够清晰地分离页面板块,增加页面的空间感,更容易引导用户的视觉流程。

2)页面大面积色块使用:页面大面积使用某一色彩,可以强烈渲染、烘托网页设计元素和网页主题,简约时尚而更具视觉冲击力。

3)统一页面主要设计元素的背景,呈现出规则图形组合:统一而有秩序的页面能简明地体现网页主题的特质,更容易让用户认知。

4 总结

简约化网页界面设计符合现代人们视觉和心理的需要,是时代大背景的选择,体现设计界最先进的设计理念。将简约化的思想和理念运用到网页设计中,创造性地处理网页中文字、图像、色彩、版式等网页元素的关系,便能正确把握设计流程的方向,给设计师和用户一个规范的参考。

参考文献

[1]黎浩.简约主义:现代设计的风格倾向[J].高教论坛,

2004(5).

[2]杨大松.现代设计艺术的简洁之美[J].安徽建筑工业学院学,2004,12(2).

[3]何亭.人性化网页界面设计的进展与展望[J].美与时代,2012(9).

[4]欧阳丹.浅析现代平面设计中色彩的简约化趋势[J].湖南工业职业技术学,2009,9(1).

[5]吴爱群.简约版式在平面设计中的应用[J].美术教育研究,2012(3).

网页界面设计论文篇(10)

二、课程教学目标的重新确定

我们都知道,一门学科的课程目标通常决定了该学科的最终导向,它不仅能为教师传授正确的学科理念提供依据,同时也给学生指明正确的课程学习方向。因此,视觉传达专业网页设计课程改革的首要环节就是对该课程教学目标的重新确立。众所周知,高等教育培养出来的人才最终要服务于社会,社会的需求决定了该学科的教学内容和教学目标。随着科技的进步,时代的发展,不同时期对网页设计人员的需求也是不同的。通过市场调研,我发现目前社会上网站分工越来越细,招聘的相关岗位大体分为三类:第一类为前台美工,以视觉传达专业为主,以网站的形象塑造和界面美化为岗位内容;第二类为网站后台服务,多以h7V5数据库等做交互型网站的,以计算机专业为主;第三类就是两者都要具备的全才网页设计师,是具有技术背景和多年实战经验的创意人才。由此我们可以确定视觉传达专业培养出来的网页设计人才的岗位定位应是网页美工师,他应该具有两种专业素质:一是掌握网页设计的基本要素和美学知识相结合的方法与技巧;二是懂得简单机算计软件(PS、Dreamweaver、Flash)的操作,便于在制作网页界面时考虑到后台维护的便利。而“艺术设计教育的人才培养目标是:培养综合素质高、创造能力强的高级应用型设计人才”。所以该课程教学目标应该是培养具有以上两种专业综合素质的、创造能力强的高级网络应用型设计人才。新的培养目标确定后,该课程的教学内容应该在此基础上重新调整。

三、课程内容的调整

视觉传达专业网页设计课程教学内容应该为教学目标服务,知识结构要合理,应注意知识点之间的交叉及有机结合,同时也要有效地培养学生的创新性思维及独立分析、解决问题的能力。基于此,新的教学内容调整为两大板块:理论课程内容和实践课程内容。

1.理论课程内容

理论课程内容在课程编排中为最先讲授内容,以教师PPT演示传授为主,学生讨论互动为辅,课时安排为总学时的四分之一。在教学过程中又分为两个环节来实现:(1)第一次课的设计把第一次课设置为课程概述,主要对网页设计课程的教学特点、教学内容、教学目的、教学重点和难点加以通篇介绍,对学生说明课程安排和考核要求,并通过简单上机实例操作来提高学生学习兴趣,进而引入网页基本理论教学环节。(2)网页基本理论学习网页基本理论学习包含三个知识板块:网页设计的基本要素、网页界面的版式设计、网页VI形象的美学塑造。我们知道每个设计门类都有自己独特的构成元素,这些不同的构成元素形成了该门类不同于别的门类的独特的艺术魅力。了解和掌握这些构成元素的特点和作用,有助于我们更好地进行设计工作。网页构成元素按功能和形式划分为两大类型,按功能划分为页眉和页脚、背景与底纹、按钮与控件、导航器和目录、功能板块和广告位;按形式分为文字、图片、色彩、多媒体和超级链接。网页设计中的构成语言不同于传统平面设计,它们之间存在很大差异,例如网页设计中的颜色是光色,是标准的RGB色彩,而传统平面设计中的颜色在输出过程中是以印刷色CMYK形式出现的;传统的平面设计不用考虑网络传输的因素,而网页设计中的构成元素应考虑在不影响显示效果的前题下,尽量压缩文件大小,便于网页文件的上传与下载;又如动画、音频等多媒体语言在传统平面设计中不用考虑,而在网页设计中它们是给网页增加活力的重要手段因此,教师在此板块教学中要选择大量实例进行比较,不但要指出网页设计各构成元素的特点和作用,而且还应指出与平面设计中相对应元素的异同之处,便于学生区别学习。网页界面的版式设计不同于传统平面设计的版式设计。平面印刷品有着各自固定的纸张大小或裁切规格,而网页界面则不然,它的显示尺寸受到电脑显示器的限制,不同尺寸的显示器显示的网页界面是有区别的。除此以外,它的最终显示控制权其实掌握在浏览者手中。如果过分注重网页界面版式设计的视觉完整性,就不能顾及网页设计元素的灵活性。所以,教师在此板块教学中应该强调网页界面版式的变化性,同时也要强调首页与内页版式的连贯性,要求学生在设计中注意网页界面版式完整性与灵活性的关系。网页设计是VI设计的一个重要组成部分,是企业视觉形象执行标准的延续和拓展。和所有的线下公司一样,一个好的网站也需要依助于VI设计。准确的、有创意的VI设计,有利于树立网站形象,使其在众多同类网站中脱颖而出,增加浏览者的浏览欲望和浏览记忆,对该企业的推广和宣传也能起到促进作用。网页设计课程上引入VI设计概念,教师应该保持教学的延续性,要求学生在进行网页设计的同时,将VI理念应用到网页界面中。网页设计应主题突出、富有创意,色彩搭配应协调统一,具有强烈的视觉冲击力,从网页LOGO到色彩运用均要突出企业视觉形象。

2.实践课程内容

视觉传达教育的目的就是培养出创造能力强的高级应用型设计人才。应用性人才的培养模式里实践性课程比例要大,网页设计课程也是这样,理论是基础,实践是灵魂。所以实践课程内容在课程编排中为比重最大的内容,课时安排为总学时的四分之三。实践课程包含软件操作板块、简单代码学习板块和实际案例制作板块三个知识点。此部分内容在教学过程中又分为两个环节来实现:

(1)软件操作和简单代码学习板块的教学

此部分教学为计算机软件学习阶段,Fireworks、Dreamweaver、Flash是传统的网页设计软件学习内容,根据当今互联网开放性的特点和视觉传达学生对现有软件知识掌握的情况(PS是基本功,是学生都已掌握的软件),把传统软件教学内容更改为“网页新三剑客”(PS+Dreamweaver+Flash)的学习。简单地说,就是用PS制作静态网页界面和切图,并处理图片,用Dreamweaver布局和超级链接,用Flash做特效。而这三个软件知识板块里面教学重点依次为Dreamweaver、Flash、PS。在软件教学环节,教师可借助类似“红蜘蛛”一样的网络教学平台和学生互动教学。学生可根据老师在线传送的素材临摹教师的操作,教师也可以在线观察学生执行情况个别辅导。同时根据艺术学生英语和数学水平普遍较低的特点,在教学中应该增加一些简单代码知识,介绍一些常用的代码语言及Html标签和CSS规则的使用方法,便于优化网页样式,使整个网站风格统一,也便于对已有的网页模板进行更改,进而大大提高学生的岗位实践技能。

(2)实际案例制作教学

此板块教学采用以项目为载体、以任务为驱动的教学方法。教师可以引入实际项目或者虚拟项目,提出项目名称和项目要求,辅导学生进行实际案例设计。实际案例制作教学应充分强调实用性和自主性,教学环节可分三步进行。首先是教师示范环节:教师要根据实例要求演示创作过程,从网站创意草图到制作静态界面;从创建站点到Dreamweaver网页布局,创建超级链接;从美化网页样式,到制作网页特效,利用简单的代码语言和Flas实现动态、实时、交互的页面效果教师应将每个创作环节一一展示,并将知识点设计应用到整个案例实际操作中去,做到知识点与案例有效融合,案例之间能承上启下,有机衔接。其次为学生设计环节:学生可以根据老师的思路对经典案例进行学习和分析,依据实际任务的要求,进行网页设计实际操作。其间遇到问题学生可以相互讨论,或求助教师解决难题。在整个讲课过程中,教师指导为辅,学生对案例进行学习和分析为主,充分发挥学生的主观能动性。要求学生充分发挥创意性思维,从被动学习转换为为了实现项目目标而进行多渠道主动学习,提高学生学习效率,缩短和实际岗位间的操作差距,进而为走向社会奠定基础。最后为展示评价环节:学生对自己的作品公开演示汇报,并鼓励别的学生对其作品评价,找出优劣点,好的保留,差的改正。教师根据作品质量和学生评价对作品打分,以此作为该生整门课程成绩的一个依据。

网页界面设计论文篇(11)

中图分类号:TP393文献标识码:A文章编号:1009-3044(2011)04-0779-03

1 感性化网页界面设计

1.1 界面设计的发展

界面设计的概念首先是在西方国家提出来的,而且存在了很长的时间,发展到今天己经有了一套自己成熟的理论和实践经验,韩国和日本对于网页界面设计的研究已经走在这方面研究的前端。虽然感性的人机界面设计成为设计领域的焦点,其理论主要用在产品界面设计,在历年研究生的论文中,大多是从网页界面设计的色彩、存在的形态及学科相关性方面阐述、或者只是网站建模,很少将理论与设计实践相结合来研究。人机界面设计的一个细小分支:网页人机界面的感性化设计在国内还处于起步阶段。

1.2 感性工学

上个世纪80年代末在日本出现了感性工学的课题和研究。感性工学(KanseiEngineering)是界于设计学、工学及其他学科之间的一门综合叉学科。“感性”是一种主观的难以用文字来描述的心理体验,它是一种认知的概念,受个人知识、经验和个性的影响,是个性化的认识。同时感性也是直觉与理智相互作用的结果,感性对美的、情趣的事物特别敏感。对于设计者而言就是把消费者脑海中的构建法则探寻出来,通过破译消费者的感受,再利用这些探寻出来的法则去进行设计,这就是感性工学设计的首要任务。

1.3 感性工学与界面设计的关系

首先从指导思想上讲,感性工学设计的出发点是考虑人的感受即以人为本。从人的角度度上考虑问题高于一切,因为设计的目的就是为了让产品更好的为人服务。只有以人的感受作为基础和原始资料,以“以人为本”作为指导思想,从人的感受方面去寻找设计灵感,才能保证设计符合使用者的需求,这是设计的源头也是设计的动力。其次从设计周期方面讲,基于感性工学的网页界面设计方法论精简了传统的设计理念的步骤,设计程序不再那么复杂。对设计过程的精简不仅提高了设计效率,简化了繁琐的设计流程,而且从根本上解除了设计师在思想上的束缚,使设计更加灵活。最后,从设计结果上讲,它避免了许多不必要的或者是重复的信息设置,无论是布局还是内容,每一个小细节都来自用户的真实感受,都经过设计师的深思熟虑。由基于感性工学的网络形象设计理念设计出来的“产品”应该是符合用户群体需求,符合市场需求的。网页界面设计发展到现今的阶段,功能合理,适用有效或是有某种外在的美感已经不再能满足网页用户的需求了,感性化网页界面设计已经成为设计的必然。在网页界面的设计过程中,研究用户是其最基础的一个环节。为了提供自然和直观的网页界面,我们就需要表现出以用户和交流为向导的新的设计方法。对于用户来说,用恰当的文字和语言来表达自己的“感性”并不是一件容易的事情,设计师就更难辨别出产品的哪些属性可以唤起人们的何种感性,以及人们的感性是如何随着产品属性的改变而改变的,在更多情况下,人们的感性并不只由某一种产品属性决定。感性工学,因其运用科学先进的现代工具和技术,可以帮助消费者表达自己的感性,甚至是一些他们自己都没有意识到的情感,设计师可以准确便捷地获取消费者基于产品和概念的特性的主观评价,取得消费者对于产品的潜在感受和需求。感性工学除了是可以运用的设计上的工具,更是可以辅助设计师弄清人们感性的利器,从而可以针对不同消费者和消费群体的感性需求,设计出不同的产品造型,在客户满意度与设计制造成本之间取得一个平衡点。

2 少儿网页界面感性化设计现状调查

本文以常用少儿网站新浪少儿网,希望谷,迪斯尼中国站为例,分析目前的少儿网站感性化设计发展现状,为下文的研究提供数据依据。

2.1 数据来源及其分析

这项研究分别从用户和网站角度进行研究。通过对用户的调查,可以得到用户的体验,以及从用户的角度得到对网站的评价,并且可以发现网站中存在的一些问题。通过对少儿网站的调查,可以了解到网站中吸引用户的重要因素,以及用户对网站的评价,从而为网站的设计提供建议。

2.1.1 问卷调查

问卷调查是以书面提出问题的方式搜集资料的一种研究方法。研究者将所要研究的问题编制成问题表格,以邮寄方式、当面作答或者追踪访问方式填答,从而了解被试对某一现象或问题的看法和意见,所以又称问题表格法。在各种调查研究当中,所得结果是否达到调查的目的和要求,以及所搜集到的资料的可靠程度和完善程度都取决于调查问卷设计水平的高低,在可用性研究中,问卷调查可以用来了解用户的满意度和遇到的问题,也可以根据客户服务的反馈,实际使用的记录或实地测试的方法来了解用户的实际使用情况。 问卷调查方式可以得到在特定的情况下对使用网络的体验,比如少儿上网是为了娱乐,结交朋友还是还是其他,可以得到在这个使用范围内的精细的用户需求。本次调查的用户对象是深圳地区少年儿童。由于深圳是个移民城市,来深建设者来自全国各地,人口多样化,少年儿童也都是来自全国各地,从而使得调查的数据人口广泛而具有代表性。在问卷调查的这个环节里,我们的主要目的是发现少儿网站用户浏览网站的目的,浏览网站过程中的喜好,期望得到什么,这些期望是如何满足的,或者为什么没有满足。在知己知彼网发表调查问卷,再通过学而思教育机构将将网站公布给深圳五区各小学,每个区都有学生作答问卷,网站对调查问卷的结果进行统计分析,由于篇幅有限只列举部分问卷结果,问卷调查大多为多项选择题。从图1可以看出,少年儿童浏览网站时的目的有70%以上是娱乐。

图1 学生浏览网站的目的 图2 网站吸引用户因素调查

从图中可以看出人们在浏览一个网站的时候,喜欢一个网站的原因74%的人表示是因为娱乐;浏览网站的目的学习与娱乐的需要各占一半;有50%的人是被这个网站的内容所吸引;大多数的用户喜欢清新,可爱,卡通的界面风格;44%的人认为目前的网站学习资源比较少,同时35%的人认为网站不容易操作,只有65%的人表示在三次以内就能熟练操作一个陌生的网站;59%的人表示容易找到需要的内容;大多数少年儿童希望能够将资料年级分类以便查找; 59%的人表示希望能够在线互动;大多数人喜欢网站提供展示自己才艺的平台;从目前网站存在四个比较严重的问题,这个问题分别是网页弹出广告,出现错误的信息,网页打开慢,网页内容更新慢,这四个方面比较严重的问题也是我们今后网站设计改进的方向。

2.1.2 文案法

文案调查以收集少儿上网的文献性信息为主,具体表现为各种文献资料,可以通过网络搜索,少儿报纸杂志和报纸来收集相关信息,尤其是通过网络,可以从更宽广得角度来获得更多地有关少儿上网的知识。它可以用来发现少儿上网的问题并为研究提供重要参考依据。这些收集来的数据无法直接使用,需要经过加工才能使用,整个过程对调查者的要求比较高。

2.1.3 启发性测试

为了得到用户深层次的体验,我们以”新浪少儿网”,”希望谷”,为例对用户进行启发性测试,在整个过程中从各个方面进行测试,整个界面测试涉及17个问题.比如,发现其中的三个比较严重的问题是:打开网站时弹出广告,这一点是用户非常反感的。还有一个问题就是网站不容易操作,而有的用户发现网站不容易操作之后就几乎放弃再次进入该网站.还有一个问题是,当孩子遇到不会的问题时,没有老师在线答疑,甚至没有留言等功能,也就是说这样的网站缺少互动功能。

3 少儿网站感性意向分析

3.1 设计原则与方法

可用性的设计观念采用的是逆向式推理感性工学的方法,它将设计的重点放在用户对真实产品的体验上,通过对“体验”的观察和总结对产品进行不断的修改和纠正,最终达到“可用性”的目的。

感性网页界面设计必须把重点放在以用户为中心,从用户的需要和用户的感受出发,设计符合用户需求的网页界面,而不是让用户来适应界面,从而使界面友好使用。以用户为中心的设计(UCD)是一种关于产品/系统设计过程的方法论,这个方法论以使用产品系统的人的信息为基础。无论产品的使用流程、产品的信息架构、人机交互方式等,都需要考虑用户的使用习惯、预期的交互方式、视觉感受等方面。UCD过程通过产品的计划、设计和开发聚焦在用户身上,整个过程包含了以人为中心的活动,它贯穿于产品开发的整个生命周期。

一个好的以用户为中心的设计方法包括以下三个维度:效率,效能,用户在特定环境下使用产品的满意度,满意度包括产品的易用性,吸引用户的程度,用户使用完产品后心理层面的感受。在感性设计的过程中,捕捉用户的感性需求是感性网页界设计的最为重要的一步。以少儿网站为例,通过以用户为中心的感性工学方法提取出少儿网站设计的感性意向。具体从以下三个方面着手:

1) 调查网站和浏览者背景信息。

2) 选择具有代表性的网站进行研究,从而得到用户体验。

3) 分析统计实验得来的数据,并将其转化成可设计因素。

3.2 少儿网站感性意向分析

每一种类型的少儿网站都有自己的优势,综合考虑影响访问量的因素有以下几点:网站用户群体的定位、网站页面的可用性、网站页面的易用性、网站页面的交互性。除此之外,还有一些小细节的设计也能影响用户的感受,比如网站的注册流程繁琐且填写过的内容不能被存储记忆,这就会让用户感到异常的烦躁不安。基于上述的调查,得出少儿网站形象设计应该简单,可爱,易用,这才符合少年儿童的心理发展,符合使用需求。

阶层分析法

感性工学的阶层类别分析法是根据新产品的感性层面来进行分析和分类,以建立产品的感性结构来获取设计细节,因此主要运用在新产品的开发过程中,将运用阶层类别分析法研究出的某种产品属性决策归纳采入到新产品设计中去。在阶层类别分析法操作过程中,首先要对目标产品做一个感性市场的调查。调查主要收集来自于各种渠道的信息,如用户访谈、市场调研、报刊网络资料收集等。在此之后,着重的是研究小组成员间的想法表达与充分讨论,通过讨论凝聚成一个产品概念作为0阶感性概念。考虑到0阶感性概念的抽象性及难懂性,将其转译成稍微具体的1阶感性概念就很有必要了。研究人员采用层次递推的方法,将用户对产品的感性认识范畴向下拆解形成1阶感性概念。接着再由1阶感性概念逐次逐步层次分解推论子概念,每一个衍生子概念再分别向下拆解展开成树状结构。假如设计团队无法从某一阶层得到具体的设计细节部分,则将继续往下拆解,直到能够得到出现物理量的细节设计的详细说明的阶层(作为“N阶”)为止,最终获得符合感性诉求的产品设计物理特性,作为产品开发的基础。这个“感性――物理特性”的树状图关系,就是贯穿阶层类别分析法的一条主要脉络。

捕捉用户的感性体验是是一个网站成功的关键地方,从调查设计中的几个常用的网站看都缺乏这方面的设计。将少儿网站的调查研究结果利用阶层分析法,我们将少儿网站的设计定位于以用户为中心,通过娱乐性,易用性,美观性,交互性四个一次感受来体现以用户为中心的0次感受。比如,一次感受中的娱乐性,又是通过趣味性和可玩性的二次感受来体现的。因为少年儿童的心理具有特殊性,所以内容不能严肃和呆板,要让网站达到寓教于乐的目的,内容要充满童趣,少年儿童对外在的世界还充满无比的好奇,所以开发交友功能来满足他们的好奇心。再将1次感性继续细分,经过N次感性化后最终得出物理上的设计细节。这样我们就将过去难以量化、只能定性的、非理性无逻辑可言的感性反应,转化为设计要素。少儿网站感性树状图如图3所示。

4 结论

通过对以上几个网站的感性设计现状调查 ,再将调查的结果运用感性工学方法得出感性意向树状图,得出一下几点结论:1)增强少儿网站的娱乐性,少儿上网的目的性不是很强,网站的内容要达到寓教于乐的效果;2)增强少儿网站内容易用性,少儿处于接触网络的初始阶段,操作的简易性符合少儿用户心理;3)界面应该卡通化充满童趣,这样才能符合儿童的审美;4)增强网站的交互性可以从数据库方面来考虑,再就是网站的的功能,提供在线问答,问题反馈功能能增强网站的可性度,也是吸引和留住用户的一个重要方面。树状图的具体物理设计细节就是将浏览用户的感性体验转化成了具体的设计细节,这样的设计符合用户需求,达到了少儿网站感性化设计的目的。

参考文献:

[1] 方惠敏,杨国胜,丁文珂.基于人性化网站界面设计的用户建模[J].计算机技术与发展,2008(2):187-190.

[2] 钟厦,宋晓晨,孙亚云.感性工学中量化的基本程序介绍[C]//2005年国际工业设计研讨会暨第十届全国工业设计学术年会论文集.北京:机械工业出版社,2005:728-731.

[3] 梅云.感性设计:人机界面设计新思维[J].科技资讯,2008(9):217.

[4] 徐晓莉.基于感性工学的网络形象设计理念研究[D].济南:山东大学,2008.

[5] 吴洁.设计艺术学[D].上海:上海交通大学,2007.

[6] 刘增.以用户为中心的网络界面设计研究[D].南京:南京航空航天大学,2007.

[7] 李立新.感性工学-门新学科的诞生[J].艺术生活,2006(3):71-73.

[8] 罗仕鉴,潘云鹤.产品设计中的感性意向理论,技术与研究进展[J].机械工程学报,2007(3):8-13.