基于Web的网上实时交互化学练习系统的设计与实现.doc

基于Web的网上实时交互化学练习系统的设计与实现The Design And Implementation Of A Web-based Real-time Interactive Chemical Exercise System该文讨论利用CourseBuilder Extension For Dreamweaver Ultradev4等软件设计并实现通过Web浏览器进行自测、质疑以及在网上与老师、同学讨论的网上实时交互化学练习系统.关键词: 实时交互 练习系统 CourseBuilder 设计与实现1 引言网上实时交互练习系统是网络远程教学系统的重要组成部分,可以用ASP、JSP、PHP、JAVA、Java script、Vbscritp、HTML、VRML、Flash、Authorware等来开发.除Autherware不用手工编程外,其他都需制作者花很大功夫去掌握其语法及其编程思想.对于一般都有繁重的教学任务在身的学科教师来说,他们没有太多的精力去学习那些复杂的编程.而Autherware,虽然易学易用,有比较全面的交互功能和在Internet发布的流功能,但是浏览Autherware课件必须先安装一个比较大的Web插件,而且Autherware课件体积一般都较大,在目前带宽有限的情况下,其应用受到了一定的限制.CourseBuilder扩展了标准的HTML创作界面,带有一个被设计用来简化创建和测试教育Web页任务的CourseBuilder Interaction对话框,可以制作正误判断、单项选择、多项选择和一对一、一对多、单向、双向拖拽等形式的匹配练习题,制作单行、多行形式的文本输入题,实现规则排列、不规则排列的热区交互和按钮、定时器和滑动器等交互控制形式.开发者可以把以上交互方式结合起来使用,也可使用行为管理器来控制当前页面的任意或所有其他交互方式的条件和行为.而且,对Interaction对象参数的任意修改将实时地反映在文档窗口中,有助于显著地减少开发的时间.基于此,本文讨论学科教师如何以Dreamweaver Ultradev 4和CourseBuilder为主创工具,开发一个可以让学习者通过通用Web浏览器进行自测、质疑以及在网上与老师、同学讨论的网上实时交互化学练习系统.如图1所示.2 系统设计2.1 系统结构模型练习系统包括三个部分:第一部分为准实时交互练习,学生可以通过WWW浏览器做服务器中已经存放有的练习,做完后可以立刻得到对错、简短解释和总分等反馈信息.第二部分为实时提问解答,师生约定在同一个时间内上网,进行聊天室方式交互.第三部分为电子公告板BBS,学员可以把问题张贴到电子公告板上,对有代表性的问题,教师予以回答,这样其他学员也可以通过公告板看到问题的解答;教师还可向学生公布作业或教学信息,讨论课程教学的有关问题等.2.2 Web服务器的构建表1硬件 软件中央处理器 PIII 550MHz以上 操作系统 Windows2000Server+SP2主机内存 256M以上 HTTP服务器软件 Apache + PHP10/100M自适应网卡(校园网) Web BBS系统 Web聊天室系统安装完系统后给服务器设置一个固定IP地址,以后学生通过在WWW浏览器里输入这个IP地址来访问.同时打开服务器的终端管理服务和FTP服务,用作上传和管理.Apache默认安装后产生C:apachehtdocs这个目录,将FTP定向于这个目录,以后要更新练习系统,只要远程FTP上传就可以立即更新.Web BBS系统和Web聊天室系统没有特别的要求.从网下载回来后,解压放在服务器中指定的目录就可以了.Web BBS选用vBulletin(Version 2.0.0 beta 2),可从/下载.2.3 交互练习页面的制作2.3.1 软件的安装在IE地址栏中输入/software/coursebuilder/,回车,单击Download链接,如果用户已经是Macromedia Membership,输入ID和password,或者单击Become a Member,填写有关资料,单击continue,单击Macromedia CourseBuilder Extension下载链接,下载cb_dw_ud.mxp(3.08M,4.1.0版本).先安装Dreamweaver Ultradev4,启动它,单击CommandManage Extensions,单击FileInstall Extensions,选择先前下载的cb_dw_ud.mxp,单击Install,单击accept开始安装,安装完成后根据提示重新启动Dreamweaver Ultradev 插入Course Builder插件打开Objects Panel,单击common对象面板右上方的下拉箭头,选learning,打开该对象面板,单击Insert Course Builder Interactive按钮.系统提示保存网页,并弹出Copy Supported Files对话框,系统会将支持文件目录自动复制到站点中,主要包含两个目录:images存放需要用到的图形文件,scripts存放需要用到的javascript脚本文件.接着系统弹出CourseBuilder Interaction对话框,默认打开Galley(交互类型库)标签,如图2所示.一般地,在Target域中,应选择4.0+ Browsers为目标浏览器.因为CourseBuilder的绝大多数交互类型使用DHTML技术,这些技术主要被4.0以上的浏览器所支持.Category列表框中的交互方式包括:选择题(Multiple Choice,制作多项选择、单项选择),拖拽响应(Drag and Drop,在网页上将一个物体拖拽到另一个物体上,并且判断是否正确),热区响应(Explore,将网页上的某些区域设置成为可以响应的热区),按钮交互(Button,在网页上制作按钮开关,执行某些动作),文本输入交互(Text Entry,根据输入的文本进行判断),定时器(Timer,限定交互的时间),滑动器(Slider,制作滑动条)动作管理器(Action Manager,用于进行复杂的条件判断和响应).2.3.3 制作实例:一道中学化学单项选择题(1)设定General标签参数从Category交互方式目录里选择Multiple Choice,再从右边的响应方式中选择multCh_Radios,单击General标签进行参数设定.本例中我们设定了如下参数:Question Text(选择题文本)为1.某气体在近地面空气中浓度稍大时是一种污染物,而在高空却对人类有保护作用,该气体是.Judge Interaction(交互响应方式)选择when the user clicks a choice,即当用户选择了一个选项以后立即判断答案是否正确.Correct When(何时认定答案正确)选择Any correct and None incorrect,即只要有一个选项正确,并且没有不正确的选项.Tries Are Limited To(尝试次数限制)设定为3次.Time Is Limited To(限制尝试时间)设定为60秒.在本例中,将正确的响应设置为弹出窗口显示信息正确!,不正确的响应设置为再试试看?.(2)设置答案选项单击Choices标签,系统弹出答案编辑对话框.系统默认会给出4个答案,如果想增减答案,在对话框的上方有4个按钮:Add增加,Delete删除,Up将答案上移一个位置,Down将答案下移一个位置.在每个答案的右侧会有一个括号表示这个答案是不是正确选项:Incorrect表示错误选项,Correct选项表示正确选项.单击其中的答案,在下方设置这个答案的参数.按照答案的选项,依次设定所有的答案.(3)编辑响应结果选择Action Mgr标签,进入Action Manger对话框.Action Manger其实就是管理题目的判断流程.包括选对或选错后如何反应.通过调整,实现丰富多彩的反馈结果.下面是本选择题的Action动作流程:+Segment:Check Time(首先检查是否超时,+表示本片段所包含的条件和行为被折叠,-表示已展开)-Segment:Correctness(检测答案是否正确,这段流程包含在检测时间流程的里面)If Correct(如果答案正确)Popup Message(弹出消息窗口)Else If Incorrect(如果答案不正确)Popup Message(弹出消息窗口)Else If Unknown Response(如果发生未知响应)Popup Message(弹出消息窗口)+Segment:Check Tires(检查是否超过尝试次数)Action Manager可以对这些流程进行管理和编辑.答案选对或选错,评价会在弹出的对话框中显示出来,默认是一段英文.单击Popup Message,选择Edit按钮,系统弹出对话框让你修正.可以随时随地给这段流程添加动作,例如添加一个显示或者隐藏层的动作.单击Popup Message,将对话框上方的下拉菜单拉出来,显示所有的行为,选择好行为,按Add添加到Popup Message的下面.各按钮的作用是:Add添加行为,Edit编辑行为,Cut、Copy、Paste是对行为进行剪切、复制、粘贴,Rename修改片段、条件或行为的名称,Expand/Collapse展开、折叠片段.上下箭头调整被选中流程的先后顺序,左右箭头调整条件的级别.单击OK按钮,完成设置.图3是制作好的一道化学选择题.按下热键<F12>就可以在浏览器里测试了.测试无误后,存盘.2.4 上传练习页面学科教师把制作好的练习页面用FTP上传到指定的目录,如FTP:/92.练习系统的其他组成部分如Web BBS系统、Web聊天室系统,以及Web服务器的配置和网上发布、维护等工作由于涉及比较专业的网络技术,可由学校网络中心的专业人员完成.3 练习系统的进一步探讨3.1 不定项选择题的设计不定项选择题是化学考试、自测练习的常见题型.对答案的判断以及得分的计算,用其他语言或软件比较繁琐.因为它有多种情况需要判断.例如,某道A、B、C、D四个选项的不定项选择题题的正确答案是AB,那么学生的选择就会有很多种情况,如A、AB、AC、AD、B、BC、BD、C、CD、ABC等等,对应的得分有0分、2分和4分.而用CourseBuilder来做只需对A、B、C、D四个选项设置对错和分值即可.3.2 填空题的设计填空题也是化学考试、自测练习的常见题型.可以利用CourseBuilder的文本输入交互功能制作它.CourseBuilder允许设置多个关键词来对答案进行判断,同时还支持逻辑判断,使得对答案的判断更加准确.但对于较长的填空来说,练习系统的判断仍显得比较吃力,毕竟它只是检查输入文本中有没有预先设定的关键词.不过用于练习系统还可以,因为学生做完练习后查看答案时会自己对照,如果是用于考试系统则不妥.3.3 仪器组装题的设计仪器组装题是化学考试、自测练习中常见的题型,由于能够考察学生以实验能力为核心的多种能力,而越来越受重视.可以利用拖拽响应(Drag and Drop)实现实验仪器组装练习.但CourseBuilder的拖拽响应有2个地方不如Authorware的目标区响应,就是不能很方便地控制组装仪器的先后顺序和精确位置,而这正是理化实验和其他操作类练习重点考查的内容.3.4 用CourseBuilder制作练习页面的缺点及其对策3.4.1 网页源代码冗余及其减肥在动作管理器(Action Manager)中,将那些用不到的复杂的条件判断和响应删掉,以减少其源代码,使运行速度提升.还可以用网页压缩软件来进行一次压缩.3.4.2 中文乱码及消除建议网站中的所有文件最好都用英文命名,如果英文有困难,可用汉语拼音命名.如果在设计过程中用到中文,可在编辑状态下,选ModifyPage Properties,在弹出的对话框中单击Document Encoding域右侧的下拉按钮,选Simplified Chinese(GB2312)项.练习题的题干、按钮名称中的中文,最好在网页编辑状态下输入,不要在CourseBuilder Interaction对话框中输入.3.4.3 源代码保密性众所周知,HTML和Javascript的源代码不能保密.而CourseBuilder所生成的练习页面就是由这两种语言构成的,所以练习的答案也是放在源代码里面.如果不加任何处理,学生有可能通过右键查看源文件或单击IE浏览器的菜单命令查看源文件看到放在源代码中的练习答案.可以通过一些小技巧来处理,但想要彻底保密,最好用ASP或PHP等后台CGI语言来改写.(1)禁止右键菜单显示.在body和/body之间加入3:<body oncontextmenu=self.event.returnValue=false>(2)禁止除左键以外的其他任何形式的鼠标点击或组合点击.在head和/head间加入4:<Script Language=JavaScript>function click() if (event.button!=1) alert(右键功能被禁止)document.onmousedown=click</Script>(3)利用框架和跳转到错误页面.即把要保密的内容放在子框架里,这样单击IE浏览器的查看源文件只能看见主框架