李運(yùn)生， 張彥玲， 侯忠明

（1.石家莊鐵道學(xué)院土木工程分院，河北石家莊 050043；2.北京交通大學(xué)土建學(xué)院，北京 100044）

《橋梁工程》多媒體課件的開(kāi)發(fā)與研究

李運(yùn)生1， 張彥玲1， 侯忠明2

（1.石家莊鐵道學(xué)院土木工程分院，河北石家莊 050043；2.北京交通大學(xué)土建學(xué)院，北京 100044）

基于《橋梁工程》教材，利用多媒體技術(shù)，開(kāi)發(fā)制作了《橋梁工程》多媒體教學(xué)課件，使用大量的Flash動(dòng)畫來(lái)表現(xiàn)施工過(guò)程和一些結(jié)構(gòu)構(gòu)造。介紹了課件的特點(diǎn)、開(kāi)發(fā)過(guò)程及技術(shù)關(guān)鍵，為類似工程專業(yè)課的多媒體課件的研發(fā)提供參考。

多媒體；課件；計(jì)算機(jī)輔助教學(xué)；橋梁工程

多媒體教學(xué)是當(dāng)今教育發(fā)展的趨勢(shì)，尤其是近幾年計(jì)算機(jī)技術(shù)的迅速發(fā)展，為多媒體教學(xué)奠定了一定的硬件基礎(chǔ)，使多媒體教育的普及進(jìn)一步成為了可能。傳統(tǒng)的課堂教學(xué)模式是教師+學(xué)生+黑板，手段單一，限制了教學(xué)內(nèi)容的擴(kuò)充。而CAI（Computer-Aided Instruction，計(jì)算機(jī)輔助教學(xué)）技術(shù)則可將多學(xué)科的相關(guān)知識(shí)集成在一起，增加課堂教學(xué)的信息量，同時(shí)可以省去教師課堂板書的時(shí)間，是一種很有前途的教學(xué)方法。

一、《橋梁工程》課程特點(diǎn)

《橋梁工程》課程包括鋼筋混凝土橋和鋼橋兩大部分，共100學(xué)時(shí)，是土木工程專業(yè)的重點(diǎn)學(xué)位課程，主要講授橋梁的相關(guān)構(gòu)造、設(shè)計(jì)和計(jì)算，以及各類橋梁的施工方法。在授課方法上，以往采用課堂教學(xué)板書為主的形式，教師要在黑板上徒手畫出橋梁的各部分細(xì)部構(gòu)造，既浪費(fèi)時(shí)間，效果又不好，對(duì)于施工過(guò)程，就只能進(jìn)行語(yǔ)言描述，學(xué)生并不能完全理解。因此，本課程特別適于采用多媒體教學(xué)的形式，通過(guò)大量的圖片、Flash動(dòng)畫及3D視頻來(lái)豐富了教學(xué)內(nèi)容，提高學(xué)生的學(xué)習(xí)興趣。

二、多媒體教學(xué)軟件開(kāi)發(fā)概述

多媒體教學(xué)軟件本質(zhì)上是一種計(jì)算機(jī)應(yīng)用軟件，它的開(kāi)發(fā)過(guò)程和方法與一般的軟件工程有著許多相同的地方。事實(shí)證明，根據(jù)軟件工程學(xué)的理論，計(jì)算機(jī)軟件的開(kāi)發(fā)過(guò)程包括問(wèn)題定義、可行性研究、需求分析、總體設(shè)計(jì)、詳細(xì)設(shè)計(jì)、編碼和單元設(shè)計(jì)與綜合測(cè)試幾個(gè)步驟。對(duì)于《橋梁工程》多媒體教學(xué)課件的開(kāi)發(fā)來(lái)說(shuō)，總體上也要經(jīng)過(guò)以上步驟，但也有其自身的特點(diǎn)：

（1）豐富的表現(xiàn)力：多媒體課件不僅可以豐富的多媒體技術(shù)表現(xiàn)造型各異的橋梁世界，還可以對(duì)語(yǔ)言文字難以表達(dá)的受力原理等進(jìn)行模擬，更重要的是，可以對(duì)本來(lái)需要到現(xiàn)場(chǎng)觀摩的復(fù)雜的施工過(guò)程以動(dòng)畫或視頻的形式再現(xiàn)，如此等等。這樣，就使原本艱難的教學(xué)活動(dòng)充滿了魅力，大大提高了教學(xué)質(zhì)量。

（2）良好的交互性：多媒體課件不僅可以在內(nèi)容的學(xué)習(xí)使用上提供良好的交互控制，而且可以運(yùn)用適當(dāng)?shù)慕虒W(xué)策略，指導(dǎo)學(xué)生學(xué)習(xí)。一些重要的內(nèi)容可以進(jìn)行詳細(xì)講解，而一些知識(shí)可以由學(xué)生按照個(gè)人興趣選擇學(xué)習(xí)。

（3）極大的共享性：網(wǎng)絡(luò)技術(shù)的發(fā)展，多媒體信息的自由傳輸，使得教學(xué)資源在全世界交換、共享成為可能。以網(wǎng)絡(luò)為載體的多媒體課件，提供了教學(xué)資源的共享。學(xué)生在課下可以使用網(wǎng)絡(luò)隨時(shí)在線或下載相關(guān)資料，方便而靈活。

多媒體課件在教學(xué)中的使用，改善了教學(xué)媒體的表現(xiàn)力和交互性，明顯地提高了教學(xué)效果。作為實(shí)踐性很強(qiáng)的理工科的學(xué)生，多媒體課件的使用無(wú)疑使學(xué)生更能全方面、更直接地了解工程的實(shí)際問(wèn)題。

三、課件開(kāi)發(fā)過(guò)程

（一）前期準(zhǔn)備

本多媒體課件內(nèi)容囊括了《鋼筋混凝土橋》、《鋼橋》、《橋梁工程》等內(nèi)容，涉及了簡(jiǎn)支梁、連續(xù)梁、拱橋、斜拉橋、懸索橋、鋼橋等方面的問(wèn)題，需要網(wǎng)頁(yè)設(shè)計(jì)、編程、圖像處理、繪圖、動(dòng)畫制作、視頻處理等方面的技術(shù)。另外，還要對(duì)專業(yè)課的知識(shí)深刻理解，才能編排出高質(zhì)量的內(nèi)容。內(nèi)容是課件的核心，教材選擇十分重要，應(yīng)參考多本教材的內(nèi)容［1-3］，使內(nèi)容豐富多彩。

（二）資料收集

資料收集工作主要包括工作軟件的準(zhǔn)備、課件編排內(nèi)容的整理以及素材收集等。工作軟件需要以下幾類：

（1）網(wǎng)頁(yè)制作軟件：采用Dreamweaver 4.0，它不但界面友好，操作較為方面，有強(qiáng)大的站點(diǎn)管理功能，而且在代碼生成過(guò)程中不會(huì)產(chǎn)生太多的冗余代碼。

（2）動(dòng)畫制作軟件：平面動(dòng)畫使用Flash。在一般的繪圖和動(dòng)畫中，選用5.0版本，主要因?yàn)樗^小，運(yùn)行較快，可以完全滿足需要；在多媒體制作選擇MX版本，主要是它對(duì)多媒體支持較好，可以支持引進(jìn)諸如avi、mov、wmv、mp3、asf等眾多流行媒體。三維動(dòng)畫的制作選擇AutoDesk VIZ 4，格式轉(zhuǎn)換使用WinMPG Video Convert。

（3）圖像處理軟件：Adobe PhotoShop 7.0版本。

（4）文字識(shí)別軟件：漢王OCR 5.0增強(qiáng)版。

（5）文字錄入軟件：Word 2003，主要用來(lái)公式及少量文字的錄入。

在課件內(nèi)容的編排上，參考了一些有豐富教學(xué)經(jīng)驗(yàn)的老教師的教案，以教材內(nèi)容為主線，加入了一些最新的示例和研究成果。

在素材收集上，從各類相關(guān)網(wǎng)站下載了大量的橋梁圖片，及施工過(guò)程圖片，并將一些在施工現(xiàn)場(chǎng)排的施工過(guò)程照片進(jìn)行了掃描；另外，為了制作動(dòng)畫，采用CAD按實(shí)際施工圖紙繪制了大量源圖。

（三）整體開(kāi)發(fā)計(jì)劃

設(shè)計(jì)方面總的指導(dǎo)思想是：

（1）方便老師教學(xué)?？傮w設(shè)計(jì)思想是：教學(xué)內(nèi)容可以快速切換，避免多次跳轉(zhuǎn)和點(diǎn)擊；設(shè)計(jì)成框架形式，左側(cè)為各個(gè)章的鏈接，下面為各章中各節(jié)的鏈接，并且與各章對(duì)應(yīng)。內(nèi)容顯示區(qū)大小應(yīng)合適（見(jiàn)圖1）。

圖1 界面的框架結(jié)構(gòu)

（2）各小節(jié)的目錄做成仿WINDOWS資源管理器的形式，可以展開(kāi)，可以合上，此節(jié)內(nèi)容一目了然，形式靈活，結(jié)構(gòu)緊湊，教師可以有選擇地教學(xué)（見(jiàn)圖2）。

圖2 小節(jié)目錄的結(jié)構(gòu)

（3）在網(wǎng)頁(yè)里使用仿彈出對(duì)話框技術(shù)。從形式上看，類似Windows里的彈出對(duì)話框，但實(shí)質(zhì)上是不同的，是用Html里的圖層和JavaScript語(yǔ)言來(lái)實(shí)現(xiàn)的拖動(dòng)層技術(shù)，可以一次打開(kāi)多個(gè)圖層，可以任意拖動(dòng)，使用十分方便，并且沒(méi)有當(dāng)點(diǎn)擊鏈接或拖動(dòng)時(shí)圖層時(shí)瀏覽窗口跳動(dòng)的問(wèn)題（見(jiàn)圖3）。

圖3 拖動(dòng)層的使用

（4）使用模板。格式可以統(tǒng)一，大大減少了代碼數(shù)量。模板定義了可編輯區(qū)、格式，各小組可以很方便地使用。另外，在格式或文字需要調(diào)整或變動(dòng)時(shí)，并不需要對(duì)大量的網(wǎng)頁(yè)逐一進(jìn)行調(diào)整，只要對(duì)模板進(jìn)行更新即可。

（四）技術(shù)關(guān)鍵

（1）為了使用上的方便，采用了“全屏顯示”的鏈接，點(diǎn)擊可實(shí)現(xiàn)全屏顯示（按F11也可），關(guān)閉時(shí)采用ALT+F4關(guān)閉，這樣使課件既能保證在頁(yè)面瀏覽時(shí)的方便，又能增大顯示主要內(nèi)容的區(qū)域。

（2）網(wǎng)頁(yè)中拖動(dòng)層的實(shí)現(xiàn)使用了Dreamweaver里的行為（Behaviors）里的拖動(dòng)層（Drag-layer）來(lái)實(shí)現(xiàn)。但問(wèn)題是：當(dāng)拖動(dòng)圖層或“關(guān)閉”（隱藏）圖層時(shí)，即當(dāng)空鏈接觸發(fā)鼠標(biāo)事件時(shí)，網(wǎng)頁(yè)就會(huì)跳到最頂端，給瀏覽網(wǎng)頁(yè)帶來(lái)很大的不方便。原因是當(dāng)觸發(fā)空鏈接（＃）時(shí)，網(wǎng)頁(yè)會(huì)重新加載，解決辦法就是在“＃”后加上一個(gè)或多個(gè)字符，如“＃a”，“＃hhh”等，可以避免滾動(dòng)條的跳動(dòng)。

（3）在目錄模板中使用列表時(shí)，列表項(xiàng)默認(rèn)有●、○、□等符號(hào)，不美觀，用一般方法去不掉，用CSS樣式表可以換成自己想要的圖標(biāo)。

（4）在Flash中如果不用動(dòng)作指令雖然也可做出簡(jiǎn)單的動(dòng)畫，但這些動(dòng)畫不是交互的，有些過(guò)程甚至不能實(shí)現(xiàn)。如果要想實(shí)現(xiàn)一些特殊的過(guò)程或在動(dòng)畫播放時(shí)控制其運(yùn)行，這就要用到動(dòng)作指令進(jìn)行高級(jí)編程。利用Actions可以在動(dòng)畫播放過(guò)程中對(duì)事件或信息做出處理或做出反應(yīng)，利用這種特性可以創(chuàng)建功能較全的界面元素，如控制滑標(biāo)、發(fā)送按鈕、程序菜單等等。我們?cè)诰W(wǎng)頁(yè)中使用的一些Flash導(dǎo)航條中使用了Actionscript的“getURL（）”等方法可以實(shí)現(xiàn)諸如全屏、在特定位置打開(kāi)新窗口等。

（5）為了讓學(xué)生不用去現(xiàn)場(chǎng)而能直觀地、多視角、全方位地了解一些典型橋梁的結(jié)構(gòu)，采用3D建模技術(shù)，對(duì)上承式拱橋和中承式拱橋進(jìn)行建模，并渲染輸出為視頻。由于橋梁模型結(jié)構(gòu)的復(fù)雜性，在視頻制作時(shí)著重考慮以下幾個(gè)步驟：（a）預(yù)先定義二維幾何模型和相關(guān)的幾何拓?fù)潢P(guān)系；（b）材質(zhì)的使用及三維模型的轉(zhuǎn)換；（c）生成三維線框模型及視頻的輸出；（d）Flash播放器對(duì)視頻的控制等。

四、課件的特色

本課件和其它同類課件相比，有自己的特色，主要體現(xiàn)在以下幾個(gè)方面：

首先，在表現(xiàn)效果上注重與實(shí)際效果結(jié)合。在設(shè)計(jì)期間多次在多媒體教室進(jìn)行測(cè)試，找出顯示器顯示效果與投影機(jī)顯示效果的差別，不斷進(jìn)行修改，以期取得最佳的效果。

其次，注重實(shí)際教學(xué)效果。在內(nèi)容編排時(shí)參考多種教材，力求找到最佳的編排方式，并考慮到教學(xué)的需要，參考了教師的教案，并適當(dāng)應(yīng)用于教學(xué)，在教學(xué)過(guò)程中發(fā)現(xiàn)問(wèn)題，進(jìn)行必要的修改，以適應(yīng)教學(xué)需要。

再次，注意表現(xiàn)形式。課件表現(xiàn)形式多樣，包含了大量的交互式的Flash動(dòng)畫、橋梁圖片、視頻資料等，能形象地表現(xiàn)施工過(guò)程，這一部分是課件制作的核心。動(dòng)畫部分主要包括橋梁構(gòu)造細(xì)節(jié)動(dòng)畫和施工過(guò)程動(dòng)畫。其中構(gòu)造細(xì)節(jié)動(dòng)畫主要通過(guò)圖文并茂的形式進(jìn)行，施工過(guò)程動(dòng)畫注重表現(xiàn)工序，并能根據(jù)需要控制播放；另外，本課件注重細(xì)節(jié)，比如使用了頁(yè)面切換效果，動(dòng)畫使用動(dòng)態(tài)載入效果，排版仔細(xì)到標(biāo)點(diǎn)符號(hào)等。

最后，課件界面非常美觀，主色調(diào)為黃綠色，色調(diào)比較柔和，給人一種溫馨的感覺(jué)，按鈕式樣采用立體，鑲嵌在背景之中，與整個(gè)頁(yè)面融為一體，整體感覺(jué)簡(jiǎn)約大方，能大大提高學(xué)生的學(xué)習(xí)興趣。

五、結(jié)束語(yǔ)

經(jīng)過(guò)長(zhǎng)期的不懈努力，本課件制作完成以后，得到了任課教師和專家的一致認(rèn)可，目前已應(yīng)用于實(shí)際教學(xué)，受到了同學(xué)們的好評(píng)。

整個(gè)課件涉及到的教學(xué)內(nèi)容豐富，信息量大，共制作Flash動(dòng)畫（包括交互式動(dòng)畫、片頭和片尾動(dòng)畫、首頁(yè)動(dòng)畫和一般Flash制作的插圖）628幅（擴(kuò)展名：*.swf）；網(wǎng)頁(yè)數(shù)量達(dá)705個(gè)（擴(kuò)展名：*.htm）；資料圖片136個(gè)（擴(kuò)展名：*.jpg）；用Word和PhotoShop處理的公式圖片數(shù)量1 002個(gè)

［1］廖元裳.鋼筋混凝土橋［M］.北京：中國(guó)鐵道出版社，1997.

［2］姚玲森.橋梁工程（公路與城市道路工程專業(yè)用）［M］.北京：人民交通出版社，2003.

［3］李富文，伏魁先，劉學(xué)信.鋼橋［M］.成都：西南交通（擴(kuò)展名：*.gif）；鏈接數(shù)量10 000余個(gè)。大學(xué)出版社，1992.

［4］高軍鋒.Adobe Photoshop 7.0經(jīng)典范例教程［M］.北京：北京希望電子出版社，2002.

［5］盧驍.Flash 4高級(jí)用戶手冊(cè)［M］.北京：機(jī)械工業(yè)出版社，2000.

The Development of Multimedia Courseware for Bridge Engineering

LI Yun-sheng1，ZHANG Yan-ling1，HOU Zhong-ming2
（1.School of Civil Engineering，Shijiazhuang Railway Institute，Shijiazhuang 050043，China 2.School of Civil＆Architecture Engineering，Beijing Jiaotong University，Beijing 100044，China）

Based on the Bridge Engineering，the multimedia CAI courseware is developed using multimedia technology.In the courseware，a large numbers of Flash Movies are used to manifest the process of construction as well as a great lot of illustrations.In the paper，the characteristics，developing process and the technique keys of the courseware are presented.

bridge engineering；multimedia；courseware；interactive

G431

A

16740386（2010）010010204

2008 11 12

李運(yùn)生（1970-），男，博士，副教授。研究方向：橋梁工程。