Animate CC 設計漸層文字動畫素材

哩老師

發佈於Animate CC 網頁動畫與JS互動

更新於 2025/02/04發佈於 2020/02/05閱讀時間約 2 分鐘

建立文字打散後的漸層編輯應用，設定製作出文字倒影與陰影素材，進而隨後表現其動畫效果。

STEP1.
在深色背景上建立白色文字並打散二次成圖像，各向上、下複製出另二份文字圖像共三份。

首先選取第二份文字，使用油漆桶工具為第二份文字填入黑白線性漸層(請確認使用油漆桶工具於文字上點一下倒入整體漸層)，調整漸層顏色為左：黑Alpha=50%、右：黑Alpha=0%。

再使用漸層變形工具旋轉漸層方向與調整漸層範圍成上方透明。

STEP2.
選取第三份文字，執行『修改 > 變形 > 垂直翻轉』成向下顛倒。

繼續為第三份文字填入黑白線性漸層(請確認使用油漆桶工具於文字上點一下倒入整體漸層)，調整漸層顏色為左：白Alpha=50%、右：白Alpha=0%，再使用漸層變形工具旋轉漸層方向成下方透明。

STEP3.
依序個別群組三組文字，上下靠齊影子與倒影，複選二物件使用變形工具同時左右傾斜二物件。

最後移入第一份文字（更改排列順序:移至最上層）排列完成即可。

相關課程 : 優勢多媒體 - Adobe Animate CC製作HTML5動畫與互動效果

#動畫基礎

#動畫素材準備

哩老師的沙龍Animate CC 網頁動畫與JS互動動畫基礎哩老師的沙龍Animate CC 網頁動畫與JS互動動畫素材準備

留言

留言分享你的想法！

哩老師的沙龍

29會員

129內容數

多媒體設計的專業能力養成過程，除了有效率學習軟體之外，更重要的是各個軟體間的整合應用! Photoshop、Illustrator、Dreamweaver、Animate、CSS、Bootstrap響應式網頁等，相關的整合應用有機會皆會與大家分享喔~

哩老師的沙龍的其他內容

2020/02/05

Animate CC 動畫類型

1. 基本四大類型 AnimateCC的基礎動畫可分為基本四大類型，逐格動畫、形狀補間動畫、傳統(移動)補間動畫、(新的)移動補間動畫，全都是要成為 Animate CC動畫得心應手的必備動畫基礎。 (1)逐格動畫　　　製作方式:依序在要設定內容的時間點上插入關鍵影格，設定更改內容即可。 (2)

2020/02/05

Animate CC 動畫類型

2020/02/05

Animate CC 時間軸與各種影格

要構成動畫的二大元素『時間』與『動畫內容』，在Animate中都是仰賴時間軸控制版，動畫內容即是以圖層來構成，而動畫時間的控制就得仰賴時間軸上的『影格』，來進行動畫設計製作與記錄。 1.時間軸 Adobe Animate CC 中的「時間軸」會隨著時間的經過，在圖層與影格中組織並控制文件內容。就像影

2020/02/05

Animate CC 時間軸與各種影格

2020/02/05

Animate CC繪製漸層球與光動畫素材

使用橢圓、矩型、鋼筆工具建立物件基本造型，搭配物件重疊合併的編輯，以及漸層填色技巧，完成仿3D的場景內之球、舞台、光線、陰影等動畫素材物件。 STEP1. 為方便編輯請先設定場景背景色為灰色，選擇填色為黑白放射狀漸層，繪製正圓形無邊框黑白漸層，再使用漸層變形工具調整漸層中心至圓內左上角，放大漸層範圍