網(wǎng)絡(luò)教學(xué)動(dòng)畫素材的設(shè)計(jì)與應(yīng)用徐明歐陽康

【摘要】運(yùn)用動(dòng)畫的形式來表現(xiàn)物質(zhì)運(yùn)動(dòng)的變化過程、描述物體間相對(duì)位置變化或運(yùn)動(dòng)趨勢(shì)，在計(jì)算機(jī)輔助教學(xué)活動(dòng)有著積極作用。網(wǎng)絡(luò)教學(xué)環(huán)境下動(dòng)畫素材的制作是傳統(tǒng)的多媒體教學(xué)素材制作領(lǐng)域的新內(nèi)容，在遠(yuǎn)程教學(xué)資源庫、網(wǎng)絡(luò)課程及遠(yuǎn)程教學(xué)系統(tǒng)建設(shè)中作用更為明顯。我們從教學(xué)實(shí)際出發(fā)設(shè)計(jì)制作了一些動(dòng)畫素材替代部分視頻資料的使用，在教學(xué)實(shí)踐中收到了良好的效果。本文詳細(xì)介紹了Flash動(dòng)畫的特點(diǎn)及制作方法，探討了動(dòng)畫素材在課件設(shè)計(jì)、網(wǎng)絡(luò)教學(xué)中的應(yīng)用價(jià)值，具體介紹了表現(xiàn)技術(shù)動(dòng)作變化的體育教學(xué)動(dòng)畫的設(shè)計(jì)過程，并以體育教學(xué)應(yīng)用實(shí)踐為例，說明了動(dòng)畫素材在網(wǎng)絡(luò)教學(xué)中的作用。

【關(guān)鍵字】：Flash工具、動(dòng)畫技術(shù)、多媒體素材、CAI、網(wǎng)絡(luò)教學(xué)

一.引言

多媒體教學(xué)素材制作是開展網(wǎng)絡(luò)教學(xué)和設(shè)計(jì)CAI課件的基礎(chǔ)，教學(xué)素材的質(zhì)量是影響教學(xué)效果的一個(gè)主要因素。在以往的素材設(shè)計(jì)中，大多是用一段視頻圖象來表現(xiàn)實(shí)驗(yàn)過程、物體運(yùn)動(dòng)狀況等。以體育教學(xué)CAI設(shè)計(jì)為例，我們大量使用視頻圖象來表示一個(gè)動(dòng)作分解過程、或技戰(zhàn)術(shù)組合中的運(yùn)動(dòng)狀態(tài)。這種做法在教學(xué)實(shí)際中存在如下一些不足：（1）這些視頻文件儲(chǔ)存量大，占用空間多，攜帶不便，播放時(shí)對(duì)機(jī)器性能和網(wǎng)絡(luò)帶寬要求高，不能適應(yīng)目前校園窄帶網(wǎng)絡(luò)環(huán)境下的教學(xué)活動(dòng)，更不能用來開展遠(yuǎn)程教學(xué)活動(dòng)，存在著致命的弱點(diǎn)。（2）制作過程繁雜，人員及設(shè)備條件要求高。先要攝象，然后進(jìn)行視頻編輯，再通過視頻壓縮才能得到AVI或MPG視頻文件。（3）視頻圖象內(nèi)容不能修改。一旦需要調(diào)整、修改部分內(nèi)容，必須重新開始攝制、數(shù)字化及壓縮過程。

因此，研究用新的技術(shù)手段和方式來表現(xiàn)一些運(yùn)動(dòng)變化的過程，設(shè)計(jì)新型高效的、適用于當(dāng)前網(wǎng)絡(luò)環(huán)境的教學(xué)素材，是很有實(shí)際意義的。我們?cè)诔袚?dān)的"九五"國家科技攻關(guān)項(xiàng)目（96-750-03-05-02）《學(xué)校體育多媒體教學(xué)資源庫》的研制過程中，嘗試了運(yùn)用動(dòng)畫的形式來表現(xiàn)體育動(dòng)作的變化過程，替代部分視頻資料的使用，在教學(xué)實(shí)踐中收到了良好的效果，特向廣大教學(xué)人員及CAI設(shè)計(jì)工作者推薦。

二FLASH動(dòng)畫的原理及特點(diǎn)

Flash是Macromedia公司出品的一套矢量動(dòng)畫繪圖軟件，用于制作可交互的圖形動(dòng)畫。Flash動(dòng)畫不需要復(fù)雜的編程，使用工具中內(nèi)置的簡(jiǎn)單語句就可設(shè)計(jì)出互動(dòng)性很強(qiáng)的動(dòng)畫，還可在其中加入聲音。最終設(shè)計(jì)出的多媒體交互式動(dòng)畫文件品質(zhì)高、體積很小，特別適用于目前低帶寬的網(wǎng)絡(luò)環(huán)境或?qū)D形傳輸有實(shí)時(shí)性要求的應(yīng)用中，如遠(yuǎn)程教學(xué)活動(dòng)等。

2．1動(dòng)畫的基本原理

與其它動(dòng)畫設(shè)計(jì)工具一樣，F(xiàn)lash動(dòng)畫也由一系列連續(xù)動(dòng)作的圖片幀組成，由數(shù)個(gè)幀順序排列來組成一個(gè)動(dòng)畫效果。一個(gè)動(dòng)畫文件中允許有一個(gè)以上的場(chǎng)景（Scene）存在，可以設(shè)計(jì)多個(gè)動(dòng)畫劇情，以符合整體動(dòng)畫的需求，場(chǎng)景的使用使得復(fù)雜的交互式動(dòng)畫成為可能。一個(gè)場(chǎng)景中可以擁有各自獨(dú)立的圖層與幀，每個(gè)圖層所使用的幀也是獨(dú)立的。播放動(dòng)畫時(shí)，會(huì)從每個(gè)圖層的第一幀開始同步播放，每個(gè)圖層的幀將在播放時(shí)得到綜合的效果。

組成動(dòng)畫的幀中，改變內(nèi)容的幀叫關(guān)鍵幀（KeyFrame）。動(dòng)畫最基本的方法是FramebyFrame，將動(dòng)畫過程以多個(gè)關(guān)鍵幀來展現(xiàn)。事先設(shè)計(jì)好每一個(gè)工作幀畫面，在時(shí)間軸中依次插入這些幀，連續(xù)播放時(shí)就得到動(dòng)畫效果。Flash最為獨(dú)特的是它的漸變（Tweening）和任意移動(dòng)路徑（MotionGuide）技術(shù)，自動(dòng)計(jì)算生成中間圖象幀。在FramebyFrame方式下，每一個(gè)關(guān)鍵幀都是通過人工來設(shè)計(jì)，占用很多時(shí)間和精力，效果還不一定理想。而使用Tweening方式時(shí)只要產(chǎn)生第一幀與最后一幀的畫面后，其余的中間幀就交給Flash處理即可。Flash是依據(jù)時(shí)間順序，使用內(nèi)插法計(jì)算來生成一系列中間幀的，能夠制作移動(dòng)、縮放、旋轉(zhuǎn)、色彩的漸變、物件的加速與減速、設(shè)定移動(dòng)路徑等動(dòng)畫效果。整個(gè)制作過程既簡(jiǎn)單又快捷，而且產(chǎn)生的文件體積很小。Tweening方法可以實(shí)現(xiàn)起點(diǎn)位置到終點(diǎn)位置的直線運(yùn)動(dòng)，可以實(shí)現(xiàn)物件由大到小的變化過程。此外，若要使物件沿任意路徑移動(dòng)則可使用自定義路徑的方式，新增一個(gè)MotionGuide圖層，在該圖層上繪制移動(dòng)路徑，命令物件按照指定的路徑行走。

2．2FLASH動(dòng)畫的原理及特點(diǎn)

Flash集中了圖形、動(dòng)畫設(shè)計(jì)領(lǐng)域眾多軟件的精華，有著與Photoshop相當(dāng)?shù)睦L圖功能以及圖形效果處理能力，具有類似CorelDraw的矢量圖設(shè)計(jì)功能，提供了類似Photoshop等軟件劃分圖層的先進(jìn)技術(shù)。Flash工具在動(dòng)畫設(shè)計(jì)方面具有業(yè)內(nèi)領(lǐng)先的優(yōu)勢(shì)，主要有以下特點(diǎn)：

（1）支持多種輸入與輸出文件格式。Flash支持多種源文件格式，包括常見的bmp、jpg、gif、avi、wav等多媒體文件，通過Import操作可以從外部輸入這些文件，來豐富動(dòng)畫的制作。Flash輸出的動(dòng)畫格式為ShockwaveFlash(SWF)，通過Extport操作，也可以輸出為其它一些常用序列圖、動(dòng)畫格式的多媒體文件，滿足不同應(yīng)用的需要。

（2）動(dòng)畫品質(zhì)高，體積小。與通過MicrosoftImageComposer軟件制作的GIF動(dòng)畫相比，F(xiàn)lash使用的是矢量圖形，具有更高的品質(zhì)，還能嵌入以及聲音，且產(chǎn)生后的文件體積遠(yuǎn)小于GIF文件。Flash能夠根據(jù)事先定義好的物件起止位置和大小，或任意運(yùn)動(dòng)軌跡通過內(nèi)插法計(jì)算得出一系列中間幀，簡(jiǎn)化了設(shè)計(jì)周期，使得動(dòng)作變化更流暢。

（3）交互功能強(qiáng)大。Flash除了能制作交互式按鈕外，主要通過Action動(dòng)作指令和內(nèi)建函數(shù)，實(shí)現(xiàn)強(qiáng)大的交互能力。在Actions中可使用變量和函數(shù)以及If、Loop等條件判斷語句，通過自身的程序語言，就能設(shè)計(jì)非常復(fù)雜的交互式動(dòng)畫。為了提高交互性，F(xiàn)lash4.0更提供了文本輸入編輯功能，允許使用者通過輸入信息的方式控制場(chǎng)景的播放流程，并做進(jìn)一步的處理、分析和反饋。

（4）豐富的資料庫。Flash工具以資料庫的形式提供了很多種物件形態(tài)，包括圖形、群組、文字、點(diǎn)陣圖和角色圖標(biāo)（Symbol）物件，方便建構(gòu)畫面的內(nèi)容。當(dāng)動(dòng)畫中有重復(fù)使用到的物件，不論該物件在動(dòng)畫中出現(xiàn)幾次，動(dòng)畫文件中只會(huì)存儲(chǔ)一個(gè)，這樣就縮小了文件體積。我們可以把工作中經(jīng)常用到的圖案、聲音、甚至動(dòng)畫片段作為Symbol來使用，并可以自行擴(kuò)充和管理資料庫。

三動(dòng)畫素材在計(jì)算機(jī)輔助教學(xué)中的作用

動(dòng)畫設(shè)計(jì)過程相對(duì)簡(jiǎn)單，制作速度快，修改方便，不需要添置專用設(shè)備，廣大任課教師和CAI設(shè)計(jì)人員易于掌握，易于使用，方便教學(xué)一線人員設(shè)計(jì)出針對(duì)性強(qiáng)的教學(xué)素材；Flash動(dòng)畫具有品質(zhì)高，能加入聲音信息，表現(xiàn)力豐富，交互控制能力強(qiáng)大的優(yōu)點(diǎn)，可用來表現(xiàn)特定教學(xué)情景，形式生動(dòng)活潑，能夠增強(qiáng)教學(xué)效果；用Flash生成的互動(dòng)式動(dòng)畫體積很小，采用流技術(shù)邊下載邊播放，便于教學(xué)人員攜帶，也便于網(wǎng)絡(luò)傳輸；Flash生成的文件是帶保護(hù)功能的，可以加上版權(quán)標(biāo)志信息，這就維護(hù)了教學(xué)設(shè)計(jì)人員的權(quán)益，提高他們的積極性。

Flash動(dòng)畫有多種使用方法，利用Flash影像播放器可以直接在計(jì)算機(jī)上播放；可以利用Flash工具提供的多種格式文件輸出功能，生成為Gif等其它格式的動(dòng)畫或圖形序列，為傳統(tǒng)的CAI課件開發(fā)工具所使用。Flash動(dòng)畫最主要的應(yīng)用領(lǐng)域是在基于Web的CAI課件或網(wǎng)絡(luò)課程中，通過在瀏覽器上安裝Flash插件，直接在網(wǎng)頁中使用Flash動(dòng)畫。

Flash動(dòng)畫的這些特點(diǎn)，值得教學(xué)設(shè)計(jì)人員加以重視并大膽應(yīng)用，多制作一些滿足教學(xué)要求的動(dòng)畫素材。在以往CAI課件設(shè)計(jì)中有很多功能小單元，它們有多個(gè)聲音、圖形、文字組成，我們可以利用這些多媒體文件組合成矢量動(dòng)畫的形式加以封裝和保存，既減少了多媒體文件的數(shù)量，又方便對(duì)多媒體素材的管理，簡(jiǎn)化了課件的設(shè)計(jì)過程。最重要的是，利用Flash工具可以為一段教學(xué)情景設(shè)計(jì)出交互能力很強(qiáng)的動(dòng)畫素材，極具應(yīng)用價(jià)值。例如，在體育教學(xué)中，我們可以用Flash動(dòng)畫來展現(xiàn)一些動(dòng)作演化過程、投擲物體運(yùn)動(dòng)軌跡、戰(zhàn)術(shù)陣形變化等。

動(dòng)畫素材可以直接應(yīng)用在教學(xué)上，可以應(yīng)用于CAI課件的設(shè)計(jì)，也可作為教學(xué)素材庫的組成內(nèi)容，服務(wù)于網(wǎng)絡(luò)課程等遠(yuǎn)程教學(xué)形式。在基于Web的教學(xué)環(huán)境中，F(xiàn)lash動(dòng)畫更能體現(xiàn)出獨(dú)特的實(shí)用價(jià)值。

四網(wǎng)絡(luò)教學(xué)動(dòng)畫素材的設(shè)計(jì)實(shí)踐

以往，在進(jìn)行體育課程教學(xué)素材設(shè)計(jì)時(shí)，一般都是利用把錄像轉(zhuǎn)換成視頻文件的方法，這一過程很費(fèi)時(shí)間和精力。這些素材文件體積龐大而不便修改，不利于開展網(wǎng)絡(luò)教學(xué)，并且教學(xué)效果不太理想，學(xué)生不容易從連續(xù)的視頻圖象中正確分辨出動(dòng)作要點(diǎn)。我們?cè)趨⑴c體育計(jì)算機(jī)輔助教學(xué)的實(shí)踐中發(fā)現(xiàn)，體育教學(xué)的一個(gè)重要內(nèi)容是講解技術(shù)動(dòng)作的分解變化過程、與技術(shù)動(dòng)作相關(guān)的步伐或姿勢(shì)變化過程、集體項(xiàng)目戰(zhàn)術(shù)配合中的隊(duì)員位置及運(yùn)動(dòng)線路變化過程等。這些技術(shù)動(dòng)作的變化過程非常適合利用Flash動(dòng)畫技術(shù)來表現(xiàn)，我們?cè)趯?shí)際工作中設(shè)計(jì)了多種形式的動(dòng)畫，具體內(nèi)容及設(shè)計(jì)過程介紹如下：

1．運(yùn)動(dòng)步伐變化動(dòng)畫圖

先用繪圖工具畫好腳印的圖象，并把它作為一個(gè)物件來處理。為每個(gè)步伐的變化設(shè)計(jì)一個(gè)關(guān)鍵幀，復(fù)制腳印物件到這個(gè)關(guān)鍵幀中，定位好它在頁面中的位置。調(diào)整每個(gè)關(guān)鍵幀之間的播放時(shí)間間隔，以保證整個(gè)流暢展現(xiàn)整個(gè)運(yùn)動(dòng)過程，滿足教學(xué)的需要，具體作法有兩種：一是通過在兩個(gè)關(guān)鍵幀之間插入若干個(gè)普通幀，這些普通幀會(huì)繼承前一個(gè)關(guān)鍵幀的畫面，使動(dòng)作得以延續(xù)；另一種方法是用工具中的Modify指令修改速度參數(shù)，調(diào)整幀的播放速度。用這種方法，我們用動(dòng)畫來描述小學(xué)三年級(jí)靈敏素質(zhì)練習(xí)（見圖1）中的步伐運(yùn)動(dòng)順序，收到較好效果。

2．卡通式技術(shù)動(dòng)作分解圖

將每一組技術(shù)動(dòng)作（如發(fā)球、扣球、攔網(wǎng)等）分解成幾個(gè)關(guān)鍵動(dòng)作，由專業(yè)美工繪制出各個(gè)關(guān)鍵動(dòng)作分解圖，通過掃描處理進(jìn)入計(jì)算機(jī)。然后設(shè)計(jì)同樣個(gè)數(shù)的關(guān)鍵幀，每一個(gè)動(dòng)作分解圖作為關(guān)鍵幀工作畫面的內(nèi)容，連續(xù)播放即得到技術(shù)動(dòng)作依次變化的動(dòng)態(tài)效果。這種形式的動(dòng)畫在體育教學(xué)中應(yīng)用最為廣泛，適合于表現(xiàn)一般的技術(shù)動(dòng)作過程。以初中三年級(jí)跨欄跑（見圖2）為例，在我們?cè)O(shè)計(jì)的每一關(guān)鍵幀中反映了動(dòng)作變化要點(diǎn)，也反映了運(yùn)動(dòng)員向前運(yùn)動(dòng)的狀態(tài)，不僅讓學(xué)生弄清了全部技術(shù)要點(diǎn)，也讓學(xué)生了解了整個(gè)運(yùn)動(dòng)過程。

圖1．橫跨步伐圖2．跨欄跑圖3．排球戰(zhàn)術(shù)

3．圖象漸變式技術(shù)動(dòng)作分解圖

與卡通式動(dòng)畫不同的是，各個(gè)關(guān)鍵技術(shù)動(dòng)作是從專業(yè)或?qū)嵟牡匿浵駧е蝎@取的。這種處理可以增加真實(shí)感，能夠最準(zhǔn)確、最細(xì)致地表現(xiàn)動(dòng)作的變化過程，只是在制作中需要多選取一些圖象幀，才能收到平滑過渡的良好效果。我們的做法是，先將現(xiàn)場(chǎng)實(shí)錄的錄像片段通過DC30視頻壓縮捕捉卡轉(zhuǎn)換成AVI文件,然后再通過Premiere視頻處理軟件從AVI文件中挑選出若干個(gè)關(guān)鍵畫面，把他們抓取出來，轉(zhuǎn)化成JPG文件壓縮存儲(chǔ)。這樣的JPG文件都不大，20K左右。接下來利用關(guān)鍵幀的方法，將每一個(gè)JPG動(dòng)作文件引入作為關(guān)鍵幀工作畫面的內(nèi)容，連續(xù)播放即得到技術(shù)動(dòng)作依次變化的動(dòng)態(tài)效果。我們用這樣的方法制作了一個(gè)有5個(gè)關(guān)鍵幀，共含25個(gè)幀的動(dòng)畫，文件大小為86K，畫面較為清晰，體積仍屬很小。

4．戰(zhàn)術(shù)配合示意圖

在球類等集體項(xiàng)目教學(xué)中，隊(duì)員間戰(zhàn)術(shù)配合及進(jìn)攻防守線路的講解往往需要借助輔助手段來進(jìn)行。用動(dòng)畫的方法來表現(xiàn)這些變化，具有時(shí)間空間感好、整體效果強(qiáng)、印象深刻等優(yōu)點(diǎn)。圖3所示初中三年級(jí)排球"中一二"進(jìn)攻戰(zhàn)術(shù)和"心跟進(jìn)"防守教學(xué)內(nèi)容的設(shè)計(jì)是一個(gè)典型的例子，我們?cè)趧?dòng)畫中表現(xiàn)了球的運(yùn)動(dòng)線路、隊(duì)員跑動(dòng)的時(shí)機(jī)及線路、隊(duì)員間的配合過程以及戰(zhàn)術(shù)套路的變化等很多內(nèi)容，使教學(xué)過程變得簡(jiǎn)單明了。

五結(jié)論

Flash動(dòng)畫素材表現(xiàn)力強(qiáng)，制作過程相對(duì)簡(jiǎn)單，有著鮮明的特點(diǎn)，在教學(xué)活動(dòng)中能夠發(fā)揮積極作用。在實(shí)際工作中也需要考慮到動(dòng)畫的特點(diǎn)和適用范圍，選擇合適的教學(xué)內(nèi)容用動(dòng)畫的形式來表現(xiàn)，不能一味求新，忽視視頻素材的作用。深圳大學(xué)近年來注重校園網(wǎng)絡(luò)和多媒體教學(xué)環(huán)境建設(shè)，教室、學(xué)生宿舍、