《網頁美工設計》課程教案

授課教師：授課班級：地點：課時：

章節網頁設計基礎知識

內容

Dreamweaver軟件介紹及其基礎操作

教學1)使學生了解網頁設計的相關基礎知識；

目標2)使學生熟悉Dreamweaver軟件界面的基本操作方法。

重點1)了解網頁設計相關概念和網頁的類型；

難點2)熟練掌握Dreamweaver軟件創建和管理站點的方法。

教學

課堂講授、案例講解與指導

方法

教學

計算機機房

環境

時間

教學過程及內容提要備注

分配

一、引入

約10分鐘

1、相互認識，提出與本學科相關的知識，介紹本門課程情況、教學內

容及總學時數進度安排，宣講本課程教學紀律，鼓勵學生營造一種

學習氛圍，尊重同學，互幫互學，真正達到學以致用；

教

2、提出問題：上過網吧有誰自學過網頁設計聽說過網頁設計三劍客

學

嗎？

過

3、

學生理解

程

二、告知學生課堂任務

設約5分鐘

本次課所學習的主要內容是網頁設計相關基礎知識和

計

Dreamweaver軟件基礎操作；

約25分鐘

三、逐步演示講解分析教學內容

1、網站和網頁的區別：

2、（1）網頁是Internet基本元素；

3、（2）網站由網頁組成；

4、靜態網頁和動態網頁：

5、靜態網頁：純粹HTML語言格式的網頁通常被稱為靜態網頁，靜態

網頁的后綴名通常為.htm、.html、.shtml、.xml。

6、動態網頁：許多人認為網頁會動就是動態網頁，這是個錯誤的觀點，

在靜態的網頁中也可以含有動態的圖片，這僅僅是視覺上的動態罷

了。真正的動態網頁是指實際上并不是獨立存在于服務器上的網頁

約10分鐘

文件，只有當用戶請求時服務器才返回一個完整的網頁。也就是說，

約6分鐘

它是返回到了客戶端上的網頁。例如網頁文件是以ASP、PHP、JSP、

ASPX為結尾就是動態的網頁了。

7、靜態網頁的特點：約6分鐘

8、（1）內容相對穩定，容易被搜索引擎檢索到；

9、（2）沒有數據庫支持，在網站制作和維護方面工作量大；

10、（3）交互性差，在功能方面有很大的限制。

約4分鐘

11、動態網頁的特點：

12、（1）以數據庫技術為基礎，可大大降低網站維護的工作量；

13、（2）可實現更多的功能，如用戶注冊、新聞發布、在線留言等；

14、（3）不利于使用搜索引擎進行網站推廣。約8分鐘

學生實踐

15、常見網頁類型：形象頁、主頁、欄目頁、內頁、新聞詳細頁等；

16、網頁設計原則：約12分鐘

17、（1）了解客戶需求

18、（2）遵循Web標準

約20分鐘

19、（3）運用形式美法則

20、網頁設計流程：約50分鐘學生實踐

21、（1）手繪效果圖：確定網頁主題內容和風格

22、（2）設計效果圖：搜集、整合設計所需素材總結

23、（3）版面編輯：網頁的制作與實現約40分鐘

24、（4）網頁美化：動畫設計，網頁測試和發布

25、網頁設計的主要軟件：

約4分鐘

26、（1）Photoshop

27、（2）Dweamveawer

28、（3）Flash

29、（4）Firworks

30、Dreamweaver軟件界面介紹：

31、（1）軟件面板組成及基本操作方法

32、（2）軟件參數設置

33、Dreamweaver站點創建：

34、站點->新建站點->設置站點名稱->設置站點默認圖像文件

夾。

35、學生實訓操作：

36、Dreamweaver站點創建與設置

37、Dreamweaver創建第一個網頁：

38、（1)名稱：

39、（2)設置標題、輸入文本、輸入特殊字符

40、（3）頁面屬性設置

41、（4）預覽網頁

42、

四、學生實訓及輔導；

五、創建第一個網頁。

六、

七、課堂小結

本次課主要內容：

1、網頁設計基礎知識；

2、Dreamweaver基本使用方法；

3、Dreamweaver創建第一個網頁；

后

記

《網頁美工設計》課程教案

授課教師：授課班級：地點：課時：

章節Dreamweaver表格操作；

內容CSS樣式表應用。

教學1)掌握Dreamweaver中表格的設計方法；

目標2)CSS樣式表的使用方法和技巧。

重點1)熟練掌握Dreamweaver中表格的基本操作方法；

難點2)了解網頁設計中CSS樣式表的作用和設置方法。

教學

課堂講授、案例講解與指導

方法

教學

計算機機房

環境

時間

教學過程及內容提要備注

分配

一、引入

約4分鐘

1、回顧上次課所學習的內容：網頁設計基礎理論知識，

Dreamweaver軟件使用初步；

2、提出問題：對Word中表格操作還熟練嗎CSS是什么如何設置

教

網頁中各種元素的顯示效果？

學

3、

過

二、告知學生課堂任務學生理解

程約6分鐘

本次課所學習的主要內容是Dreamweaver中表格的使用和

設

Dreamweaver創建CSS樣式表；

計

三、逐步演示講解分析教學內容

1、網頁中表格的作用：

2、（1）內容組織和定位；

3、（2）網頁排版；

4、表格布局和Div布局區別：約30分鐘

5、各有優勢。

6、表格：簡單，好用，學起來很容易上手。各種瀏覽器都支持！

學生思考

基本上不會變形。但是代碼冗余較多，維護起來也不怎么方便。

約10分鐘

7、DIV+CSS優點：代碼冗余小，所以網站打開速度快一些。維護

起來非常方便。但是要兼容IE6IE7火狐等瀏覽器的話，開始學

就會很頭疼這個問題的。往往在IE6里面看著整個網頁是好的，但

學生實踐

是到了IE7或者火狐里面就全亂了。

8、推薦：用div做框架，table用來儲存數據。約15分鐘學生理解

9、Dreamweaver中表格的基本操作：約35分鐘

10、（1）表格和單元格的選擇及屬性設置；

11、（2）行和列的添加和刪除；

學生實踐

12、（3）單元格的合并和拆分；

13、（4）表格的嵌套；約15分鐘學生理解

14、實例演示講解：使用表格制作一像素細線；約40分鐘

15、操作步驟：

16、（1)插入1行1列表格；

17、（2)設置單元格背景顏色；

18、（3)設置單元格高度為1；

19、（4)轉到代碼視圖；

學生實踐

20、（5)把單元格中的 刪除。

約40分鐘

21、輔導學生實訓操作；

總結

22、Dreamweaver中CSS樣式表的使用：

約5分鐘

23、（1）CSS樣式表文件的創建；

24、（2）創建CSS樣式：網頁鏈接樣式2；

25、（3）創建CSS樣式：網頁凹下鏈接樣式；

26、（4）創建CSS樣式：類鏈接樣式；

27、（5）創建CSS樣式：濾鏡樣式。

28、輔導學生進行CSS樣式實訓操作；

29、案例演示講解：個人主頁首頁布局設計

30、（1）創建網頁；

31、（2）設置網頁屬性；

32、（3）使用表格布局網頁（上中下型）；

33、（4)使用Photoshop制作頁面頭部Banner圖片；

34、（5）制作導航欄漸變背景圖片；

35、（6）制作頁面主體（左側公告跑馬燈效果和友情鏈接，右側

資訊速遞及圖片列表）；

36、（7）頁面底部設計。

四、布置并輔導學生完成課堂作業；

五、

六、課堂小結

本次課主要內容：

1、Dreamweaver網頁表格基本使用方法；

2、Dreamweaver創建CSS樣式；

后

記

《網頁美工設計》課程教案

授課教師：授課班級：地點：課時：

Dreamweaver中圖像的使用；

章節

網頁字體設計；

內容

表單設計制作。

教學3)掌握Dreamweaver中圖形圖像的使用和屬性設置方法；

目標4)掌握網頁表單的設計技巧。

重點3)熟練掌握Dreamweaver中圖像熱點鏈接的創建方法；

難點4)掌握用戶注冊表單的設計方法和技巧。

教學

課堂講授、案例講解與指導

方法

教學

計算機機房

環境

時間

教學過程及內容提要備注

分配

七、引入約4分鐘

4、回顧上次課所學習的內容：Dreamweaver表格的使用和屬性設

教約10分鐘

置，Dreamweaver中創建CSS的方法；

學

5、點評上周作業；

過

6、提出問題：什么是熱點鏈接網站的注冊頁面是如何制作的？

程

7、

設

八、告知學生課堂任務學生理解

計約5分鐘

本次課所學習的主要內容是Dreamweaver中圖像的使用和網頁表學生理解

單的設計；

九、逐步演示講解分析教學內容

37、網頁中支持的圖像格式：jpg、gif、gif動畫、bmp、png

約10分鐘學生理解

38、網頁中圖像使用原則：

39、（1）盡量小，對較大的圖片文件進行適當的壓縮和切割；

40、（2）應該挑選與網站主題有關聯性的圖片；約10分鐘學生實踐

41、（3）對于網站的標志圖片,主體應該清晰可見,圖形的含義最約10分鐘

學生實踐

好簡單明了,圖片內所含的文字應該清楚且容易辨認；約10分鐘

學生理解

42、（4）背景圖片只是用來襯托圖片主題的,切忌過于花哨；約10分鐘

43、（5）圖片顏色應該與頁面整體配色協調。

44、Dreamweaver中圖像的使用：

45、（1）插入圖像；

約10分鐘

學生實踐

46、（2）設置圖像屬性；

約20分鐘

學生理解

47、（3）添加圖像熱點鏈接。

約5分鐘

48、輔導學生實訓操作；

49、實例演示：Dreamweaver中變換圖像的創建方法---創建導航

約15分鐘

條。

50、輔導學生完成實例實訓操作；

51、網頁字體設計：

52、（1）文字樣式；

學生實踐

53、（2）大小；

約10分鐘

54、（3）顏色

約15分鐘

55、（4）其它屬性。

約5分鐘

56、實例講解：內容詳細頁的創建。

57、輔導學生完成實例實訓操作；

58、Dreamweaver中網頁表單設計制作：

59、（1）網頁表單的作用；

60、（2）常見表單頁類型；

約10分鐘

61、實例演示：創建用戶注冊表單頁；約10分鐘

62、（1）制定插入表單的頁面位置；

約10分鐘

63、（2）插入表單；總結

64、（3）在表單中插入表格為表單控件布局；

約20分鐘

65、（4）插入文字標簽；

66、（5）插入表單各種控件并設置表單控件的屬性；

約1分鐘

67、（6）使用CSS美化表單控件；

68、Dreamweaver中的層的使用方法及其實例講解；

69、輔導學生實訓練習；

70、Dreamweaver中行為的添加方法和使用技巧：

71、（1）交換圖像；

72、（2）彈出信息；

73、（3）打開瀏覽器窗口；

74、（4）播放聲音；

75、（5）改變屬性；

76、（6）顯示-隱藏層；

77、（7）轉到URL.

78、輔導學生實訓練習；

79、綜合實例演示講解：運用Dreamweaver中的層和行為來制作網

頁下拉菜單式導航條：

80、輔導學生實訓練習；

十、布置課堂作業并輔導學生完成作業實訓：

十一、個人主頁用戶表單設計。

十二、

十三、課堂小結

本次課主要內容：

1、Dreamweaver中圖像的使用方法和技巧；

2、Dreamweaver中字體的設計；

3、Dreamweaver中表單頁面的設計制作。

后

記

《網頁美工設計》課程教案

授課教師：授課班級：地點：課時：

章節

Photoshop基本使用方法和技巧

內容

教學5)熟悉Photoshop軟件界面；

目標6)掌握Photoshop軟件的基本操作方法。

重點5)掌握Photoshop軟件界面基本操作方法和技巧；

難點6)掌握Photoshop中的圖片合成和修復的應用方法。

教學

課堂講授、案例講解與指導

方法

教學

計算機機房

環境

時間

教學過程及內容提要備注

分配

教

約4分鐘

學十四、引入

過8、回顧上次課所學習的內容：網頁字體設計，表單頁設計制作；約10分鐘

程9、點評上周作業；

設10、提出問題：網頁中的圖像是怎么處理的是否用過什么圖像編輯

計軟件？

11、

學生理解

十五、告知學生課堂任務約2分鐘

本次課所學習的主要內容是Photoshop基本使用方法和技巧；約5分鐘

約10分鐘

十六、逐步演示講解分析教學內容

81、Photoshop軟件介紹；

82、Photoshop軟件界面介紹；學生實踐

83、Photoshop基本操作方法：

約15分鐘

學生實踐

84、（1）首選參數設置；

約10分鐘

學生理解

85、（2）工具欄的使用；

約10分鐘

86、（3）圖像顯示比例設置；

約15分鐘

87、（4）單位標尺設置；

88、（5）歷史記錄面板的使用；

89、（6）其它工具面板基本操作。

學生實踐

90、輔導學生實訓操作；

學生理解

91、實例演示講解：圖層的基本操作方法；約20分鐘

92、輔導學生實訓操作；約20分鐘

93、變換圖像方法：縮放、旋轉、斜切、扭曲、透視、變形、裁剪；

94、操作步驟：

95、（1）打開素材；

96、（2）選擇相應區域；學生實踐

97、（3）選擇變換相應命令；學生理解

98、（4）在圖片相應區域進行操作；約20分鐘

約30分鐘

99、（5）保存并退出；

100、輔導學生實訓操作；

101、Photoshop應用實例講解：圖片合成；

操作步驟：

（1）導入所需圖片素材；學生實踐

（2）新建Photoshop文件；

約35分鐘

總結

（3）選取矩形選框工具選取導入素材的部分區域；

約2分鐘

（4）復制并粘貼到新建文件中并設置邊沿羽化效果；

（5）同法處理其它素材；

（6）調整圖像整體顏色效果；

（7）導出最終圖像；

102、指導學生完成課堂實訓設計實例；

103、幾種修飾修復圖像工具的使用及其實例操作演示講解：

104、仿制圖章工具、污點修復畫筆工具、修復畫筆工具、修補工具、

紅眼工具、模糊工具、減淡/加深工具、海綿工具；

105、操作步驟：

106、（1）打開素材；

107、（2）選擇對應工具；

108、（3）設置相關屬性；

109、（4）在圖片相應區域進行操作；

110、（5）保存并退出；

111、指導學生完成課堂實訓設計實例；

112、

十七、課堂小結

本次課主要內容：

1、Photoshop軟件的基本操作方法；

2、Photoshop圖片合成方法；

3、幾種修飾修復圖像工具的使用。

后

記

《網頁美工設計》課程教案

授課教師：授課班級：地點：課時：

章節

Photoshop進階使用

內容

教學7)圖像的選取和摳圖實例操作演示講解；

目標8)掌握Photoshop中濾鏡和蒙板的使用方法和技巧。

重點7)熟悉Photoshop中幾種常用濾鏡的使用方法；

難點8)理解圖層蒙板的作用，掌握圖層蒙板的使用方法和技巧。

教學

課堂講授、案例講解與指導

方法

教學

計算機機房

環境

時間

教學過程及內容提要備注

分配

約2分鐘

十八、引入

12、回顧上次課所學習的內容：Photoshop軟件的基本操作方法、

約10分鐘

Photoshop圖片合成方法、幾種修飾修復圖像工具的使用；

教

13、點評上周作業；

學

14、提出問題：什么濾鏡什么是蒙板濾鏡和蒙版有什么用濾鏡和蒙

過

板怎么用？約1分鐘

程

15、學生理解

設

十九、告知學生課堂任務

計

約20分鐘

本次課所學習的主要內容是Photoshop高級應用，包括濾鏡和蒙

板的使用、摳圖方法、色彩調整；

學生實踐

二十、逐步演示講解分析教學內容約20分鐘

113、圖像的選取和摳圖實例操作演示講解：約10分鐘

114、（1）快速選擇工具；

115、（2）魔棒工具；

116、（3）魔術橡皮擦工具；

117、（4）鋼筆工具；

118、（5）抽出濾鏡。

119、學生實訓課堂實例；

120、幾種調整圖像色彩的方法及其實例操作演示講解：學生實踐

121、（1）灰度圖像效果；

約30分鐘

122、（2）色相飽和度調整；

約30分鐘

123、操作步驟：

124、1）選擇圖像或者圖像區域；

125、2）執行【圖像】|【調整】|【色相/飽和度】命令；

126、3)調整數值；

127、4）確定并保存圖像；

128、(其它色彩調整步驟類似)

學生實踐

129、（3）反相效果；

130、（4）黑白圖像效果；

約20分鐘

131、（5）漸變色彩效果；

約15分鐘

132、（6）調整圖像亮度和對比度；

133、學生實訓課堂實例；

134、Photoshop濾鏡的使用方法及其實例操作演示講解：

約10分鐘

135、（1）風格化；學生實踐

136、（2）描邊；

總結

137、（3）模糊；

約30分鐘

138、（4）素描；

139、（5）紋理；約2分鐘

140、（6）像素化；

141、（7）渲染。

142、像素畫濾鏡應用實例演示：

143、1）選擇圖片對象或區域（通道）；

144、2）執行【濾鏡】|【像素化】|【馬賽克】命令；

145、3）調整屬性值；

146、4）確定并保存；

147、學生實訓課堂實例；

148、Photoshop圖層蒙板的使用及其實例操作演示講解；

149、（1）蒙板的概念；

150、（2）蒙板作用；

151、（3）蒙板使用方法；

152、（4）蒙板應用實例；

153、Photoshop動作及批處理圖像方法：

154、（1）Photoshop動作的使用方法；

155、（2）Photoshop批處理命令的使用及實例演示；

二十一、布置課堂作業并輔導學生完成作業實訓；

二十二、

二十三、課堂小結

本次課主要內容：

1、Photoshop摳圖方法；

2、Photoshop濾鏡的應用；

3、Photoshop蒙板的使用。

后

記

《網頁美工設計》課程教案

授課教師：授課班級：地點：課時：

網頁背景圖案的制作

章節

LOGO設計制作

內容

Banner設計制作

教學9)掌握網頁各種圖標的設計制作方法；

目標10)掌握LOGO和Banner常用的方法和技巧。

重點9)掌握網頁背景圖案常用的設計方法和技巧；

難點10)能夠運用所學知識設計出具有深刻內涵的的網站LOGO。

教學

課堂講授、案例講解與指導

方法

教學

計算機機房

環境

時間

教學過程及內容提要備注

分配

約3分鐘

二十四、引入

16、回顧上次課所學習的內容：Photoshop摳圖方法，Photoshop

教約10分鐘

濾鏡的應用，Photoshop蒙板的使用；

學

17、點評上周作業；

過

18、提出問題：網站LOGO有什么用LOGO圖標的設計制作有哪些方

程

法和技巧

設

19、

計學生理解

二十五、告知學生課堂任務

約25分鐘

本次課所學習的主要內容是網站LOGO設計制作，網頁Banner和

導航菜單的設計制作方法；

二十六、逐步演示講解分析教學內容

156、常見網頁背景圖案設計制作：

157、（1）斜線圖案：

學生實踐

158、操作步驟：約30分鐘

學生理解

159、1）新建4×4大小、透明背景圖像；約3分鐘

160、2）放大圖像至3200%以方便設置線條；

161、3)調整顏色，使用畫筆工具填充線條路徑；

學生理解

約3分鐘

162、4）將繪制好的圖形定義為圖案保存下來；

163、5）使用填充命令將圖案平鋪到指定區域。

164、(其它色彩調整步驟類似)

165、（2）立體圖案：（制作方法略）；

約20分鐘

166、（3）文字圖案：（制作方法略）；

167、（4）漸變背景：（制作方法略）。

學生實踐

168、課堂實例練習及輔導；

約30分鐘學生理解

169、網站LOGO的作用：

約4分鐘

170、（1）LOGO是與其它網站鏈接以及讓其它網站鏈接的標志和門

戶；

171、（2）LOGO是網站形象的重要體現；學生實踐

172、（3）LOGO能使受眾便于選擇。約20分鐘

173、一個好的LOGO應具備的條件：

學生實踐

174、（1）符合國際標準；

約20分鐘

學生實踐

175、（2）精美、獨特；

176、（3）與網站的整體風格相融；約30分鐘

177、（4）能夠體現網站的類型、內容和風格。總結

178、網站LOGO設計制作常見方法及其實例操作演示講解：約2分鐘

179、（1）線條的使用；

180、（2）圖形的使用；

181、（3）文字的使用；

182、（4）漸變色的使用；

183、課堂實例練習及輔導；

184、網頁Banner設計應該遵循的原則：

185、（1）主題明確；

186、（2）與整個頁面相協調；

187、（3）順應用戶的瀏覽習慣；

188、（4）能吸引點擊。

189、網頁Banner的設計制作方法及其實例操作演示講解：

190、（1）靜態Banner；

191、（2）動態Banner；

192、課堂實例練習及輔導；

二十七、布置課堂作業并輔導學生完成作業實訓；

二十八、設計個人主頁網站首頁Logo和Banner。

二十九、

三十、課堂小結

本次課主要內容：

1、常見網頁背景圖案設計制作；

2、網站LOGO的設計方法；

3、網頁Banner的設計制作方法。

后

記

《網頁美工設計》課程教案

授課教師：授課班級：地點：課時：

章節網頁按鈕設計制作

內容網頁欄目框設計制作

教學11)掌握網頁各種圖標的設計制作方法；

目標12)掌握使用欄目框美化網頁方法。

重點1)掌握網頁常見按鈕和小圖標的設計制作方法；

難點2)網頁欄目框的設計技巧及其表現力的實現。

教學

課堂講授、案例講解與指導

方法

教學

計算機機房

環境

時間分

教學過程及內容提要備注

配

三十一、引入

約2分鐘

20、回顧上次課所學習的內容：網站LOGO設計制作，網頁Banner

和導航菜單的設計制作方法；

約10分鐘

21、點評上周作業；

教

22、提出問題：網頁中常見按鈕有哪些類型漂亮的水晶按鈕是怎么

學

制作的？

過

23、

程

三十二、告知學生課堂任務

設學生理解

本次課所學習的主要內容是網頁按鈕設計制作和使用欄目框美化約12分鐘

計

網頁的方法。

三十三、逐步演示講解分析教學內容

1.網頁中按鈕設計理論：

2.（1）按鈕的類型：有提交功能的“真按鈕”和“偽按鈕”；

約40分鐘

3.（2）按鈕的功能：實現提交和標明當前操作；

4.（3）按鈕的表現形式：系統標準按鈕和使用圖片自制的按鈕；

5.（4）按鈕的位置：容易找到、畫面的中心位置；

6.（5）按鈕上面的文字表述：言簡意賅，直接明了；

7.（6）按鈕的尺寸：適中；

8.（7）與其他元素關系：讓其充分通透；

9.（8）注意鼠標滑過的效果：增強按鈕的點擊感。

10.網頁常見幾種按鈕的設計制作方法及其實例操作演示分步講解：

學生實踐

11.（1）方形按鈕；

學生理解

12.簡要步驟：

約40分鐘

13.1)繪制矩形邊框；

約35分鐘

14.2）填充顏色：純色或漸變色；

15.3）添加文字。學生實踐

16.（2）圓形按鈕：（步驟略）；

約40分鐘學生實踐

17.（3）斜角型按鈕：（步驟略）；

18.（4）橢圓型按鈕：（步驟略）；

約20分鐘

總結

19.（5）水晶按鈕按鈕：

20.簡要步驟：

約1分鐘

21.1)繪制矩形邊框；

22.2）填充漸變色；

23.3）添加文字；

24.4）添加高光層；

25.5）設置朦朧邊框。

26.課堂實例練習及輔導；

27.常見幾種網頁欄目框及其設計制作實例；

28.（1）矩形；

29.（2）圓角矩形；

30.（3）滑動門型；

31.（4）圖標修飾型（回形針）。

32.課堂實例練習及輔導；

三十四、布置課堂作業并輔導學生完成作業實訓。

三十五、美化個人主頁按鈕和欄目框。

三十六、

三十七、課堂小結

本次課主要內容：

1、網頁按鈕設計制作；

2、使用欄目框美化網頁方法；

后

記

《網頁美工設計》課程教案

授課教師：授課班級：地點：課時：

章節Flash軟件介紹

內容Flash繪圖基礎—景物和場景繪制

教學

熟悉Flash軟件界面并掌握使用Flash進行繪制各種圖形的方法。

目標

重點13)了解Flash軟件的特點；

難點14)熟練使用Flash工具欄繪制各種圖形。

教學

課堂講授、案例講解與指導

方法

教學

計算機機房

環境

時間

教學過程及內容提要備注

分配

約1分鐘

三十八、引入

24、回顧上次課所學習的內容：網頁按鈕設計制作和使用欄目框美

化網頁的方法；

教

25、提出問題：網絡上常聽到的閃客指的是什么Flash軟件有什么

學

特點Flash能做什么？

過

程26、

三十九、告知學生課堂任務學生理解

設約3分鐘

本次課所學習的主要內容是了解Flash及Flash工具欄的基礎操

計

作；

四十、逐步演示講解分析教學內容

193、Fireworks軟件介紹；

194、Fireworks的獨特功能：

195、（1）可以輸出SWF和Illustrator7文件；學生實踐

約15分鐘

196、（2）與Dreamweaver緊密的配合；

約5分鐘

197、（3）允許加入Photoshop濾鏡；

198、（4）可以直接編輯點陣圖；

199、（5）更方便的Rollover；

200、（6）即時預覽；

201、（7）可以讀入Photoshop文件；

202、（8）提供GIF編輯環境；

約5分鐘

203、（9）提供全新的按鈕制作工具；

204、（10）提供圖形與文字的樣式庫（Style）。

205、Fireworks軟件界面和常用工具及其基本操作方法

206、Flash軟件介紹學生實踐

207、Flash軟件的主要特點：

約10分鐘

208、（1）Flash軟件安裝方便，適用場合廣泛；

學生實踐

約15分鐘

209、（2）Flash制作動畫時間短，學習起來容易上手；

約10分鐘

210、（3）Flash生成的文件體積小；

約10分鐘

211、（4）有強大的交互性；

約10分鐘

212、（5）使用矢量圖形和流式播放技術；

約10分鐘

213、（6）有強大的動畫編輯功能；

約10分鐘

214、（7）動畫效果生動活潑，形象直觀。

約10分鐘

學生實踐

215、Flash常見的表現形式：

216、（1）網絡動畫：常見于網頁的片頭；

學生實踐

217、（2）MTV：在各排行榜中數量最多；

218、（3）網絡廣告：Flash廣告是當今網絡廣告界的時尚；

約15分鐘總結

219、（4）交互網站：可實現純flash網站，但是不利于搜索引擎

約30分鐘

登錄；

約40分鐘

220、（5）賀卡：是初學者練手的較好選擇，能帶來小小的收入

221、（6）動畫短片：是Flash大獎賽的主要形式；

約1分鐘

222、（7）交互游戲：將產品廣告做到游戲中。

223、Flash軟件界面介紹：軟件界面布局和工具欄的簡單使用；

224、輔導學生完成課堂實訓；

225、Flash中層的基本操作方法；

226、使用Flash工具欄繪制圖形一：五角星；

227、輔導學生完成課堂實訓；

228、使用Flash工具欄繪制圖形二：大紅燈籠；

229、輔導學生完成課堂實訓；

230、使用Flash工具欄繪制圖形三：水晶按鈕；

231、簡要步驟：

232、（1）繪制按鈕邊框；

233、（2）填充漸變顏色；

234、（3）繪制按鈕高光部分；

235、（4）繪制按鈕模糊邊框；

236、輔導學生完成課堂實訓；

237、使用Flash工具欄繪制圖形四：QQ企鵝；

四十一、布置課堂作業并輔導學