大專院校Flash網(wǎng)頁設(shè)計(jì)課程教學(xué)方法淺析

劉立偉 杜美易

【內(nèi)容摘要】文章針對(duì)大專院校Flash網(wǎng)頁設(shè)計(jì)課程的教學(xué)方法進(jìn)行研究，提出快捷鍵學(xué)習(xí)、Flash動(dòng)畫的設(shè)計(jì)價(jià)值、行業(yè)設(shè)計(jì)理念植入等一系列主張，特別針對(duì)網(wǎng)頁設(shè)計(jì)主體教學(xué)部分，總結(jié)出以“基本結(jié)構(gòu)設(shè)計(jì)—模塊分解設(shè)計(jì)—網(wǎng)站整合設(shè)計(jì)”流程為代表的“總—分—總”教學(xué)模式，由此帶動(dòng)Flash網(wǎng)頁設(shè)計(jì)課程教學(xué)計(jì)劃與內(nèi)容的相應(yīng)調(diào)整和完善。

【關(guān)鍵詞】大專院校 Flash 網(wǎng)頁設(shè)計(jì) 教學(xué)方法

Flash網(wǎng)頁設(shè)計(jì)是大專院校網(wǎng)頁設(shè)計(jì)系列課程的擴(kuò)展和提升階段，以非服務(wù)器端腳本編程的Flash結(jié)構(gòu)頁面設(shè)計(jì)為主，包括Flash軟件學(xué)習(xí)、Flash動(dòng)畫設(shè)計(jì)和Flash網(wǎng)頁設(shè)計(jì)等幾個(gè)方面。與基礎(chǔ)性的HTML靜態(tài)網(wǎng)頁設(shè)計(jì)課程相比，F(xiàn)lash網(wǎng)頁設(shè)計(jì)的教學(xué)內(nèi)容整體性較強(qiáng)，教學(xué)邊界相對(duì)清晰。下面筆者根據(jù)自身的教學(xué)經(jīng)驗(yàn)，對(duì)其教學(xué)思路和教學(xué)方法做簡要分析。

一、利用軟件的快捷鍵快速上手

Flash軟件與基本動(dòng)畫設(shè)計(jì)是網(wǎng)頁設(shè)計(jì)的基礎(chǔ)部分。如果在專業(yè)課程體系中沒有專門的Flash模塊作為先導(dǎo)課程，這一課程就需要引導(dǎo)學(xué)生在軟件使用層面快速上手。為實(shí)現(xiàn)這個(gè)目的，可以采用“快捷鍵學(xué)習(xí)法”。這種依靠重點(diǎn)快捷鍵快速學(xué)習(xí)的方法有助于短時(shí)間內(nèi)準(zhǔn)確把握軟件的常用與核心功能，受到越來越多的設(shè)計(jì)師的青睞。

筆者建議，在教學(xué)課件中為每一個(gè)常用的菜單與工具附上快捷鍵命令，以便學(xué)生第一次接觸時(shí)就可以熟悉它們。實(shí)際上，軟件在快捷鍵設(shè)置方面也非常注重功能的集合性，有助于集中記憶。如針對(duì)幀的操作部分，F(xiàn)5、F6、F7三個(gè)功能鍵分別實(shí)現(xiàn)了“插入幀”“轉(zhuǎn)換為關(guān)鍵幀”和“轉(zhuǎn)換為空白關(guān)鍵幀”三項(xiàng)內(nèi)容，既好記又好用。

二、Flash線性動(dòng)畫的設(shè)計(jì)相關(guān)性

我們知道，F(xiàn)lash MV一度在網(wǎng)絡(luò)上非常流行，和Flash MV的線性播放特性相似，F(xiàn)lash廣告已經(jīng)成為時(shí)下網(wǎng)絡(luò)廣告的主流。如某知名網(wǎng)站首頁共使用了27幅廣告，其中Flash廣告有18幅，占頁面廣告總數(shù)的66.7%。

Flash網(wǎng)絡(luò)廣告的普遍使用促進(jìn)了Flash技術(shù)在藝術(shù)設(shè)計(jì)專業(yè)中的廣泛應(yīng)用?；谶@種考慮，筆者建議在軟件基礎(chǔ)學(xué)習(xí)之后安排適當(dāng)?shù)膶W(xué)時(shí)進(jìn)行Flash廣告設(shè)計(jì)學(xué)習(xí)。這一部分課程的教學(xué)還可以與廣告相關(guān)課程相銜接，以進(jìn)一步豐富Flash網(wǎng)頁設(shè)計(jì)課程的內(nèi)涵。

在Flash廣告設(shè)計(jì)教學(xué)中，要側(cè)重于內(nèi)容密度、節(jié)奏感、視覺沖擊力等與Flash軟件技術(shù)直接相關(guān)的層面，其他內(nèi)容，如廣告語言、傳播理論等可鼓勵(lì)學(xué)生課外復(fù)習(xí)或自學(xué)，做到把握重點(diǎn)、取舍得當(dāng)。

三、Flash網(wǎng)頁設(shè)計(jì)“總分總”的教學(xué)模式

在軟件基礎(chǔ)和線性動(dòng)畫（Flash廣告設(shè)計(jì)）的基礎(chǔ)上，進(jìn)入到課程的主體模塊，即Flash網(wǎng)頁設(shè)計(jì)。與HTML靜態(tài)網(wǎng)頁的分頁面結(jié)構(gòu)不同，F(xiàn)lash網(wǎng)頁設(shè)計(jì)在集成設(shè)計(jì)開發(fā)環(huán)境內(nèi)（Flash軟件和Action腳本）實(shí)現(xiàn)網(wǎng)頁內(nèi)容與非線性結(jié)構(gòu)的編排，模塊化特性明顯。為此，筆者嘗試采用“基本結(jié)構(gòu)設(shè)計(jì)—模塊分解設(shè)計(jì)、網(wǎng)站整合”三步走的教學(xué)法，可概括為“總—分—總”教學(xué)流程，合理調(diào)配教學(xué)難點(diǎn)和重點(diǎn)，循序漸進(jìn)，在實(shí)踐中取得了一定的效果。

（一）基本結(jié)構(gòu)設(shè)計(jì)

首先，從網(wǎng)頁基本結(jié)構(gòu)入手，利用按鈕對(duì)時(shí)間線上各幀的控制構(gòu)造網(wǎng)站模型，其中包含了最基本的場(chǎng)景轉(zhuǎn)換。在學(xué)習(xí)的后期，可以針對(duì)每幀對(duì)應(yīng)的畫布進(jìn)行深入設(shè)計(jì)，包括內(nèi)容擴(kuò)展和淡入、淡出動(dòng)畫效果的實(shí)現(xiàn)等。

基本結(jié)構(gòu)設(shè)計(jì)涉及每幀對(duì)應(yīng)的畫布設(shè)計(jì)、按鈕設(shè)計(jì)、元件和實(shí)例的進(jìn)一步應(yīng)用以及補(bǔ)間動(dòng)畫等內(nèi)容，還涉及一些基礎(chǔ)的Action腳本內(nèi)容，如“stop”“gotoAndStop”“gotoAndPlay”命令以及幀標(biāo)記的參數(shù)調(diào)用等，適合入門學(xué)習(xí)。在腳本程序編寫的最初階段，重點(diǎn)要使學(xué)生理解腳本語言代替人進(jìn)行指令操作的特性，如“去哪”“做什么”等，利用這種指向性的形象思維逐漸強(qiáng)化學(xué)生的編程思維。一般來說，靜態(tài)網(wǎng)頁設(shè)計(jì)課程教學(xué)不會(huì)將Java腳本作為重點(diǎn)，在這種情況下，這一階段的Action腳本學(xué)習(xí)就更加重要。

（二）具體模塊學(xué)習(xí)

由于Flash網(wǎng)頁多在屏幕的顯示面內(nèi)不翻屏，高度有限，這就需要使用軟件功能和腳本程序創(chuàng)造更多的結(jié)構(gòu)層次去容納網(wǎng)頁內(nèi)容。除了場(chǎng)景的轉(zhuǎn)換外，在每個(gè)場(chǎng)景之中，還要借助于不同類型的頁面組件來實(shí)現(xiàn)額外的結(jié)構(gòu)層次。

針對(duì)種類較多的頁面組件，可以實(shí)施“分解教學(xué)”，即拋開網(wǎng)站設(shè)計(jì)的整體性，單純提煉每個(gè)組件的設(shè)計(jì)與編程要點(diǎn)，使每節(jié)課都可以完成一種組件設(shè)計(jì)，實(shí)現(xiàn)相關(guān)功能。筆者選擇的頁面組件包括按鈕組（菜單）、彈出框、下拉菜單、聲音控制模塊和預(yù)加載器等。

在設(shè)計(jì)層面，要考慮到各組件與網(wǎng)頁整體風(fēng)格的一致性；在內(nèi)容層面，要合理地選擇組件類型，豐富內(nèi)容層次，便于用戶訪問，形成良好的互動(dòng)性。而在Action腳本編寫方面，要以典型程序、核心程序?yàn)橹鳎鸩皆黾痈嗟臉邮阶兓?。?shí)際上，雖然組件類型不同，其背后的程序控制大多有著一定的內(nèi)在聯(lián)系，如很多組件都會(huì)用到onEnterFrame頻率控制函數(shù)。隨著教學(xué)的不斷深入，要盡量將腳本教學(xué)系統(tǒng)化，將松散的知識(shí)點(diǎn)整合起來，盡量覆蓋到常用的函數(shù)、方法和命令。

（三）網(wǎng)站內(nèi)容搭建

經(jīng)過不同組件的分解學(xué)習(xí)，接著補(bǔ)充幾種場(chǎng)景轉(zhuǎn)換的方法，結(jié)合不同設(shè)計(jì)項(xiàng)目中對(duì)組件的選擇，F(xiàn)lash網(wǎng)站就可以搭建起來。至此，F(xiàn)lash網(wǎng)頁設(shè)計(jì)的技術(shù)性教學(xué)目標(biāo)就基本完成了。

在技術(shù)性教學(xué)目標(biāo)之外，在課程的收官階段，要融入行業(yè)設(shè)計(jì)理念，以提高結(jié)課作業(yè)的質(zhì)量，保證教學(xué)效果。在HTML靜態(tài)網(wǎng)頁設(shè)計(jì)教學(xué)階段，筆者針對(duì)結(jié)課作業(yè)挑選了“實(shí)用設(shè)計(jì)”這一特定行業(yè)分類進(jìn)行教學(xué)強(qiáng)化，避免學(xué)生在結(jié)課階段設(shè)計(jì)得沒有針對(duì)性，學(xué)無所用。

四、靜態(tài)網(wǎng)頁的有效補(bǔ)充

如果分析“靜態(tài)網(wǎng)頁”的內(nèi)涵和外延，可以看到，在基于HTML網(wǎng)頁設(shè)計(jì)之外，只要立足于本地，與服務(wù)器沒有數(shù)據(jù)交互的網(wǎng)頁設(shè)計(jì)都可以統(tǒng)稱為“靜態(tài)網(wǎng)頁”。從這個(gè)角度來看，藝術(shù)設(shè)計(jì)專業(yè)中的Flash網(wǎng)頁設(shè)計(jì)課程也基本上以靜態(tài)網(wǎng)頁為主。

在Web2.0時(shí)代，交互性的社交網(wǎng)絡(luò)已經(jīng)發(fā)展得比較成熟，使每個(gè)獨(dú)立域名的網(wǎng)站不再是用戶交互的首選。在這種形勢(shì)下，靜態(tài)網(wǎng)頁設(shè)計(jì)要“揚(yáng)長避短”，不拘泥于本身用戶交互行為的弱點(diǎn)，以設(shè)計(jì)為主，反而有自己的一席之地。在教學(xué)中，要鼓勵(lì)學(xué)生在參與網(wǎng)絡(luò)互動(dòng)之余，盡量發(fā)揮自身設(shè)計(jì)優(yōu)勢(shì)，具備獨(dú)立完成內(nèi)容展示型網(wǎng)站的能力。

經(jīng)過相關(guān)調(diào)整，F(xiàn)lash網(wǎng)頁設(shè)計(jì)課程具備了循序漸進(jìn)、由淺入深的教學(xué)層次，直至課程結(jié)尾處，著眼于設(shè)計(jì)之“道”的有目的訓(xùn)練，使整個(gè)網(wǎng)頁設(shè)計(jì)課程體系具備了從基礎(chǔ)知識(shí)到綜合設(shè)計(jì)提升的完備性，并與其他課程有機(jī)結(jié)合，最大限度實(shí)現(xiàn)了課程的自身價(jià)值，為該課程的序列化、標(biāo)準(zhǔn)化建設(shè)積累了一定經(jīng)驗(yàn)。

（注：本文為遼寧省教育科學(xué)“十二五”規(guī)劃2011年度一般課題，課題批準(zhǔn)號(hào)：JG11DB075）

作者單位：劉立偉，大連醫(yī)科大學(xué)藝術(shù)學(xué)院

杜美易，大連醫(yī)科大學(xué)藝術(shù)學(xué)院、遼寧金融職業(yè)學(xué)院

（責(zé)任編輯：賀秀梅）