✨ Flash Lesson 本次亮點

簡報少了一點動態、社群貼文滑過去沒人停下來、官網上的 Logo 靜靜躺著——很多時候，你只是希望「這裡如果會動就好了」。

但真的要做，通常會遇到三個問題：

想學 AE、Lottie，成本太高？外包不一定符合需求？直接叫 AI 做，結果會動但不好看？AI 可以生成動畫，卻不代表知道什麼樣的節奏、動作與風格才適合。

這堂課提供一套更直接的做法：用 Claude Opus 5.5 製作輕量 SVG 網頁動畫，產出單一 HTML 檔，不需要寫程式，也不需要安裝其他軟體。整堂課會從「怎麼讓 AI 做出動畫」一路做到「怎麼讓動畫更好看、改得動」。

• SCENE 提示法｜一次把動畫需求講清楚
  

把動畫需求拆成 Subject、Canvas、Effect、Narrative、Export 五個欄位，讓你不用一直來回修改，而是先把想做什麼說清楚，再交給 Claude 執行。

• 8 個動畫關鍵詞｜讓動作不再只是「會動」
  

從緩動、錯開、預備動作，到超過再回彈、描邊、變形、視差與循環，理解這些動畫語言怎麼影響畫面的節奏與質感。

• 風格方法｜讓 AI 動畫不要一眼就很 AI
  

學習如何從參考作品拆出風格配方，再交給 Claude Opus 5.5，搭配 30 種風格素材庫，讓動畫有更明確的視覺方向。

• 六個實戰作品｜從學會到真的做出來
  

直接跟著課程完成 Logo 描邊開場、Loading 動畫、動態長條圖、手寫字效果、會看滑鼠的小角色，以及懷舊 Flash 風短片。

• 修改與輸出｜不是生成完就結束
  

學會 5 個修改句型與截圖除錯方式，讓你可以針對指定地方修改；完成後再學習分享連結、下載 HTML、嵌入網站、錄成 MP4、轉 GIF，以及放進簡報或社群。

☝️你會學到

三分鐘做出第一個網頁動畫：從 Claude 介面開始，跟著操作完成第一個動畫，建立整堂課後續實作的基礎。

看懂 SVG 動畫的基本概念：認識 viewBox、path、g 群組、fill／stroke、transform 五個 SVG 概念，以及 CSS、SMIL、JavaScript 三種動畫做法；不需要自己寫程式，但能知道 AI 寫了什麼。

SCENE 提示法：用 Subject、Canvas、Effect、Narrative、Export 五個欄位整理動畫需求，讓 AI 更清楚知道你要做什麼。

8 個動畫關鍵詞：掌握緩動、錯開、預備動作、超過再回彈、描邊、變形、視差、循環，讓動畫從單純「會動」進一步有節奏與力量感。

擺脫 AI 感的風格方法：學習從參考作品拆解風格配方，再搭配風格素材庫，建立比較明確的動畫視覺方向。

像導演一樣下指令：學會描述秒數、鏡頭、故事節奏，以及最後補上一行「不要」，讓動畫修改更接近自己的需求。

AI 動畫修改與除錯：利用 5 個修改句型與截圖除錯方式，掌握「一次只改一件事」的原則，降低越改越亂的情況。

動畫輸出與實際應用：學會將完成的動畫分享、嵌入網站、錄成 MP4、轉 GIF，並應用在簡報與社群內容。

👥 適合對象

1.設計師：想讓 Logo、介面或視覺作品增加動態效果，但不想為了簡單動畫投入大量時間學 AE 的人。

2.行銷／社群小編：希望讓社群內容多一點動態，不只使用靜態圖片，也想自己快速製作簡單動畫的人。

3.PM／企劃／老師：需要製作簡報、網站或教學內容，希望能自己完成一些簡單但有質感的動態效果。

4.接案工作者：希望增加自己的服務能力，不必每次遇到小型動畫需求就另外找人處理。

5.完全沒有程式基礎的人：想嘗試 AI 動畫，但不會寫程式也沒有動畫軟體經驗。課程本身不需要程式基礎，也不需要安裝任何軟體。

⏱️ 課程內容

3 分鐘做出第一個動畫｜認識 Claude 與 SVG

從 Claude 介面開始，實際做出第一個會動的畫面，再認識 SVG 的五個基本概念與三種動畫做法。你不需要自己寫程式，但會知道 AI 正在做什麼。

實戰一｜SCENE 提示法：把動畫需求一次說清楚

從「會動，但很醜？」開始，拆解 Subject、Canvas、Effect、Narrative、Export 五個欄位，再重新撰寫提示，理解如何讓 AI 更準確地執行動畫需求。

實戰二｜從「會動」到「好看」：8 個動畫關鍵詞

學習緩動、錯開、預備動作、超過再回彈、描邊、變形、視差、循環等關鍵詞，再搭配風格配方與參考作品，讓動畫有更明確的節奏與視覺方向。

實戰三｜六個作品：把方法真正做出來

依序完成 Logo 描邊開場、Loading 動畫、動態長條圖、手寫字效果、會看滑鼠的小角色、懷舊 Flash 風短片，每個作品都對應到簡報、官網或社群常見的動態需求。

實戰四｜修改、除錯與輸出

學會 5 個修改句型與截圖除錯方式，掌握如何指定修改位置；完成後再將動畫分享、下載 HTML、嵌入網站、錄成 MP4 或轉成 GIF。

加碼｜背後靈節拍機

最後再用自己的角色搭配 Web Audio，讓網頁發出鼓聲，完成一個會跟著節拍跳舞的「背後靈節拍機」互動網頁。

課程結束後，可以帶走 SCENE 提示法範本、8 個動畫關鍵詞、5 個修改句型、30 組動畫提示詞庫、30 種風格素材庫，以及課程中六個作品與加碼作品的範例原始碼。下一次遇到「這裡如果會動就好了」的需求，可以直接從現有方法開始。