Animate CC 網頁動畫與JS互動
49公開內容
藉由Animate CC製作網頁上的動畫，並發佈成HTML5+CANVAS+JAVASCRIPT格式，已是最有效率設計製作專業網頁動畫效果的方式，筆者將藉由此空間分享與介紹Animate CC製作網頁動畫技巧，歡迎一起讓網頁上的內容動起來!
全部內容
免費與付費
最新發佈優先
以影像點陣圖為動畫素材時，除了一般的影像之外，還可以藉由Photoshop處理出去背景的影像素材，以及包含半透明效果的影像素材，也都是動畫中常需要的專業素材準備。
1.挖剪造型影像
影像素材外觀除了是直角矩型外，還需要圓角矩型甚至是其他的外觀造型，此時就需要使用Photoshop的路徑與選取範圍來處
動畫素材除了使用Animate CC工具繪製之外，搭配匯入自Illustrator繪製較精細的動畫素材，也是專業與必要的方式。而在搭配匯入自Illustrator繪製素材製作動畫時的各種方式與技巧，也是動畫素材準備的重點內容。
1.直接拷貝貼上illustrator素材
您可以在 Illustrat
建立文字打散後的漸層編輯應用，設定製作出文字倒影與陰影素材，進而隨後表現其動畫效果。
STEP1.
在深色背景上建立白色文字並打散二次成圖像，各向上、下複製出另二份文字圖像共三份。
首先選取第二份文字，使用油漆桶工具為第二份文字填入黑白線性漸層(請確認使用油漆桶工具於文字上點一下倒入整體漸層)，
使用橢圓、矩型、鋼筆工具建立物件基本造型，搭配物件重疊合併的編輯，以及漸層填色技巧，完成仿3D的場景內之球、舞台、光線、陰影等動畫素材物件。
STEP1.
為方便編輯請先設定場景背景色為灰色，選擇填色為黑白放射狀漸層，繪製正圓形無邊框黑白漸層，再使用漸層變形工具調整漸層中心至圓內左上角，放大漸層範圍
使用鉛筆、鋼筆工具繪製線稿後，藉由完善的修整筆畫功能整理好所有需要的線稿，最後使用油漆桶、墨水瓶填色，搭配物件管理與編輯，完成漸層背景、石頭、水中魚與海草。
STEP1.
使用鋼筆工具與直接選取工具繪製調整出基本構成筆畫，使用『轉換錨點工具』轉換轉折角成平滑曲線，再使用鉛筆工具繪製其他黑線稿（選擇
