2c559c8ca050317827b25fa0011d1fce
謝慧民
Mail_replay
Qrcode
簡介:

我是謝慧民,資訊與多媒體設計學系二A導師(2019),我還有101張資訊多媒體的相關證照(20190511)。我的專長是虛擬實境、電腦遊戲製作、3D動畫設計、腳本設計、3D空間設計、程式設計等

Wait_for_sign_up 相簿專區
影音專區: 頻道統計圖表
SWF專區:
簡報專區:
作業專區:




第十一週期中考: (2019.11.25)

  • 資多二A :
    • 按鈕設定練習:
      1. 場景建立一個文字,轉為按鈕元件,影格有四格,在2-4格加入關鍵影格,然後更改字的顏色。
        選擇物件,在視窗選單選程式碼片段,加入動作展開的按一下前往網頁的片段。
      2. 按ctri+enter執行看看滑鼠移入點按開啟網頁效果是否可用。
      3. 下載一個按鈕圖案,到Photoshop去背,然後複製圖層選取中間的顏色區塊,以色調飽和度明度等功能調參數讓色調變化,做三個圖層,存為psd檔。
      4. 到Flash匯入這個資源到元件庫,選所有圖層,匯入後依序取代按鈕元件四格內的文字,執行看看,按鈕可否使用。
      5. 到Photoshop自建按鈕:開一個300x300的透明圖層,用橢圓工具建立按鈕外框區,然後加入圖層混合的陰影及斜角與浮雕,做出立體樣子的按鈕,然後一樣更換顏色另存新檔為.png格式。匯入Flash步驟與前面相同。
    • 操作錄影:錄影11-1錄影11-2錄影11-3錄影11-4錄影11-5錄影11-6錄影11-7錄影11-8錄影11-9錄影11-10
    • 加分操作練習:範例11a

第十週期中考: (2019.11.18)

  • 資多二A :
    • 延續之前教過功能的運用:
      1. 殘影動畫:新元件圖像打你的姓名,到場景拉入,做從小變大的傳統補間動畫,做一個新的圖層將這個動畫複製(Alt拖拉)到新圖層的第5格位置,修改前後透明度為20及50,同樣在新增一個圖層,拖拉複製前面的動畫近來在第10個影格位置,播放看看是否有殘影。
      2. 從場景的動畫轉為元件:從場景中選取要轉元件的圖層影格,複製影格,新增元件為影片片段,再貼上影格,則可以把剛剛的圖層及影格搬入這個元件,你可以在場景中新增圖層,再拖拉這個元件進去,播放時跟原來的動畫一樣。
      3. 製作文字亮光動畫:先製作一個文字元件,TLF,選一個V開頭的字體,大小100,打入Flash,然後新增一個圖層加入矩形,在顏色方塊選漸層,並將黑色調為白色,然後中間做一個控制點,兩端的alpha設定為0,就可以看到拉出的矩形為開始透明轉白在透明的漸層效果,將形狀旋轉一個角度,在最後影格加入關鍵影格拉矩形到字的右端,製作形狀漸變,再將文字圖層再製,拖拉到最上面,按右鍵加入遮罩,則底下的矩形動畫就變成上方文字的遮罩,動畫經過的區域才會有字型亮亮的出現。
      4. 製作打字機動畫:先製作文字「台灣首府大學歡迎您!」,按右鍵打散,再按右鍵選打散到圖層,再將影格移動到第5格,然後分別將影格移到要顯示的位置,最後在後面5個影格位置選全部圖層的該影格按右鍵新增影格,波看看有沒有一個字一個字播放。再來到第一個圖層新增一條線代表游標,然後轉為元件,在這個元件第3個插入關鍵影格,再清除影格,第5格加入空白關鍵影格,播放時就是閃爍,到場景中在各字出現的位置加入關鍵影格,再來調整游標到字後方,播放時就像打字機這樣播放了。

    • 操作錄影:錄影10-1錄影10-2錄影10-3錄影10-4
    • 加分操作練習:範例10a

第九週期中考: (2019.11.11)

  • 資多二A :
    • 期中考題目解說:期中考題
    • 利用導線路徑動畫加入角色動畫元件,然後重新將角色加入路徑中。
    • 在此檔案中加入從你的學號變到你的姓名的顏色形狀動畫(請將文字轉為形狀後再做)
    • 做期中考第四題的錄影
    • 做期中考第五題的錄影
    • 操作錄影:期中考錄影4期中考錄影5
    • 加分操作練習:範例9a

第八週上課: (2019.11.04)

  • 資多二A :
    • 期中考題目解說:期中考題
    • 說明如何從其他檔案將元件載入這個檔案,運用在此專案的場景(靠元件庫切換)
    • 利用導線路徑動畫加入角色動畫元件,然後重新將角色加入路徑中。在此檔案中加入從你的學號變到你的姓名的顏色形狀動畫(請將文字轉為形狀後再做)
    • 做期中考第一題的錄影
    • 做期中考第二題的錄影
    • 做期中考第二題的錄影
    • 操作錄影:錄影8-1錄影8-2期中考錄影1期中考錄影2期中考錄影3
    • 加分操作練習:範例8a

第七週上課: (2019.10.28)

  • 資多二A :
    • 英文與中文功能區對照說明
    • Flash 發展演變:Flash維基百科
    • 角色套骨架動畫的結構,角色一加入骨架就被綁進去一體成形,不能再編輯。
    • 匯入一張透明角色(Stick figure),加一個元件(Symbol)將圖拉進去按右鍵解散,使用橡皮差工具擦去不要的部分,拉骨架套入,當進行拉動骨架動畫時,圖形立即散開,所以點陣圖不適合套入骨架,圖必須重描,可以使用鋼筆工具、鉛筆工具、畫線工具,把筆畫條粗,進行繪製。
    • 觀看很炫的火柴人動畫的製作流程,他是一格一格繪製的動畫,不是骨架套入的。
    • 新增一個元件,使用鋼筆工具拖拉製作一個人型,再使用形狀_將線條轉為形狀的功能轉為shape,這樣就可以用剛剛套骨架的方式進行加入骨架,並進行動畫關鍵格設定。
    • 下載動作分解圖,按照動作分解圖將不同影格處的關節調成與該動作相同,然後播放看看,如果是要播完停止動畫,則在該元件新增一個圖層,然後在最後一格新增空白關鍵影格,按右鍵加入動作指令stop();,則可以將元件拖拉到場景,ctrl+enter測試播放看看動畫有沒有停止在最後一格。
    • 你可以在元件庫使用重製元件,改名後修改影格的動作,按Alt鍵拖拉影格則可以複製該影格的資訊到其他影格成為新的關鍵影格。 你也可以使用場景圖層套用預設動畫如水波動畫來增加動畫趣味。
    • 加分操作練習:範例7a

第六週上課: (2019.10.21)

  • 資多二A :
    • Flash CS5教學投影片:投影片
    • 遮色片:載入一張背景圖放入場景,圖層在第40格插入影格,再新增一個圖層,第一個畫一個星形,第40格插入關鍵影格,將星形放大到蓋住背景,再來製作形狀補間動畫,在此圖層按右鍵加入遮色片,然後播動畫可以看到轉場動畫效果。
    • 加入一個圖層,在第20格插入空白關鍵影格,載入另一張圖片,在第40格處加入影格,拉到遮色片底下。則播完第一張圖後再播第二張圖。
    • 製作一個元件(Symbol),加入一個Bannar的圖片,將元件屬性改為影片片段,套預設動畫效果的翻轉,再將這個元件拉入場景排到兩圖上方,則bannar也在場景裡面跟著轉場出現。
    • 新增一個圖層,在最後一格新增空白關鍵影格,在動作輸入stop();,則ctrl+enter後不會重複播放。
    • Bannar元件製作移動補間動畫,使用3D旋轉及3D轉譯,在相關的影格改變物件的方向及位置,然後可以另存成移動預設效果,提供給另一個物件套用。
    • 不同檔案之間元件與圖片的切換使用,利用元件庫的下拉選單選檔案再選元件拖拉到場景即可。
      加分操作練習:範例6a

第五週上課: (2019.10.14)

  • 資多二A :
    • Flash CS5教學投影片:投影片
    • 下載小綠人的圖片資料
    • 先開啟新檔選actionscript 3.0,然後建一個元件是影片片段命名為小綠人,匯入圖片到元件庫。
    • 這時影片片段的元件沒有東西,再做一次匯入影像檔案到元件庫選第一個檔,對話出現選全部影像導入,然後出現一個對話選取代原來元件,則小綠人的元件出現了18張有關鍵影格的動畫。將元件拉入場景,Ctrl+enter測試影片,可以跑,太快的話修改速度為6fps。
    • 重製一個小綠人元件命名為向右,然後修改每個關鍵影格的圖片為水平翻轉,測試動畫則是向右走的小綠人,這些圖片都可以事先用Photoshop處理為透空貼圖。
    • 場景新增背景圖層,加入背景圖調成畫布大小,將背景圖層拉到最下層。
    • 把向左走、向右走的兩個角色拉入,各放在路徑的末端,然後在中間做關鍵影格將角色位移向前,最後兩個碰在一起,請在關鍵格間按右鍵做傳統補間動畫。然後測試播放看看動畫順不順。
    • 建立一個影片片段元件,拉入一個角色照片(如熊讚),新增圖層使用鋼筆工具描繪邊框,再做細部調整,再使用油漆桶工具填滿黑色。再新增一個圖層,使用鋼筆工具描嘴巴,填滿白色,然後選取兩個圖層按右鍵轉換為元件,命名為熊讚ok,再來去掉邊線。 在場景新增圖層,拉入熊讚ok的元件,解散元件,在第18格加入關鍵影格,把熊讚刪除,拉一個橢圓填不同顏色,去掉邊線,然後製作之間的形狀漸變動畫,則熊讚慢慢轉變成橢圓。
      加分操作練習:範例5a

第四週上課: (2019.10.07)

  • 資多二A :
    • Flash CS5教學投影片:投影片
    • Flash導引線:圖層放入物件,在40影格新增關鍵影格,加入傳統捕間動畫,在該圖層按右鍵選增加導引線,然後使用畫線工具拉出路徑位置,影格1的位置再拖拉物件到路徑起點,影格40的位置拖拉物件到路徑終點。可以用選取工具修改路徑,可以再關鍵影格處用縮放工具修改物件。
    • 放入有道路的背景圖,文件修改尺寸,背景圖修改尺寸為文件尺寸,再調整路徑及物件的位置,ctrl+enter預覽動畫。
    • 形狀補間動畫:新增圖層,使用繪圖工具做出封閉區間,去掉外邊緣線,在40影格處增加關鍵影格,刪除原有物件,新繪一個不同形狀的物件,然後製作形狀補間動畫,可以移動40影格物件的位置,則除了形狀變外,也會有移動補間動畫。
    • 新增圖層打入文字,按右鍵打散,同樣的在40影格增加關鍵影格,刪除字,再打相同的字換字型打散,製作形狀補間動畫。 外來圖片無法製作想要的形狀補間效果。
    • YouTube有許多教學影片,關鍵字打對就可以找到很多並下載(使用4kvideo downloader)
      加分操作練習:範例4a

第三週上課: (2019.09.30)

  • 資多二A :
    • Flash CS5教學投影片:投影片
    • Flash的移動補間動畫說明
    • 下載一個多拉A夢的圖片,新增一個元件,將圖片載入拉進去,然後再從元件庫拉此元件到場景內,在影格20處按右鍵產生影格後插入移動補間,起始格到20格之間變成淺藍色的填色
    • 請在20格處選物件拖拉到第二個位置,並將綠色線拖拉成想要移動的曲線軌跡
    • 右手邊有補間動畫的屬性值可以調整。
    • 使用選取工具可以改變路徑的形狀,按右鍵可以全部轉換成關鍵影格,也可以獨立插入關鍵影格的位置、縮放等部分資料
    • 使用Photoshop處理圖片透空存檔,然後載入之後更換元件,則場景內的角色就會變透空了,過切換描圖紙按鈕看到影格物件重疊的情況,也可以直接選到對應影格的物件直接編輯。
    • 下載一個背景是天堂下來階梯的圖,然後拉到場景,設定與圖大小相同
    • 依序調整每個影格的物件到階梯上,ctrl+enter可以預覽執行狀況並產生.swf檔。 存檔及發布設定,成果執行網頁瀏覽。
    • 加分操作練習:範例3a

第二週上課: (2019.09.23)

  • 資多二A :
    • Flash CS5教學投影片:投影片
    • Flash功能表、工具列位置,切到傳統介面,時間軸在上方,工作區在下方、工具列在左方
    • 場景繪圖,有筆畫與填滿,可更換顏色、筆刷大小、重疊處會蓋住下方圖片,移開時變空白區域,改用元件建立則不會影響下方的圖片。
    • 建立一個影像的元件,練習泰迪熊圖片複製貼入元件中,並在元件庫中拖拉進場景並調位置及大小。
    • 開啟一個範例,載入Flash中成為另一個場景,開啟該檔元件庫,直接拖拉到起始場景變成該場景的物件,元件也可以由檔案匯入。
    • 加分操作練習:範例2a

第一週上課: (2019.09.16)

  • 資多二A :
    • 3D軟體(Adobe)與3D軟體(Autodesk)市場上區別,二年級主要以2D為主,三年級則上3D相關軟體
    • 2D動畫軟體:向量式圖形及影像式圖形
      1. Adobe Flash(CC版的Animate)
      2. Comic Studio
      3. Clip Studio Paint(正式版提供動畫功能)
      4. CrazyTalk Animator
    • 課程進度安排介紹、使用教科書及參考書(大部分時間會使用Flash CS5)。
    • 2D座標系統及2.5D的深度方向多層差異
    • 運鏡及腳本概念
    • 證照說明、專題製作

版權所有©2019 謝慧民