《电脑平面设计》网络课程开发——关键技术及工具软件的应用.doc

《《电脑平面设计》网络课程开发——关键技术及工具软件的应用.doc》由会员分享，可在线阅读，更多相关《《电脑平面设计》网络课程开发——关键技术及工具软件的应用.doc（14页珍藏版）》请在得力文库 - 分享文档赚钱的网站上搜索。

1、电脑平面设计网络课程开发 关键技术及工具软件的应用教育技术学专业2003级 戴 烨指导老师 何 亭【摘 要】本文基于目前教学需要，严格依照网络课程的要求，通过电脑平面设计网络课程的实际开发流程、开发过程中所要做的准备和实际工作，初步论述了网络课程开发所使用的关键技术和工具软件，以及所能实现的相关功能。 【关键词】网络课程；关键技术；工具软件【Abstract】Based on the current needs of teaching and curriculum in strict accordance with the requirements of the Web-based Cours

2、es . through computer graphic design course of the actual Web-based Courses development process, the development process to be done in the preparation and practical work, Initial expositions of the Web-based Courses used curriculum development of key technologies and software tools, and what can be

3、achieved-related functions. 【Key words】Web-based Courses; Key technologies; Software tools引 言现在计算机及网络的速度是越来越快、作用越来越大，教育向网络化、个性化、终身化和国际化方向发展的趋势日益明显，学与教的关系和方式正在发生变革。代表教育信息化发展水平的网络课程才是当今信息时代教育真正实现资源共享、发展个性、自主学习、终身学习和提高信息素养的必然选择所谓网络课程就是通过网络表现的某门学科的教学内容及实施的教学活动的总和。它包括两个组成部分：按照一定的教学目标、教学策略组织起来的教学内容和网络教学支撑

4、环境，当然其中网络教学支撑环境特指支持网络教学的软件工具、教学资源及在网络教学平台上实施的教学活动。网络课程除了应具备课程的一般特点和要求以外，它还作为一种网络教学资源，具有良好的交互功能，能让学习者在网络环境下进行人机交互学习；能为学习者提供方便、快捷、经济的资源共享方式；能使教师随时更新教学内容和教学信息，也使学习者可以对课程的教学内容和教学资源进行重组和改造；能使学习者按照一定的教学目标和要求，采取适当的学习策略，进行网上教学活动，并在网上进行自主学习评价，获得反馈信息；还能使学习者不受时空的限制，与其他学习者和老师进行交流等。基于Internet网络的学习系统具有非常广泛的应用前景。我

5、的毕业设计是开发网络课程电脑平面设计，开发网络课程涉及到教学内容、素材准备、学习环境设计等环节，本文就开发过程中运用到的关键技术和工具软件进行论述。一、电脑平面设计网络课程的结构体系电脑平面设计网络课程由网络教学和后台管理两大部分构成，其中教学环境部分主要分为如下功能模块：登陆注册、课程内容、学习社区、学生博客、资源仓库、经典赏析、作品展示、休闲一刻、电子笔记、教师介绍和修改资料等组成；后台管理部分分为：系统管理、学习资源管理、学习交流管理模块，具体结构体系如图1所示。教学环境部分注册登陆界面过客留言教师介绍修改资料经典赏析学生博客学习社区课程内容资源仓库电子笔记休闲一刻作品展示网站地图学习帮

6、助新闻公告课程简介学生注册学习帮助网站地图后台管理部分学习资源管理作品展示管理经典赏析管理资源仓库管理作业管理试题管理系统管理学生管理修改资料退出登录学习交流管理电子邮箱学习社区Blog管理图1：“电脑平面设计”网络课程的结构体系（一）教学环境1登陆模块在这个平台上，我们设定了两种登录身份，分别是学习者、教师或管理员。教师或管理员在前台页面上拥有除学生一样的权限外，还能对学生的作业进行在线打分，同时可以对展出的作品进行教师评价（而学生只能做学生评价）。 游客（未注册用户）通过此界面可了解本网络的课程简介、新闻公告、学习帮助、过客留言等内容，如果游客对此课程感兴趣，想学习此课程，就需要进行登陆。

7、如图2所示图2：“电脑平面设计”网络课程的登陆界面2其他模块1）课程内容、经典赏析、资源仓库、休闲一刻、电子笔记模块：学习者能对整个课程有个全面的了解。通过该模块，学习者能学习到这门课程的所有知识点。这些模块学习者在学习课程内容的时候，可以做作业，上传作业，记笔记，浏览下载参考资料、欣赏经典作品等。界面如图3所示。图3：“电脑平面设计”网络课程的学习模块界面2）学习社区、学生博客、作品展示、教师介绍模块：实现学习者和教师、学习者和学习者之间交流的功能，是师生进行网络课程交流学习的空间。在这部分模块中，主要可以分为三方面的内容，教师对学生的评价、学生对课程的评价、师生之间的交流、学生之间的交流。

8、教师对学生的评价主要有教师对学生作业的在线打分，和对其中优秀作品的评语。学生对课程的评价可以通过课程信箱或者可以在学生社区中发表自己的想法，当然也能在自己的BLOG空间中发表文章。师生交流就主要通过教师的电子邮件和网站的BLOG平台实现，在这个平台下学生能自由地发表文章，发表自己喜欢的作品等也可以对其他同学或者老师的文章、作品进行点评。在这个平台下学习者可以根据不同的爱好创建自己的群组，在这个群组下，可以单独的进行讨论（和QQ群一样），还有就是在这个平台下可以对学习内容进行分类别的发表意见和讨论，在这里我们将BLOG界面展示如下（图4）。图4：“电脑平面设计”网络课程的BLOG界面（二）后台管

9、理1系统管理此模块对系统的正常运行起着非常重要的作用。系统管理员可以通过查看登录日志、系统配置，进行用户管理，发布公告等，来维护网络课程的正常运行。2学习资源管理此模块用于教师对学生作业、学生作品、经典作品，试题进行管理，包括对其内容的添加、修改和删除。3学习交流管理此模块为教师对师生之间和学生之间的交流进行管理，对信息有添加、修改和删除的功能。二、开发电脑平面设计网络课程的关键技术电脑平面设计网络课程是动态网站应用程序，其开发过程中主要应用到两大关键技术：动态网站数据库的设计与编程以及利用JavaScript进行网页编程。（一）数据库与Web的交互ASP（Active Server Page

10、s）是IIS提供的一种动态网页技术，它能够将HTML文本、脚本命令及ActiveX组件混合在一起构成ASP页，实现对Web数据库的访问。当用户使用浏览器访问ASP网页时，Web服务器响应，调用ASP引擎来执行ASP文件，并解释其中的脚本语言，通过ODBC连接数据库，由数据库访问组件ADO（ActiveX Data Objects）完成数据库操作，最后ASP生成包含有数据库查询结果的HTML页面并返回用户端。ASP是通过统称为ADO（ActiveX Data Objects）的对象模块来存取数据库，无论是采用Access、SQL Server、Visual FoxPro、Informix、Ora

11、cle、dBase或其他数据库，只要该数据库具有对应的ODBC或OLE DB驱动程序，ADO对象就能加以存取。如图6所示：ASP网页ADO对象OLE DB 或 ODBC数据库驱动AccessSQL其他数据库图5：ASP网页、ADO对象、数据库间的关系ADO组件由七个对象和四个集合组成。其中，最重要的是Connection、Command和Recordset三个对象。Connection对象用于创建应用程序和数据库之间的连接，Command对象用于定义数据库的操作，而Recordset对象则包含了从数据库中查询到的结果集合。 在ASP中通过ADO访问数据库，一般要通过以下四个步骤：1.创建一个到

12、数据库的Connection；2.查询一个数据集合，即执行SQL，产生一个Recordset；3.对数据集合进行需要的操作；4.关闭Connection。（二）JavaScript功能JavaScript是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性能的脚本语言。使用它的目的是与HTML超文本标记语言、Java 脚本语言（Java小程序）一起实现在一个Web页面中链接多个对象，与Web客户交互作用。从而可以开发客户端的应用程序等。它是通过嵌入或调入在标准的HTML语言中实现的。它的出现弥补了HTML语言的缺陷，它是Java与HTML折衷的选择，具有以下几个基本

13、特点： 1、是一种脚本编写语言JavaScript是一种脚本语言，它采用小程序段的方式实现编程。像其它脚本语言一样,JavaScript同样已是一种解释性语言,它提供了一个简易的开发过程。它的基本结构形式与C、C+、VB、Delphi十分类似。但它不像这些语言一样，需要先编译，而是在程序运行过程中被逐行地解释。它与HTML标识结合在一起，从而方便用户的使用操作。 2、基于对象的语言。JavaScript是一种基于对象的语言，同时以可以看作一种面向对象的。这意味着它能运用自己已经创建的对象。因此，许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。 3、简单性JavaScript的简单性主要

14、体现在：首先它是一种基于Java基本语句和控制流之上的简单而紧凑的设计, 从而对于学习Java是一种非常好的过渡。其次它的变量类型是采用弱类型，并未使用严格的数据类型。 4、安全性JavaScript是一种安全性语言，它不允许访问本地的硬盘，并不能将数据存入到服务器上，不允许对网络文档进行修改和删除，只能通过浏览器实现信息浏览或动态交互。从而有效地防止数据的丢失。 5、动态性JavaScript是动态的，它可以直接对用户或客户输入做出响应，无须经过Web服务程序。它对用户的反映响应，是采用以事件驱动的方式进行的。所谓事件驱动，就是指在主页(Home Page)中执行了某种操作所产生的动作，就称

15、为“事件”(Event)。比如按下鼠标、移动窗口、选择菜单等都可以视为事件。当事件发生后，可能会引起相应的事件响应。 6、跨平台性JavaScript是依赖于浏览器本身，与操作环境无关，只要能运行浏览器的计算机，并支持JavaScript的浏览器就可正确执行。从而实现了“编写一次,走遍天下”的梦想。 实际上JavaScript最杰出之处在于可以用很小的程序做大量的事。无须有高性能的电脑，软件仅需一个字处理软件及一浏览器，无须WEB服务器通道，通过自己的电脑即可完成所有的事情。综上所述JavaScript 是一种新的描述语言，它可以被嵌入到 HTML 的文件之中。 JavaScript语言可以做

16、到回应使用者的需求事件 (如： form 的输入) ，而不用任何的网路来回传输资料，所以当一位使用者输入一项资料时，它不用经过传给伺服端 (server)处理，再传回来的过程，而直接可以被客户端 (client) 的应用程式所处理。 JavaScript 和 Java 很类似，但到底并不一样！ Java 是一种比 JavaScript 更复杂许多的程式语言，而 JavaScript 则是相当容易了解的语言。JavaScript 创作者可以不那么注重程式技巧，所以许多 Java 的特性在 JavaScript 中并不支援。三、开发电脑平面设计网络课程工具软件的选择与功能实现以上的两大关键技术都需

17、要工具软件的支撑，下面就来介绍一下开发本网络课程所选择的工具软件，及其结合关键技术所实现的一些功能。（一）工具软件的选择高效地进行网站应用程序的开发与调试，还要为网站的建设选择一些合适的开发工具，本网络课程主要的开发工具如下：1网页制作工具Dreamweaver Dreamweaver是Macromedia公司推出的主页编辑工具。它是一个所见即所得网页编辑器，支持最新的DHTML和CSS标准。采用了多种先进技术，能够快速高效地创建极具表现力和动感效果的网页，使网页创作过程变得非常简单。值得称道的是，Dreamweaver不仅提供了强大的网页编辑功能，而且提供了完整的站点管理机制，可以说，它是一

18、个集网页创作和站点管理两大利器于一身的创作工具。利用Dreamweaver中的可视化编辑功能，用户可以快速地创建页面而无需编写任何代码。不过，如果用户更喜欢用手工直接编码，Dreamweaver还包括许多与编码有关的工具和功能。并且，借助Dreamweaver还可以使用服务器语言（例如ASP、ASP.NET、JSP和PHP）生成支持动态数据库的Web应用程序。2图形图像处理工具PhotoshopPhotoshop是Adobe公司推出的功能强大的平面图形图像处理软件，也是迄今为止世界上最畅销的图形图像编辑软件。Photoshop性能优越且使用方便，现已在图像编辑、桌面出版、网页图像编辑、广告设计

19、、婚纱摄影等各行各业广泛应用，且已成为许多涉及图像处理的行业的事实标准。3网页动画开发工具FlashFlash是Macromedia公司开发的一款优秀的网页动画开发软件，从简单的动画到复杂的交互式Web应用程序，它使用户可以创建任何作品。通过添加图片、声音和视频，可以使Flash应用程序媒体丰富多彩。Flash包含了许多种功能，如拖放用户界面组件、将动作脚本添加到文档的内置行为，以及可以添加到对象的特殊效果。这些功能使Flash不仅功能强大，而且易于使用。最吸引人的还是Flash作品SWF文件体积小，并且可以以插件的形式加入到网页中，通常几分钟的复杂动画才几百KB，是目前网络中最常用的动画格式

20、。4数据库工具Access 在基于微软IIS/PWS的网络平台上，通过服务器端，运行ASP程序来访问后台数据库，是一种最常见的模式了。而对于小型的数据库应用需求，微软的Access数据库，应该是与ASP程序配套使用的首选。由于Access数据库的ODBC驱动程序支持的SQL指令全，执行效率高，所以Access后台数据库+ASP服务器端程序+客户端IE浏览器，是一个精练实用高效的组合模式。（二）功能实现 下面通过运用Dreamweaver和Access软件结合动态网页技术，对电脑平面设计网络课程中两个功能作简单介绍。1登陆注册功能（1）conn.asp 是建立链接到数据库的Connection（

21、2）login.asp(部分)：实现登陆功能 If Enable_Cookies = 1 Then Response.cookies(systemkey)(userid)=rs(username) Response.cookies(systemkey)(userpassword)=rs(userpass) Response.cookies(systemkey)(usergroup)=rs(usergroup) Else Session(SystemKey & User_ID)=Form_UserName Session(SystemKey & User_Group)=Rs(UserGroup)

22、 End If Rs(LogonCount)=Rs(LogonCount)+1 Rs(LastLogonTime)=NowRs.updateAction=OKturnto kcjj/kcjj.asp 登录正确，跳转到网络课程课程简介elseResponse.write alert(用户名或密码错误！);history.go(-1); Response.endEnd If（3）register.asp（部分）:不允许学生用教师帐户（admin和administrator）注册Sub SaveUserForm_UserName=Request.Form(username)Form_Password

23、=Request.Form(userpass)Form_Sex=Request.Form(sex)Form_Email=Request.Form(email)If Form_UserName=adminor Form_UserName=administrator ThenMsg=此用户名学生不可用！-学生不能注册教师帐号！Exit SubEnd If2.课程内容中树型导航功能实现（1）其页面效果如图6：（2）其tree.js代码如下：var tree_node=new Array(2,教学大纲,3,jxdg.htm,2,教学日历,3,jxrl.htm,main,0,教学内容,3,-1,0,第一

24、部分,3,-1,0,第一章,3,1-2/1.html,-1,2,第一节,3,1-2/1.1.html,2,第二节,3,1-2/1.2.html,2,第三节,3,1-2/1.3.html,1,0,在线测试,3,./kaoshi/index.asp,5);document.write();document.write(TD.Tree_FOLDER_1height:0pt;padding:0pt 5pt 0pt 2pt;);document.write(TD.Tree_FOLDER_2height:0pt;padding:0pt 5pt 0pt 2pt;);document.write(TD.Tre

25、e_FOLDER_3height:0pt;padding:0pt 5pt 0pt 2pt;);document.write(TD.Tree_FILE_1height:0pt;padding:0pt 5pt 0pt 2pt;);document.write(TD.Tree_FILE_2height:0pt;padding:0pt 5pt 0pt 2pt;);document.write(TD.Tree_FILE_3height:0pt;padding:0pt 5pt 0pt 2pt;);document.write();var tree=new Tree_treeView();tree.useI

26、mage=false;tree.useTitleAsHint=true;tree.useTitleAsStatus=true;tree.useHint=false;tree.useStatus=false;tree.showSelect=true;tree.showLine=true;tree.Indent=13;tree.folderImg1=treeimg/clsfld.gif;tree.lineFolder=treeimg/;tree.folderImg2=treeimg/openfld.gif;tree.fileImg=treeimg/link.gif;tree.target=main

27、;tree.folderClass1=Tree_FOLDER_1;tree.folderClass2=Tree_FOLDER_2;tree.folderClass3=Tree_FOLDER_3;tree.fileClass1=Tree_FILE_1;tree.fileClass2=Tree_FILE_2;tree.fileClass3=Tree_FILE_3;Tree_buildTree(tree_node,tree);四、总结随着计算机多媒体和网络技术的发展，网络具有的强大的交互性和分布性的特点更加为学生的个性化学习提供了技术实现的可能。因此，网络教育功用的开发日益受到广大教育研究者和教师的

28、关注，而网络课程一方面作为网络教育的一种资源，另一方面作为一门独立的课程，正在呈现蓬勃发展的趋势。网络课程不可能完全取代课堂教学，但对于中国这样人口众多，高校相对较少，高等教育普及率较低的国家，网络课程必将成为学校教育、全民教育的重要渠道。网络课程的优点在于它释放每个学生的学习能力，发挥群体的学习力量，提供丰富的教学资源给学习者选用，教学形式由原来的以教为主变为以学为主。本次通过电脑平面设计网络课程的设计和开发，初步作了一次有效的尝试。在今后的发展中，如何开发和构建完善的网络课程仍然是一个值得去不断研究和探索的课题。参考文献：1 谢幼如 柯清超.网络课程的开发应用M.电子工业出版社2 龙马工作

29、室.ASP+Access网站开发实例精讲M.人民邮电出版社3 林蓉华,黄堂红,黄河明.基于Web的现代教育技术网络课程的设计与开发J.现代远程教育研究.2004年2期/总70期 P52-55页4 孙宇.Dreaweaver Photoshop Flash Fireworks Javascript 网页制作大讲堂M.人民邮电出版社5 （美）蒙克尔（Moncur,M）.Javascript入门经典M.人民邮电出版社致 谢经过几个多月的忙碌和工作，毕业设计已经接近尾声，由于经验的匮乏，除了自己的不断尝试、探索之外，老师的亲切指导、同学的密切合作都是难得宝贵的体验。在这里首先要感谢我的导师何亭老师。何老师平日里工作繁多，但在我做毕业设计的每个阶段，从选定论文题目到资料的采集，设计草案的确定和修改，中期检查，后期详细设计等整个过程中都给予了我悉心的指导。其次要感谢的是和我一起做毕业设计的另外2名同学，我们一直在一起设计开发这个网络课程，大家一直都很团结。在遇到困难的时候，我们仍然不离不弃，各自尽自己最大的努力克服问题。正是这样的精神，此次设计才得以顺利的完成。然后还要感谢大学四年来所有的老师，为我们打下扎实的专业知识基础；同时还要感谢所有的同学们，正是因为有了你们的支持和鼓励。此次毕业设计才会顺利完成。最后感谢新传院和我的母校扬州大学四年来对我的大力栽培。