首页 > 文章中心 > 网页界面设计论文

网页界面设计论文

网页界面设计论文

网页界面设计论文范文第1篇

摘要:如今我们处在一个视觉信息泛滥的年代,人们希望作为视觉信息主体来源的网络能够做到简洁、明快,这样信息传递的效能才越来越高。本文先从简约主义的概念入手,继而结合网页设计发展现状指出其对简约主义理念应用的潮流来阐明网页界面简约主义设计的概念及其特征。文章总结了简约主义设计理念下的网页界面设计的基本要求。在此基础上,结合现实网页设计实践,指出了简约主义计理念下网页界面设计的误区,为网页设计工作的开展指明了方向。

关键词:简约主义设计理念;网页界面设计

一、简约主义设计理念的由来及概念

春秋战国时期,哲学思想家老子提出“少则多,多则惑”。在西方古希腊时期,哲学家柏拉图用简单及少来论述立方体。这说明简约主义的应用在远古就已经有存在的形式。世界建筑史上的现代主义运动催生了简约主义理念。理论上,现代主义是功能主义与简约原则的结合。20世纪初,英国的“工艺美术运动”让简约设计理念登上历史舞台。19世纪60年代的工业革命大大地解放了劳动力,通过使用新兴机器,批量生产使得生产规模扩大,但不合格的材料和不过关的技术,使得整个工业系统混乱不堪,建筑行业的设计破败粗糙、庸俗至极。而后以莫里斯为主要代表发起的“工艺美术运动”迅速在发展,他否定机械化和装饰过度的设计风格,倡导诚挚的、真实的兼顾功能的设计。此次运动奠定了现代主义风格的基础。现代主义提出设计以功能为中心和目标,倡导非装饰的简单几何造型。简约主义设计理念的正式提出则追溯到建筑大师米斯・凡德罗提出的著名的“Less is more”的设计原则和理论,所以简约设计的理念最早源于世界建筑设计随后波及了产品设计、平面设计、室内设计、首饰设计和家具设计等领域各行各业纷纷开始追求简约主义设计理念。由于地域文化差异,也对简约主义的审美存在一定出入,简约设计理念上也就会存在差异。极少主义、白色派等,其从本质上说,追求的都是简约的设计风格,是简约理论的具体体现。

“简约主义”顾名思义就是最基本的元素呈现,倡导摒弃所有多余色彩,结构,图形和其他装饰素材的设计方法。简约主义的设计理念目的是为了是设计内容更加突出于其余一切辅助物让核心内容成为聚焦点,其中心思想是设计内容中最基本的设计元素。

二、网页界面设计简约主义理念潮流

(一)简约主义网页设计的概念

网页界面采用简约主义理念来指导其界面设计的最终目的是提升用户体验,如果只注重外观的简约还不注重网页信息传递的快速有效,那也还是不能提升用户体验。简约在网页界面设计中是一个相对的概念,简约主义设计不是泛滥和随意。网页界面的简约是对网页信息架构进行合理的安排,而其精髓隐藏在架构背后,简单明了高效地向用户传达他们的目标信息。如果用户使用网站不能快速搜寻到他们想要的信息,会使得顾客不想停留在网页界面,那么这将导致客户流失。其次,通过简化设计元素也能在视觉上精简设计使得信息主次分明。Google产品设计的副总裁玛瑞莎梅尔(Marissa Mayer)对此做过一个形象的比方,她认为简约的网页界面设计首先就像一把“合上的瑞士军刀”,Google网站的简约外观是出于用户体验,用户通常只能记住一个网站的7至9个功能,对16个以下的关键词留有印象,因此要在这个范围内充分考虑用户的需求和特点。而许多其它的网站,其栏目和功能繁杂,更像是一些“打开的瑞士军刀”。[1]

(二)简约主义在网页界面设计中的体现

首先,简约主义理念指导网页界面的设计能简化我们想要向用户表达的核心思想,合理隐藏或删减不必要信息,或者说合理地对网页信息进行重要层级排序,让用户快速获取网页信息。用户在进入网站后,他们大都是会以浏览而不是阅读的方式搜寻他们需要的信息。所以在网页界面上,我们应该尽量将我们希望用户首要获取的信息至于网页焦点上。

其次,简约主义理念指导网页界面的设计能减小对用户的视觉干扰。简约主义的一个核心思想就是合理隐藏和删减不必要的信息,而为了达到这一目的,留白是一种行之有效的手段。在网页中的空白也是一种设计元素,留白的位置就像一种虚空间。这种虚空间不是毫无意义的,正是有了这种空间,才能够使观者疲劳的视觉得到缓解,能够使作品展现出唯美的意境,利用空白给用户留下一个无尽的想象空间,能够使作品更具有视觉张力[2]。通过对网页信息的合理规范与删减,我们在网页设计中应用简约主义进行指导能提高网页信息的传导效果

(三)简约主义是网页界面设计的潮流

自密斯定律“少即是多”的提出,简约主义的设计理念广为受众喜爱。它摒弃了一切无关的要素和多余的浪费,以轻快、简明的设计风格一击即中用户诉求。现今我们处在一个视觉信息泛滥的时代,我们越来越重视所谓的“软设计”,如界面、交互、服务系统等。人们希望作为视觉信息主体来源的网络能够做到简洁、明快,这样信息传递的效能才越来越高。

简约主义作为一种行之有效的表现形式,其艺术性也很高。在网页界面设计过程中运用简约主义来进行指导们,可以达到网页界面同时具备可用性和艺术性。用户在浏览网页的过程中不但可以得到良好的用户体验而且还有绝佳的审美体验。在如今节奏的生活状态下,人们渴望回归本真,摒弃多余和繁杂,而简约快主义的设计理念正好符合人们所需。

三、简约主义设计理念对网页界面设计的原则

(一)合理取舍

简约主义的设计风格核心目标是去除多余元素、色彩等,追求简明清晰的网页效果,高效地向用户传达有用信息,将用户的视觉中心点引导到关键信息上,聚焦网页的关键信息点。这里所说的合理取舍含义是为了强调,简约主义理念不代表去除一切,尽量简化,而是我们在网页界面设计中要学会合理取舍,将重要信息优先曝光在用户的视觉世界里,相对不重要的信息我们可以隐藏或者去除,做到在保证网页可用,好用的前提下,为用户减负,提升用户体验,让用户在使用网页浏览信息或获取信息的过程中成为一种享受,而愿意长时间停留在网页界面。在合理取舍中,我们要关注的具体信息包括有:网页的色彩、设计元素、文字的精简、还有版面的留白处理手段等。例如,人们在浏览一个网页出现大量可以视作无效信息的文字时,他们大都一扫而过,不会在网页上阅读,因为他们会觉得这样的大段文字他们宁愿在纸质上阅读来的轻松。又例如,对于浏览一个没有丝毫留白,排版布局密密麻麻的网页,用户会觉得根本无从下手,一个页面如果什么信息都想强调必定什么信息都强调不了,对于我们希望用户真正首页了解的信息,我们可以在网页留白的情况下,将要突出的信息曝光于空白背景下,着重提出来,然后一步一步引导用户获取后面的重要信息。

(二)简单清晰地组织视觉要素

在进行网页界面设计时,在简约主义的指导下我们也应该简单清晰地组织好视觉要素。我们应该对网页界面信息进行合理的分类、组合、删减。将网页信息进行分类是为了用户在浏览网页时能快速把握网页结构,迅速找到关键信息。减少类别,合理组合和删减不意味网页信息含量减少,只是把关键的有效信息布置在一个相对简单的布局中。在组织视觉要素过程中我们可以通过构建一个简明清晰的首页开始,其次配色不宜过多、除了品牌要求应尽量做到简洁明快。

(三)网页各界面风格统一

网页界面层级众多,我们应该做到保持网页各界面风格保持统一。用户通过首页或者网页链接进入网页界面的任意层级,如果各界面风格不统一必定影响对网页信息的认知和解读。统一的界面风格能够加强用户的记忆和认知,提高用户搜寻他们想要地信息的效率。对于界面风格的统一,我们应该做到同样元素位置和大小尽量保持一致,配色方案整体保持一致,同类别的设计元素风格保持一致等等。

四、简约主义设计理念下网页界面设计的误区

在对网页进行界面设计的过程中,容易出现一些只在乎形式不在乎功能的过度或者错误表现,在此简要阐述下简约主义设计理念下网页界面设计的误区。

首先,简约主义容易被理解极端化而造成为了简化而简化,忽视网页功能性,光有亮丽的外表,反倒使得用户体验变差。不考虑用户浏览网页获取信息的认知过程,而是简单追求网页简约主义设计的“简化”版式原则,必定踏入误区,那么网页界面设计必定低效致使无效。

其次,简约主义在现今收到各界认同和追捧,设计师们容易误入“非简约不设计“的境地,仅仅在字面意思上理解“简约主义”,盲从简约主义理论,妄想颠覆网页设计的基本原则,而致使网页界面设计概念化。

五、结语

网页界面设计中应用简约主义来指导不是简单简化元素,而是合理规划与取舍界面元素,对于网页界面设计来说,设计师应该理解为用简约主义来指导网页设计是一种提升用户视觉体验和提升网站可用性的有效途径,是以“用户为中心”的。我们应该多多学习国内外简约主义风格网页设计的成功案例,认真对简约主义理论概念进行学习,把实践和理论结合起来形成自己的设计观,不断发展总结简约主义的网页界面设计实践方法与原则,提升网页界面的用户体验。(作者单位:中南大学建筑与艺术学院艺术设计系)

参考文献:

网页界面设计论文范文第2篇

关键词:格式塔 网页设计 视知觉

引言

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

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

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

1.图与底

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

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

2.简明原则

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

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

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

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

3.接近原则和相似原则

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

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

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

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

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

结语

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

参考文献 :

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

[2]卡尔·考夫卡著,黎炜译.格式塔心理学原理.浙江教育出版社

网页界面设计论文范文第3篇

【关键词】: 网界面;设计;应用;体验;

1、网页界面设计的现状和问题

近年来,随着网络的广泛普及,网站已然成为人们吸收了解外界的载体,人们通过上网浏览网页便可以做到足不出户就可以获得所需要的信息和物品,网购行业也随之快速的发展起来,这是因为网页可以承载图片、色彩、文字等多种元素,能够提供给浏览者足够的信息,方便了人们的生活。但是网页设计迅猛发展的同时,也产生了整体水平良莠不齐的问题:1.信息多且杂乱无序,把相关的信息和元素全部罗列出来,不分层次和重点,没有规范性,有多少内容就挤多少内容,使浏览者难以快速找到所需信息;2.喧宾夺主的设计,使用花哨的图案作为背景,干扰读者的视线。有些网站为了追求视觉的冲击力,放一些绚丽的,风格各异的图片,导致网页调性不统一,整体性差;3.一味的追求视觉美感而忽略网站的实用性,凸显不出产品的优势和特点,缺少与浏览者的互动性。视觉效果固然重要,但是一味的追求视觉效果是否真的能够提高网站浏览量和产品销售量?

我认为网页界面设计应该符合美观性和实用性双重要求。简约主义下的网页设计已经不能单纯的追求信息承载量,有一些网站把企业简介、企业荣誉和资质,全都展现在一级页面的位置,长篇大论的写公司的优势获得的荣誉,希望消费者一下子就能够了解自己的公司实力,反而将消费者更加关注的各类产品和主要信息模糊放在在一起,看似信息多了丰富了,效果却恰恰相反,这让很多消费者很难在网站里快速找到所需的信息,浏览者更是不会看长篇的介绍,这不仅没有让消费者了解自己,还会引起消费者的反感导致销量减少。简约主义下的网页设计也不能够单纯的追求色彩,绚丽画面,过多的颜色会扰乱消费者的视线,找不到重点,反而体会不到视觉的美感,从而降低了用户体验。

2、简约主义在网站设计中的应用(结合苹果官网分析)

简约主义源于是20世纪西方现代主义,欧洲现代主义建筑大师与设计大师米斯・凡德罗所提出的“少即是多”的理论,换句话说就是把设计简化,强调它本身内在的东西。这一理论被称为简约主义的核心。当今社会,人们工作强度高,节奏快生活压力大,人们需要一种可以互补的东西来调节神经高压。简约主义以简洁的表现形式来满足人们对产品那种感性的、本能的和理性的需求,符合了当今人们快节奏、高效率和高审美的要求,越来越多的设计师把眼光放在了简约主义风格的设计上,网页设计在简约主义风格的影响下也发展迅速。以苹果官网为例,苹果公司一直追求简而精的风格――简约主义风格。自乔布斯iPhone4,苹果官网界面设计风格越发简约。苹果官网新推出的产品――苹果7为例,风格依旧遵循着简约风格,整个页面除了黑色,找不到其它的色彩,网页上没有放置很多的文字内容,也没有很多绚丽的图片和色彩,通过极致的黑色和几根流畅的线条充分的展现出苹果7的简约奢华和精致,一张满屏幕的产品大图不用长篇文字的描述就已经让人感受到苹果公司强大的实力,这种简约风格的形式远比那些人们从不会去阅读的长篇大论更有力量!更有说服力!更加吸引浏览者的眼球!大大增强了消费者的购买欲望。然而单纯的追求简约主义设计风格,简约的画面和几张高精大图就是提高网页浏览量和销售量的关键吗?显然不是。

3、简约主义风格下如何与浏览者产生互动,提高用户体验

简约的画面只是网站设计最终显示出的效果,在网站设计过程中不仅仅只是考虑网站设计的画面效果,当然画面效果也很重要,但更重要的是要考虑消费者和浏览者在浏览网页的时候能否产生良好互动和用户体验。在简约主义风格下,如何才能与浏览者产生互动,提高用户体验呢?1.增加细节的设计。细节决定成败,网页设计也是如此。2. 建立清晰的视觉信息导向,使浏览者在众多同类产品中能够快速明确的定位所需要的信息。

简约主义下的网页设计不是空洞的,单调的而是让人感受舒适、放松的设计。简约主义风格的网页设计细节处理是非常重要的。如何才能做到网站设计细节丰富,版式简约,有内涵而不繁琐,有形式而又实用呢? 以云米官网为例,云米净水器网页设计综合了视觉、布局、交互综合设计方法。用扁平化的图标设计代替了人们看不懂的数据表格,因为产品特点和优势不仅仅是一句话就能够让人信服的,需要用人们能理解的语言展示出来,才更有说服力。用图片的形式展示产品结构更清晰更加直观,从视觉上提升了科技感和冲击性。将实用性与美观性相结合,画面更加简约,细节处理更加丰富,更加吸引浏览者的眼球。让消费者看到这样的产品就产生一种感觉――买!

良好的可用性和清晰的视觉信息导向引导消费者快捷简便的定位到所需要的信息,增强用户的体验。网页信息筛选也决定了消费者浏览网页所耗费的时间,云米官网一级页面展示了品牌故事,超能净水器,超能滤芯,全屋净化以及生活周边。当浏览者鼠标放在所需要的类别时,网页在一级界面自动拉出小的产品框,方便消费者快速找到所需要的产品。二级页面直接的展示出产品以及产品细节各类信息,高清晰、高品质产品细节图更加具有吸引力,让人一下感受到产品的品质。

结论

当下,国内网页仍存在着很多的问题,在简约主义风格的带动下越来越多的设计开始关注并且完善网页设计的美观性与实用性的结合,以提高客户体验和互动性为目标,用简明易懂的图形文字组合代替长篇的数据,把“简而精”的概念融入到网页设计中去。

【参考文献】:

网页界面设计论文范文第4篇

关键词:平面设计;网页设计;课程教学;改革

随着“互联网+”国家策略的大力推进,我国社会发展急需大量优秀的互联网人才,而网页设计人才是互联网人才的重要组成部分。为了配合国家战略实施,目前国内各大高校纷纷把网页设计设置为平面设计专业高年级学生的必修课程。然而,随着近年来平面设计高等教育的不断扩招,以往的课程体系和教学方法已无法满足当代和未来社会对网页设计人才的要求,而忽视市场需求的人才培养模式也会使人才培养与市场需求间的距离越来越大。所以,对平面设计专业网页设计课程教学的探讨十分重要。

一、教学现状分析

平面设计教育在我国起步虽晚,但发展迅速,其人才培养方法备受各方关注。网页设计是一种新兴的数字艺术,它的创意取决于企业的文化属性和互联网的特色,它是一种附属于互联网、融合艺术与技术的新型设计形式,它的界面设计从平面设计入手,内涵却远远超出了平面设计概念,既要注重界面中的平面构成元素,又要考虑用户体验,还要注重各页面链接的空间关系和视觉协调性,从而成为具有互联网特征、综合性的平面设计。目前,国内各大本科院校多依据所属专业确定网页设计课程的教学侧重点。计算机类的侧重代码编程,注重培养网站后台人才;艺术类的侧重界面规划和美化,致力于培养网站前台、网页美工。但各专业在网页设计课程教学上主要存在以下两种现象:一是“轻维护、重美观”,培养出的学生多注重静态页面的艺术性,不在乎是否有利于后台维护;另一种是“轻线下、重线上”,部分学生往往只在意屏幕的视觉效果,对线下互联网用户的需求了解不够。这导致他们设计的网页界面看起来很漂亮,链接也很流畅,但实用性不强,更不利于线下产品的开发。因此,对平面设计专业网页设计课程教学进行改革势在必行。

二、教学内容的调整

对于平面设计专业网页设计课程教学中出现的问题,首先要从教学内容上进行调整。新的教学内容调整为艺术理论课程和软件实践课程两大模块。

1.艺术理论课程模块

艺术理论课程模块的知识点分为三部分:网页设计的功能元素、网页交互设计、网站品牌形象的美学塑造。网页设计的功能元素是网页界面设计的基础元件,了解功能元素的特点、作用及各元素之间的相互关系,对网页设计工作起着至关重要的作用。网页设计的功能元素有背景与底纹、按钮与控件、页眉与页脚、导航器和目录、功能板块和广告位等,这些功能元素依靠文字、图片、色彩、多媒体和超级链接实现。这些功能元素的形式语言设计遵循传统平面设计的设计原则,又和传统平面设计有很大不同。如,传统平面设计多以印刷为最终呈现方式,作品尺寸是固定数值,而网页设计是以用户的显示器为最终呈现载体,所以作品的宽度不宜超过显示器宽度,高度可以任意,但只能显示一屏的高度,随着浏览者拖动滚动条,作品的显示高度随之变化。用于传统平面设计中的色彩在输出过程中是以印刷色CMYK形式出现的,而网页设计中的颜色是RGB模式,是标准的光色。因此,教师在此部分教学中不但要传授网页设计各功能元素的作用与特点,还应该指出它们与传统平面设计中相对应元素的异同,让学生在区别中学习。交互设计是网页设计最为重要的功能设计。交互设计源于工业设计的概念,原来的平面设计专业教学中没有交互设计的内容,为了更好地让教学内容与市场接轨,在调整后的教学内容中新增了这一知识点。此部分教学内容包括用户体验研究、层级结构设计、流程设计等,通过模拟用户上网实际操作进行分析,找出用户的关注点,确定网站特色和栏目,将站点ID、栏目、实用工具、搜索引擎等交互设计元素和平面设计知识结合,将功能设计教学落到实处。品牌化建设是企业视觉形象设计的延续和拓展。和大多数线下公司一样,优秀的网站也需要塑造品牌形象。从企业文化和性质入手,树立准确而独特的网站品牌形象,有利于企业在互联网上从同类公司中凸显出来,提高上网者对该企业网站的浏览兴趣,增强上网者的浏览记忆,促进该企业的宣传推广。在艺术理论课程模块教学内容中应渗透品牌形象概念,将此概念应用到网页设计的各个环节之中,无论是网页LOGO、网页色彩还是版式和导航等设计,都应该保持品牌形象的一致性。

2.软件实践课程模块

软件实践课程模块包含两部分:“新网页三剑客”和常用简单代码识别。Fireworks、Dreamweaver、Flash是传统意义上的“网页三剑客”,过去网页设计的教学基本是对它们的学习。这虽然具有普遍性,但对不同专业学习的针对性不强。结合平面设计专业学生现有软件掌握情况(Photoshop是平面设计专业学生必修基础软件,多数学生已掌握它的基本操作技巧),把此部分内容调整为“新网页三剑客(Photoshop+Dreamweaver+Flash)”的学习。简单地说,就是根据界面规划草图,用Photoshop制作出精美的静态界面效果图,并在此基础上再次利用Photoshop软件进行切片、优化和输出Html文档,用Dreamweaver进行版式美化处理和超级链接设计,最后用Flash做特效替换,最终做出具备跳转链接功能的动态网页设计效果图。平面设计专业最终制作的网页设计作品需要软件工程师根据动态效果图代码编程上传,这样才能更好地在互联网上呈现。为了更好地与后台工程师沟通,把动态效果图设计得更准确,网页美工师需要了解一些常规编程代码知识,但平面设计专业学生多是文科生,数学和英语的掌握水平普遍不高。对此,在代码教学内容上应选取一些常用的、简单的代码语言,并结合Dreamweaver的Html标签和CSS规则的使用方法,利用框架,对现有模板进行优化和美化,提高网页设计动态效果图的实用性。

三、以项目教学方法为载体,提高学生的实战能力

为了提高学生的实战能力,将社会项目、经典案例引入课堂教学,并分层次逐级深入。

1.第一级:精选案例、分解任务阶段

教师应该根据学生的特点和网页设计所需掌握的相关知识点,精选典型实际案例,引入教学环节。分解项目到每一个知识点,边教边练,将实践和理论有机结合,并逐一讲解。教师选择的案例要具有吸引力、综合性,能涵盖知识点,案例不需要多,两三个即可。教师在讲授案例时应强调学生的主体地位,对学生进行引导和解惑,遵循由浅入深、由易到难的原则,以具体分解任务作为驱动,进行教、学、练的课堂活动。此阶段应激发学生自主学习的兴趣,培养他们独立自主分析、解决问题的能力和实践能力。

2.第二级:项目分工合作阶段

此阶段将学生分成若干设计小组,几个小组共同承担一个项目,每组在项目中的任务各不相同,各小组分工协作,大家共同制订项目计划和实施方案,推举大组长为项目总负责人,负责最终方案的定稿和项目材料的整理。在项目设计的整个环节中,每个小组拥有充分的自,大大地调动了学生的积极性。各小组成员共同面对随时出现的问题,合作完成任务。这样的交流过程使每名学生都能参与项目设计活动,提升自主学习能力。在这种交流中,所有学生的思维碰撞出火花,产生新的创意,大大提高了学生的创造激情和探索冲动,加强培养了他们的团队协作能力,为他们以后步入社会打下了基础。教师在这个阶段应该全程监控,引导学生自主解决问题,表扬优点,发现不足,汇总各个组项目实施中的共性问题,对共性问题所涉及的理论知识与软件操作集中补充讲解。

3.第三级:对接社会、校企合作阶段

平面设计专业网页设计课程教学改革的最终目的是为社会输出合格的互联网网页设计人才,更好地服务社会。对此,平面设计专业网页设计课程教学对接社会、加强校企合作就显得尤为必要和重要。学校应该根据自身特点选择合适的企业建立教学实践基地,聘请企业网页设计骨干作为指导教师参与网页设计课程实践教学。学校也可以组织部分优秀学生组建设计团队,成立工作坊,工作坊可以按照企业模式管理、运营,承接校外的网页设计项目。此阶段教学培养学生的社会接轨能力,为学生对接社会提供条件,将企业文化和行业规范引入教学,实现校企无障碍对接,真正将理论教学与实践教学有机结合在一起。在计算机信息技术飞速发展的环境下,平面设计专业网页设计课程更要紧扣时代的脉搏,求实创新,不断地更新和丰富教学内容,结合市场发展趋势创新教学方法,及时将最新案例和相关知识点引入课堂,最终培养出满足“互联网+”国家战略实施需要、具有综合素养的网页设计高级应用人才。

参考文献:

[1](美)贾森•贝尔德.完美网页的视觉设计法则(第2版).石屹,译.电子工业出版社,2011.

[2]范双南,李希勇,万宏辉.现代设计基础——21世纪艺术设计专业规划教材Dreamweaver网页设计.北京工艺美术出版社,2009.

网页界面设计论文范文第5篇

关键词:网站;网页;交互

互联网信息时代的发展为网站设计及网站中的人机界面交互设计提供了前所未有的发展空间,越来越多的软件和互联网公司开始重视网站中的人机交互和用户体验在产品中的重要作用。而网站中的用户界面是用户和网络产生接触的第一个窗口,对于互联网产品的用户体验以及访问量、注册量、销售额甚至成本等都有至关重要的影响。

在一个网站中,网页上的可交互元素,包括页面上的按钮、链接、文本框等,更应合理设计才能带来好的页面交互性。那么如何提高网页的交互性呢,主要是要注意以下几点。

1 注意网站的链接、按钮和LOGO

一个网站的链接和按钮都应该符合用户的使用习惯。目前链接文字通用的表现方式是字色蓝色并带下划线的文字。而按钮应当是有一定的立体感,看上去就是一个突出的按钮,一看就知道是可以点击的。而LOGO是与其它网站链接以及让其它网站链接的标志和门户。在通常情况下,通过点击LOGO可以返回到网站的首页。所以,LOGO即是一个网站的名片,LOGO更是网站的灵魂所在,除此之外它还具有一个重要的导航功能。网站的LOGO作为一个重要的网页元素,当鼠标移上去或者划过等事件,应该有相关的信息响应。

2 网站页面加载进度

网站的每个链接,包括网站的首页打开都需要时间加载的,只是某些网站功能较为简单,加载起来很快是而无需担心页面延迟。但某些网站的加载往往不能一次性完成,例如淘宝这种大型购物平台,页面有很多的商品图片,加载需要一定时间,这个时候是需要一定的响应式的,所以页面更应该给出提示,否则让用户等待太久是很不友好的做法。

事实上,有很多的因素会影响到网页初次加载的响应时间:HTML文件的文档的大小;页面中的各种元素例如代码、图片、flash、音频、视频等元素文档的大小;HTML页面的复杂程度(浏览器可以很快的展现简单的页面);用户反应的快慢也会影响浏览速度;被网页页面调用的其他内容所在的服务器的访问速度;网站的域名和外部域名的DNS的解析速度也会影响网页的加载速度;用户所使用的计算机的各种性能(如果计算机的资源消耗过多,或者配置过低,浏览器也会变得响应缓慢);服务器的配置的高低。

除了上述因素会导致网站响应的快慢以外,一些人为的因素及一些硬件也会影响网页加载的速度。例如:服务器端、客户端和网速。服务器端主要包括:服务器的地域,是否双线,处理能力等。

那么如何提高页面的浏览速度呢?采取以下几种基本的方法可以有效的提高网页的浏览速度。

(1)在不影响页面质量的前提下,尽可能的优先优化HTML代码。(在页面上传服务器之前,先去掉HTML文档中的没必要的换行标记以及注释。但为了保证页面的可读性和可维护性,注释的代码还应当保留在源代码中)。

(2)为了减少文档之间的依赖,在制作网页时页面中应尽可能少的包含其他外部引用。(可以将多个脚本放入一个脚本文件,图片处理的技术将多个小图片合并成为一个大图,这样就只需要加载一次)。

(3)把开发的网页里面的字节减少一些,把没用的字节都删了。尽量多使用div来布局网页,少使用表格布局。

(4)尽可能的定制图片及包含图片的元素的尺寸。让图片本身就符合网页的要求,这样可以尽量避免页面展现时由于图片不能一次性加载而造成页面元素跳动的现象。

(5)小脚本放在头元素中,而比较大的脚本则放在页面的尾端加载,这样页面可以在大的脚本加载完成前展示出来。如果把大的脚本放在页面的头元素进行加载,则浏览器会等到脚本完全加载完成后才显示页面内容。

3 网页中应隐藏不常用的操作

网站中不经常使用的操作可以不用突显出来,将其弱化或隐藏。例如,网站中有某个弹出层是几乎不用到的,为了不对用户造成干扰,我可以在当鼠标经过的时候才出现这个弹出层。这个是基于上文提到的不干扰用户注意力角度出发的。比如,在新浪微博中,微博的屏幕功能只有在鼠标移到对应某条微博的右上角并单击鼠标的时候才会弹出操作提示框,否则是看不到屏蔽操作的,这个就是一个隐藏操作的具体体现。

4 尽量减少弹出信息

为什么要尽量减少弹出信息呢,这里举一个例子来说明一下?当你正在看一部精彩的电影或看一本精彩的书,这时接到一个无实质内容的电话,你肯定会非常恼火。网页设计也是一样,如果能在当前页面显示完成就尽量在当前页面加载完成。对于那些弹出信息,例如弹出层、跳转页面、模态窗口等都影响用户体验。

5 网站对用户需要引导-网站导航

一个好的网站是能够让用户全面浏览,所以网站导航十分重要。每个用户在浏览页面时往往都是不确定性的、无规律的,同时用户更不喜欢选择。所以,网站需要时刻让用户看清当前的位置。如果浏览者不能快速、便捷地找到它,他们就很有可能去别的网站。例如,很多博客网站除了首页导航之外,还将分类作为第二导航放在页面的边栏。此外,网站的页脚也很重要,因为有部分用户浏览时接触到的是网站的底部,这个时候网站的页脚可以方便的让用户找到当前的站点位置。

一直以来,网页界面设计的研究主要针对于视觉方面,而设计的内容、流程和原则虚拟了实物产品的设计,基本上没有太大的改变。随着信息科技的发展和人机交互技术的成熟,交互界面的设计已经成长为一个独立的行业。本文阐述了基于增强现实的交互界面概念,分析了其突出特点,总结归纳交互界面设计的流程与原则。交互界面设计是一个全新而又复杂的研究领域,本文的研究仅仅是交互界面设计的冰山一角,如何将交互界面设计的理论特性分析清楚、理解透彻,还得依靠同行们的不懈努力和大量实践,使用户和网络的信息交流更加简便、高效和人性化。

【基金项目:本研究为校级创新团队项目:互联网背景下的图形用户界面设计研究。】

参考文献

[1] AlbertMehrabian.Analysis of the Big\five Personality Factors in Terms of the PAD Temperament

Model[J]. Australian Journal of Psychology.2011(2).

[2] 高榛.网络游戏中的用户交互设计[J].戏剧之家(上半月).2012(01).

[3] 欧阳建军.基于交互设计的界面应用研究[J].科教导刊(中旬刊).2010(04).