基于Web2.0的三維動畫設計精品課程的建設

摘 要 Web2.0是當前互聯網發展的新形態，較之傳統網絡給人們帶來更多的便利。它的產生與發展給教育類網站注入新的血液。在分析互聯網與教育理論的發展歷史的基礎上，以三維動畫設計精品課程建設為例，提出基于Web2.0的精品課程建設方案。

關鍵詞 Web2.0；精品課程；網絡教學；三維動畫設計

中圖分類號：G642.3 文獻標識碼：A 文章編號：1671-489X(2011)24-0090-04

Design and Realization of 3d Animation Design Top-quality Course based on Web2.0//Yu Yong， Huang Xinyuan

Abstract Web2.0 is a new form of the current development of the Internet， compared to traditional network brings us more convenience. Its Production and development will inject new blood to educational Web site. This paper analyzed the development of Internet and education theory and proposed an excellent course building program based on Web2.0 taking the building progress of the three-dimensional animation design course for example.

Key words Web2.0; top-quality course; network-based teaching; 3d animation design

Author’s address Information School， Beijing Forestry University， Beijing， China 100083

1 引言

教育部辦公廳在精品課程申報工作的有關文件中指出：“以多媒體課件制作技術、錄播技術以及網站制作、發布和共享技術等信息技術手段為平臺，促進精品課程信息化，是建設具有一流教師隊伍、一流教學內容、一流教學方法、一流教材、一流教學管理等特點的示范性優質課程的強力支撐。”文件精神指出充分利用信息技術手段是建設“五個一流”精品課程的有力保證。

如今，互聯網已進入Web2.0時代，新技術、新理念在不斷地更新。在高校的精品課程建設中，先進的課程離不開先進的技術手段作支撐，網絡技術的革新可以幫助各高校改善以往網站更新慢、交互性差等缺點，更好地體現課程建設的需求。

2 相關理論

2.1 從Web1.0到Web2.0互聯網的新變化

自從第一個網站在20世紀90年代初誕生以來，網頁設計者們奮發進取，不斷地刷新著互聯網的外觀和內涵，最近一次較大的革新是Web2.0相關概念的提出。

所謂Web2.0，是對新一代互聯網應用的統稱，是互聯網的一次理念和思想體系的升級換代，是由原來自上而下的由少數資源控制者集中控制主導的互聯網體系轉變為自下而上的由廣大用戶集體智慧和力量主導的互聯網體系。Web1.0的主要特點在于用戶通過瀏覽器獲取信息，只能進行單向的閱覽。Web2.0則更注重用戶的交互作用，用戶既是網站內容的消費者（瀏覽者），也是網站內容的制造者。

2.2 從教育1.0到教育2.0

與此不謀而合的是，教育領域也在經歷一場教育理念2.0的變革。從教育1.0到教育2.0的轉變如表1所示。

通過表1的比較不難看出，教育2.0與Web2.0在發展上有很多共性，如都強調以人為本，強調集體參與貢獻與分享等。

因此，將Web2.0的理念和技術與先進的教育理論2.0相結合，必然會給現在的精品課程建設帶來更令人欣喜的成果。

3 Web2.0教育應用的可行性

目前我國的精品課程網站從模式上看仍然以Web1.0為主，但Web2.0教育應用發展的大環境已相對成熟，主要表現為：1）博客在高校網絡課程中得到廣泛應用，Wiki、RSS等技術也在部分高校得到應用；2）眾多高校科研機構為Web2.0引發的教育變革提供理論指引和實踐經驗；3）大量的Web2.0網站的涌現和發展，其中一些網站已經擁有廣泛的用戶基礎且深受學生群體歡迎，如人人網、土豆網、抓蝦網、豆瓣網等；4）Web2.0開源軟件不斷增多，出現豐富的應用工具。

由此可見，Web2.0的外部環境已相對成熟，其與教育結合是完全可行的，在技術上即使不完全精通編程的人也可以通過插件或開源軟件建立起具備Web2.0特點的教育應用網站，但在具體應用中還需要結合不同的專業特點選擇不同類型的Web2.0應用元素。

4 精品課程網站的設計定位

通過對現有精品課程的調研分析以及對教育部辦公廳關于精品課程相關的申報工作文件的研究并結合本校的具體情況，對三維動畫設計精品課程做出定位。

1）人物定位：評審專家、教師和學生。

2）功能定位：滿足評審專家、教師和學生的需求，設計一個讀寫兼備、交互性更強的學習網站。

3）技術定位：采用符合Web標準的DIV+CSS代碼構建整個網站；課程設置、教學效果、實踐條件、師資隊伍這幾個評審要求設計策略上都以方便展現給專家審閱為主，且內容相對穩定，更新量不大，故適合采用Web1.0的靜態模式，這樣做更容易被搜索引擎檢索；課程內容、教學實踐等欄目以方便學生學習溝通為主，需要滿足交互功能和內容的不斷更新，故適合采用Web2.0的交互模式；程序主要采用Asp+Access+JavaScript。

4）結構定位：一級評審指標設計在主導航區，二級評審指標要分別對應出現在一級評審指標的下一級導航區內，除了首頁采用三欄布局外其余各頁采用通欄布局。

5）風格定位：依據“少就是多”的美學原則，追求簡潔、高效、易讀性的風格。

5 精品課程網站整體設計

5.1 策劃準備階段

1）系統設計框架圖。如圖1所示，根據前面的分析制定一個系統設計框架圖，以便對整個網站的結構有個清晰的把握。

2）資源收集整理。根據系統設計框架圖中所標明的特定內容收集并處理各種資料，將精品課程可視化，使抽象的要求變成具體的可視資料。這部分內容包括圖片、文字以及視頻的處理，使其格式統一、規范，并建立文件夾分類命名保存。

5.2 網站前臺設計

由于本課程是一門以三維動畫設計學習為主的精品課程，所以在內容表現上不僅要體現精品的內涵，又要兼顧課程自身的特點。

1）網站頁面布局。實踐證明，直觀、結構組織相對整齊的版面是能夠最快獲得用戶認同的。因此，在首頁采用左中右三欄布局，并放置少量最有效的信息，目的是展示網站形象并引導訪問者；內頁都采用通欄布局，每頁都分為頭、主體和腳三部分，頭包含Logo和主導航區，主體包含二級導航區和內容顯示區，腳包含網站的相關說明信息。

2）導航區。網站主導航在整個站點的幾乎每個頁面上都會出現，通常要設計得簡潔，明顯區別于網頁其他內容，以便于點擊和選擇。把導航放在頁面上方最顯著的位置并通過不同色相的對比區分不同的菜單類型，針對不同菜單分別設計不同色相作為鼠標的交互響應。在二級導航區采用大標簽的菜單形式，在功能實現上通過JavaScript代碼和CSS樣式表控制頁面內容的切換而無需頁面的重新加載。這樣做避免了傳統Web1.0時代頁面分欄過多所造成的信息擁擠，從而節省版面空間。

3）網站色彩。首先選擇低純度的藍色作為網站的基本色，配以近似藍作為輔助色，這樣可以顯得沉穩大氣。為了增加一些活潑感，在導航按鈕的設計上采用絢麗的半透明彩色作為點綴。

4）文字。用CSS樣式表控制字體、字號、間距、行距、色彩，使信息內容之間疏密得當、整齊有序。

5）圖片。對每個圖片都采用加細邊框并在四周留白的處理，效果的實現以CSS中的border和padding屬性來控制。

6）視頻。鑒于對網站風格以及視頻播放器易用性的考慮，選擇FLV播放器，這種播放器可以根據網站風格的需要設計不同的皮膚，只要懂一點Flash編程語言就很容易做到，而且它對SWF的格式文件有很好的支持，可以避免用戶下載視頻播放插件的時間。調用時只需要將FLV播放器的代碼嵌入網頁。

7）網頁架構。代碼采用符合Web標準的DIV+CSS布局模式，這種方式使網頁內容和表現分離，減少網頁代碼，加快網頁顯示的速度，也方便日后進一步維護。

5.3 后臺設計

鑒于本校服務器只能支持ASP類型的程序，同時考慮到系統的通用性，決定采用ASP加ACCES數據庫的方式來搭建系統平臺。

網站后臺功能模塊主要包括網站基本信息管理、用戶信息管理、欄目管理、文件上傳管理、留言管理和插件管理，Web2.0的應用主要通過在插件管理模塊下的自由編輯區域里添加相應的JS代碼來實現。系統主要功能模塊結構如圖2所示。

5.4 Web2.0插件的應用

1）RSS的應用。由于3DMAX軟件近幾年來升級較快，幾乎每年都會推出一個新的版本，而且伴隨著這種更新，與其相關的一系列舊版插件都不再可用，必須下載相關插件的最新版本。因此，授課內容要注意隨時革新，緊跟時代步伐。借助于RSS可以讓學生不必訪問網站就能及時了解到最近的更新。在網站的課程資源、學生作品等欄目提供RSS源，學生只需要下載RSS閱讀器，通過添加頻道就能訂閱網站的更新內容。

2）JiaThis插件的應用。JiaThis是一個提供網頁地址收藏、分享及發送的Web2.0按鈕工具，網站的瀏覽者可以方便地分享到人人網、開心網、QQ空間、新浪微博等一系列社會化關系網絡站點。學生在學習中遇到的問題可以通過這個小工具分享到自己的網絡社交圈里尋求集體的幫助。實現這種功能只需將標準按鈕JS代碼嵌入課程網站的各個頁面，或頁面的某一部分。

3）心情TAG的使用。心情標簽是一套表達心情的小圖標組插件，用戶在觀看網頁內容后可以用這些可愛生動的小圖標來表達自己對所學習的內容感受。教師可以從用戶所使用的圖標的頻率數字來統計出哪些內容是受學生歡迎的，從而決定增刪或改善相關學習資料。這種小功能的使用能加強網站互動性，增加網站亮點，帶動網站氣氛的活躍。

4）在線答疑系統的使用。在線答疑系統是一款帶數據庫的客服插件，與傳統的留言薄相比，它具有動態實時性和可擴展性的特征。這種插件集合了即時聊天工具QQ、MSN、Skype等，可以方便地將學習中遇到的問題即時地和教師溝通。它包含4個文件：一個JS文件，一個CSS樣式表，一個數據庫文件，一個可修改的界面模板。使用時首先要進行一些代碼設置，如修改QQ號等聯系人號碼，使其處于激活狀態，然后需要將JS文件和數據庫等文件放置在網站的根目錄并用JS代碼調用到網頁內。

6 總結

以上介紹了基于Web2.0的三維動畫設計精品課程網站開發設計過程和實現技術。該網站已經實現Web2.0理念的基本功能，可以較好地工作，并可以比較方便地進行擴展。但是該網站還不十分的完善，仍有待于改進，比如在學習測驗中，還可以利用維基功能實現在線提交作品，通過該功能可以促進學生之間對同一個設計主題的完成效果進行對比學習，從而激勵自己并提高作品的制作水平。

參考文獻

[1]Web2.0教育應用綜述[EB/OL].http://Blog.sina.com.cn/s/Blog_4db3c41f0100hszt.html

[2]宦成林.Web2.0時代的精品課程建設[J].浙江現代教育技術，2008(1)

[3]羅慈.論Web2.0網站簡潔的視覺風格及成因[J].藝術與設計，2009(6)

[4]肖榮榮，張鳳斌，劉亞麗，等.Web2.0應用情況調查分析及其啟示[J].圖書館理論與實踐，2009(9):22-24

[5]劉遠東.Web1.0與Web2.0網絡課程比較研究[J].中國電化教育，2009(7):73-78

[6]全國高等學校精品課程建設工作[EB/OL].http://www.jpkcnet.com

[7]中國互聯網協會.2005-2006中國Web2.0現狀與趨勢調查報告[R/OL].[2006-02-23].http://report.internetdigital.org