教學大綱表
請遵守智慧財產權,勿使用非法影印教科書,避免觸法。
課程名稱 (中文) 網頁動畫與設計
(英文) Web Animation And Design
開課單位 事業經營學系
課程代碼 B3670
授課教師 王光正
學分數 2.0 必/選修 選修 開課年級 大三
先修科目或先備能力:
課程概述與目標: 透過網頁動畫的學習與製作,使得網頁的表現更多元化、內容更生動活潑、增加與網頁使用者的互動,學習使用動畫設計工具,培養同學以說故事的方式將抽象的想法具體表現出來。
活用Flash動畫軟體與Dreamweaver網頁設計軟體,學習如何將文字、圖形(點陣圖與向量圖)、影音結合起來,透過時間軸的安排、場景的配置、以及動畫的技巧,將企業的各種活動以2D或3D的方式呈現在網頁上。
教科書 1. 呂昶億、杜慎甄(2011),Flash CS5.5 全新進化,台北:松崗。
2. 王光正,自編講義。
參考教材 李啟宏(2010),動畫設計驚歎號:至高的Flash網頁動畫88招,台北:精誠資訊。
課程大綱 學生學習目標 單元學習活動 學習成效評量 備註
單元主題 內容綱要
1 網頁動畫介紹 1.介紹動畫概念、演進與趨勢
2.教學評量說明
1.介紹動畫概念、演進與趨勢
2.教學評量說明
 
2 點陣圖去背練習 學習在PHOTOSHOP中,將照片去背 學習在PHOTOSHOP中,將照片去背
  • 上機實習
  • 上機測驗
  •  
    3 向量圖繪製01 海報設計 1. 模仿圖庫中的海報
    2. 將其轉換為向量圖
    3. 在AI中置入各個向量圖片
    4. 加入文字效果
  • 上機實習
  • 上機測驗
  •  
    4 向量圖繪製02 1. 繪製大同LOGO
    2. 毛髮去背
    1. 活用AI繪製大同LOGO
    2. 在PSD中學習毛髮去背的技巧
  • 上機實習
  • 上機測驗
  •  
    5 動畫入門訓練 1.點陣圖的編輯
    2.向量圖的編輯
    1.點陣圖的編輯
    2.向量圖的編輯
     
    6 動畫入門訓練 Flash軟體入門簡介與操作 Flash軟體入門簡介與操作
  • 期中考
  •  
    7 動畫基本練習 1.逐格動畫
    2.補間動畫
    3.形狀動畫
    4.遮色片的使用
    5.場景製作
    1.逐格動畫
    2.補間動畫
    3.形狀動畫
    4.遮色片的使用
    5.場景製作
  • 上機測驗
  •  
    8 動畫基本練習 1.逐格動畫
    2.補間動畫
    3.形狀動畫
    4.遮色片的使用
    5.場景製作
    1.逐格動畫
    2.補間動畫
    3.形狀動畫
    4.遮色片的使用
    5.場景製作
  • 上機測驗
  •  
    9 動畫基本練習 1.按紐元件
    2.濾鏡效果
    3.文字工具
    1.按紐元件
    2.濾鏡效果
    3.文字工具
  • 上機測驗
  •  
    10 動畫整合練習 1.自訂主題製作簡單動畫
    2.實際發布上網
    1.自訂主題製作簡單動畫
    2.實際發布上網
  • 上機測驗
  •  
    11 動畫整合練習 1.自訂主題製作簡單動畫
    2.實際發布上網
    1.自訂主題製作簡單動畫
    2.實際發布上網
  • 期中考
  •  
    12 動畫進階 Flash程式碼(AS3)介紹 Flash程式碼(AS3)介紹
  • 上機測驗
  •  
    13 動畫進階 Flash程式碼(AS3)介紹 Flash程式碼(AS3)介紹
  • 上機測驗
  •  
    14 期中報告 Flash動畫實作並上網 Flash動畫實作並上網  
    15 期中報告 Flash動畫實作並上網 Flash動畫實作並上網  
    16 動畫新趨勢 1.HTML + CSS + jQuery介紹
    2.Dreamweaver的活用
    1.HTML + CSS + jQuery介紹
    2.Dreamweaver的活用
  • 上機測驗
  •  
    17 動畫新趨勢 jQuery的基本語法與應用 jQuery的基本語法與應用
  • 上機測驗
  •  
    18 動畫新趨勢 jQuery的基本語法與應用 jQuery的基本語法與應用
  • 上機測驗
  •  
    19 動畫新趨勢 好用的jQuery 外掛程式 好用的jQuery 外掛程式
  • 上機測驗
  •  
    20 動畫新趨勢 好用的jQuery 外掛程式 好用的jQuery 外掛程式  
    21 動畫新趨勢 簡易資料庫的展現
    jQuery + Ajax + XML
    簡易資料庫的展現
    jQuery + Ajax + XML
     
    22 動畫新趨勢 簡易資料庫的展現
    jQuery + Ajax + XML
    簡易資料庫的展現
    jQuery + Ajax + XML
  • 上機測驗
  •  
    23 動畫新趨勢 手機版的網頁設計
    jQuery Mobile
    手機版的網頁設計
    jQuery Mobile
     
    24 期末報告 jQuery動畫實作並上網 jQuery動畫實作並上網
  • 期末考
  • 學期成績試算
  •  

    教學要點概述:
    教材編選: ■ 自編教材 ■ 教科書作者提供
    評量方法: 期末考:15%   期中考:15%   其他評量:1%   上機測驗:69%  
    教學資源: □ 教材電子檔 □ 課程網站
    扣考規定:http://eboard.ttu.edu.tw/ttuwebpost/showcontent-news.php?id=504