首页 > 文章中心 > 正文

网站设计的实训教学研究

网站设计的实训教学研究

实训教学的对象主要针对完成网站设计基础课程,即掌握了pho-toshop基础,对网页布局基础、div+css布局较熟练的学生,其重点是创作思路和设计表达上的培养,课程分为四个阶段进行(教学周18周,周课时10节):

第一阶段:模块化设计(4周)此阶段采用案例教学法与讨论法相结合,从网页组成细节元素着手,使大家掌握网页元素如按钮,导航条,栏目模块的特点和特效表达。以按钮教学为例,准备一组优劣对比的按钮,首先让学生谈谈2个素材带来的情感感受,引导学生分析作品的优劣势,提高审美感;其次让学生分析元素构成,高光阴影的配合等,提高技能。最后教师演示按钮的实现步骤,并要求学生根据步骤完成练习。为了便于学生课后复习,辅以课堂录像方式,将案例实现的整个过程展现给学生,对学生提交作品采用互评和点评的方式,集体演示作品存在的共性问题,帮助学生不断提高。该阶段主要让学生了解细节对于整体的重要性,养成精雕细琢的设计习惯,培养自我耐性,提高审美能力,能正确的分析自己作品优劣不断修改加以提高。

第二阶段:banner设计(6周)一个网站的好坏,很大程度上由banner决定。从人的视觉流程来说,打开一个网站,用户第一眼看到的是最为显眼的网站banner区域,此区域是否有冲击力,直接影响用户对网站的好坏的判断。网页设计的审美需求是对平面视觉传达设计美学的一种继承和延伸。两者的表现形式和目的都有一定的相似性,把传统平面设计中美的形式同现代网页设计的具体问题相结合,运用平面设计中美的基本形式到网页中去,增加网页设计的美感和大众的视觉审美需求,因此分配6周的时间用于banner设计教学。本阶段教学目的是为了强化学生对banner的理解以及进一步培养审美感,提高banner中文字,背景,产品,素材等各元素的表达能力。前文提到,典型网站设计的含义就是遵从各行业网站所需表达的内容,因此在实训教学过程中,将常见的典型网站分为金融篇、网络篇、消费品篇、公益篇、服装篇、淘宝店铺篇、电子产品篇、化妆品篇、游戏篇等,针对每个篇章都以真实商业项目为案例,精心设计2-3个banner。Banner设计阶段主要针对色调的掌控、明暗对比、背景的处理、素材的选择、文字的选用、变形、排版等方面。此阶段也可能遇到这样的问题:通过老师的引导分析能够完成一个案例,但表达出来的banner往往很平淡。针对这个特点,在分析,演示、练习、评价和作业互评的基础上,更加注重对处理技巧的讲解与辅导,同时辅以大量练习,使学生在牢固技术基础的前提下,达到量变到质变,从模仿到创作的蜕变。通过这一阶段的训练,学生对一个题材的表达会得到提高,知道从哪些方面着手分析,加入哪些元素,适合什么主色调,素材如何选择,字体如何搭配。通过多看,多想,多练的磨练,即多看:多欣赏一些好的作品;多想:思考人家的表达方式,配色模式、文字处理方式;多练:就是进行大量的练习,从而达到美工到设计师的转变。

第三阶段:整体页面设计(6周)为了增强页面的可阅读性,合理性,恰当地运用与搭配页面各要素间的色彩,在完成了前2个阶段的强化训练后,进入整体页面设计培训阶段。该阶段加强了整体排版的设计,在课程设计上,首先根据不同的行业需求进行页面规划,传授整体型,流式排版,左中右排版,特殊型排版,综合型排版等不同排版形式表达的重点,让学生站在用户的角度考虑,了解作为用户最喜欢、最关注的栏目,给用户有价值的信息,完成重点、次重点的划分,并从网站的统一性,一致性着手,完成二、三级页面的设计。最后用div+Css排版,并控制页面大小30k左右,保证浏览速度,从而完成一个完整的网站。通过这阶段完成6-8个整站设计,构思、素材选择、整体设计、子页设计、综合排版、整站布局各个流程全程参与,达到独自设计完成的实训目的。

第四阶段:自主命题设计(2周)进入项目准备、答辩阶段,在这2周,学生充分发挥自己的想法,设计一个主题网站,不少于5个页面,并实现html。最后进行全班演示答辩。通过这一阶段的强化练习,提高学生设计能力,锻炼学生的表达阐述、随机应变能力。网页设计是一门新兴的设计和网络的交叉学科也是一个感性的学科,更注重动手能力,创新能力的培养。一个成功的网页设计,不单单是美工设计那么简单,它包括了心理学,生理学,平面构成,色彩构成等多方向的知识,观念上要确立独立的思维方式,要有效地将设计元素引入网页设计之中,只有了解并可以很好的运用这些知识,我们设计出的网站才能增加人们浏览网页的兴趣,才能更好的为受众服务。所以除了技能,学生的创新能力和情感表达能力是非常重要的,只有这样我们才能帮助学生成为一个真正的设计师,才能培养出真正的能适应岗位的综合型人才。

作者:张晓颖单位:重庆正大软件职业技术学院