Claude Opus 5 + Higgsfield AI = 輕鬆做出 AI Motion Graphics ☕ Buy me a coffee

🧑‍🏫 這支影片示範把 Claude 接上 Higgsfield（集合多種圖片、影片 AI 模型的生成平台），用聊天的方式做出動態字卡、logo 動畫、介面展示和產品廣告。重點是一個避開「AI 影片會把字弄壞」的做法：先用圖片模型把畫面做好，再讓影片模型只負責動起來。不會專業動畫軟體的人也能照著做。

• 00:01 傳統做 motion graphics 要在 After Effects 花好幾小時設定圖層、keyframes 和微調；用 Claude Opus 5 可以直接從對話做出成果
  ↳ motion graphics（動態圖像）是讓文字、圖形動起來的影片。以前要開 After Effects（專業動畫軟體），設好 keyframes（標記某個時間點物件狀態的點）再慢慢調。現在跟 Claude 對話就能做出來。
• 00:01 所有影片模型只要一讓文字動起來就會把字弄壞，所以要先學會一個繞過這個問題的技巧
  ↳ 影片模型是把文字或圖片變成影片的 AI。它們一碰到「字要動」，字就容易歪掉或變成亂碼。所以整支影片的關鍵，是一套避開這個弱點的做法。
• 00:01 第一步：從說明欄連結開啟 Higgsfield，進入 MCP 頁面，選 Claude 分頁並把 MCP 開關打開
  ↳ MCP 是讓 Claude 呼叫外部工具的連接方式。在 Higgsfield 的 MCP 頁面選 Claude、把開關打開，等於先允許兩邊對接。
• 00:31 複製 connector URL，到 Claude 的 customize → connectors 新增一個，命名 Higgsfield，貼上 URL，再連線並登入
  ↳ connector 是 Claude 裡接外部服務的連接設定。把 Higgsfield 給的網址貼進 Claude 設定，新增一個 connector，再登入帳號，兩邊就接通了。
• 00:31 之後每個對話都能直接用這些模型，消耗的是你自己的 Higgsfield credits，要確認方案涵蓋你的用量
  ↳ 接好後，在 Claude 的任何對話裡都能叫 Higgsfield 生圖、生影片。花的是你 Higgsfield 帳號的 credits（點數），用越多扣越多，記得先看方案夠不夠。
• 00:31 要確認選的是 Opus 5，因為所有的思考都由它負責
  ↳ 實際生圖的是 Higgsfield 的模型，但想畫面、寫指令、排流程都是 Claude 在做。所以要選 Opus 5 來當這個「導演」。
• 00:31 先跟 Claude 說明要做四個複雜度層級的 motion graphics，從最基本到最進階
  ↳ 作者一開始就跟 Claude 說好整體目標：做四支由淺到深的範例。Claude 知道全貌，才能幫你把每一步排好。
• 01:01 Claude 給出處理文字的流程：先用圖片模型生成靜態圖，再把靜態圖餵給影片模型，依已核可的畫面鎖定視覺
  ↳ 解法是分工。圖片模型擅長把字畫清楚，就先用它產 stills（靜態畫面）。你確認滿意後，再交給影片模型只負責動，畫面的樣子就被固定住了。
• 01:01 暖身範例是 stat card：一個大數字加底下一行字。Claude 給四個方向，各自已定好文字、顏色、氛圍；作者選 2.4 million 和 48 times
  ↳ stat card 就是簡報常見的「大數字＋一行說明」。Claude 先提出四套已經配好文字、顏色、氛圍的方案，你只要挑就好，不用從零開始想。
• 01:32 圖片模型選項：GPT Image 2、兩種 Nano Banana、Seedream、Soul、Cinema Studio Image；作者選 GPT Image 2
  ↳ 圖片模型就是負責生圖的 AI，Higgsfield 上有好幾款可以選。作者這次用 GPT Image 2，其他款也能用。
• 01:32 GPT Image 2 解析度有 1K/2K/4K，品質有 low/medium/high，預設 low；因為畫面文字要給人讀，選 4K + high
  ↳ 解析度越高，畫面越細；品質越高，細節越多。預設是最低品質，但字要給人看清楚，所以作者直接選 4K 和 high，避免字糊掉。
• 01:32 影片模型選項：SeaDance、Cling、Vio、Gemini Omni Flash、Cinema Studio（依字幕拼法）；都做得到，差在想要的動態；作者選 Sea Dance
  ↳ 這幾款影片模型都做得出來，差別在動起來的感覺。挑一款符合你想要的動態風格就好。
• 02:02 Sea Dance 三版本：2.5 可做 4–30 秒、最高 1080p；2.0 最長 15 秒但可到 4K；Mini 最便宜、上限 720p
  ↳ 同一款分三個版本：2.5 片長 4 到 30 秒、畫質最高 1080p（一般高畫質）；2.0 最長 15 秒，但能出 4K（更細的超高畫質）；Mini 最便宜，畫質上限 720p。
• 02:02 範例不需要 30 秒或 4K，三版都行；作者選 2.5、1080p，因為它最新
  ↳ 這種幾秒鐘的小字卡，不需要長片也不需要 4K，三個版本都夠用。作者選 2.5 只因為它最新，不是非它不可。
• 02:02 比例選 16:9，另有 9:16、正方形、4:3；圖片和影片的比例必須一致，否則會被裁切或兩側出現黑邊
  ↳ 比例就是畫面的長寬比，16:9 是橫式、9:16 是手機直式。圖和影片的比例要一樣，不然影片會被切掉一塊，或兩側補上黑邊。
• 02:33 比例要設成獨立設定、不寫進 prompt，因為 prompt 描述的比例和設定不同時，模型會混亂
  ↳ prompt 就是給 AI 的文字指令。比例在介面上設定就好，不要再寫進 prompt。兩邊講的不一致時，模型會不知道該聽誰的。
• 02:33 到這裡只剩影片長度和是否有聲音沒定，這兩項每支都不同
  ↳ 其他設定都能一直沿用。只有片長和要不要聲音，要看每支影片的內容再決定。
• 02:33 每個 prompt 開頭都一樣：先列出必須完全不變的東西（顏色、光線、顆粒），最後才講唯一要改變的那件事
  ↳ 每段 prompt 先列出「不能變」的顏色、光線、grain（畫面的顆粒質感），最後才說這次要改什麼。先把規矩講清楚，再交代任務。
• 02:33 這樣能防止背景在兩張圖之間偏移；背景一偏移，動起來就會變成閃爍
  ↳ 兩張圖的背景只要色調或光線差一點，影片模型在兩張之間過渡時，背景就會忽明忽暗，看起來像在閃。
• 03:03 第一張卡先做空背景：平的暖紙色、上面什麼都沒有
  ↳ 第一張刻意只做一張乾淨的暖色紙背景，上面什麼都不放，當作之後所有畫面的底。
• 03:03 影片中用到的所有 prompt 和模板都放在說明欄的免費 kit 裡
  ↳ 作者把影片裡用到的 prompt 和模板整理成免費資料包，放在影片說明欄，可以直接拿來改。
• 03:03 後面所有畫面都沿用這張背景的顏色和光線，所以要先把它做精準，再往上加東西
  ↳ 背景是地基，後面每張圖都照它的顏色和光線走。地基先做對，疊上去的東西才不會走樣。
• 03:03 再把同一張背景當 reference 放回去，把文字加上去，完成卡片
  ↳ reference 就是丟給模型的參考圖。把剛做好的空背景丟回去，請模型在上面加字，背景就能保持一模一樣。
• 03:03 文字非常銳利，原因是它是用圖片做的，不是用影片模型做的
  ↳ 字是圖片模型畫的，影片模型只負責讓它出現，不會重畫字，所以字不會壞掉。
• 03:33 在這兩張圖之間做動畫，5 秒、無聲；每個元素淡入定位後就停在原位
  ↳ 把空背景當開頭、完成的卡片當結尾，請影片模型補出中間的過程：元素淡入，到位後停住。長度 5 秒，不加聲音。
• 03:33 48 times 卡流程完全相同：先做空的薄荷色背景，再以它為 reference 加上文字，其他都保持不變
  ↳ 第二張卡照同一套流程做：先做空的薄荷色背景，再拿它當參考加上字。流程完全一樣，只換了顏色和內容。
• 03:33 差別在動畫：第一張是淡入，這張是帶輕微 overshoot 的彈入再定住，一樣 5 秒無聲；同樣流程卻感覺完全不同
  ↳ overshoot 是彈進來時稍微衝過頭、再退回來停住，有種「蹦」出來的感覺。同樣兩張圖，只改一句動畫描述，感覺就完全不同。
• 04:04 這兩支都只用兩張圖加一句話；但元素都只是在原位出現，一旦要跨畫面移動就行不通，解法是在中間加第三張圖
  ↳ 兩張圖加一句話，只適合「在原地出現」。如果東西要從 A 移到 B，模型不知道中間怎麼走，就要多給一張途中的圖。
• 04:04 下一個範例是 logo 動畫，也讓 Claude 發明品牌，要求 editorial 風格，因為這類 logo 通常設計得很好
  ↳ logo 範例也讓 Claude 自己編一個品牌。作者指定 editorial 風格，也就是雜誌、出版品那種講究排版和字型的質感，因為這類 logo 通常設計得很好看。
• 04:04 Claude 給出 Pharaoh，一家做字型的公司；R 的底部被斜切，切面填深紅色，像書頁染色的邊
  ↳ Claude 編出一家字型公司 Pharaoh。R 的底部斜切一刀，切面塗成深紅色，像書頁邊緣染色。這種小細節讓 logo 有記憶點。
• 04:35 Claude 在生成任何東西前就先決定外觀，之後每張圖都照抄這個外觀
  ↳ Claude 在生成任何圖之前，就先把 logo 長什麼樣講定，之後每張圖都照這個樣子做。先定規格再生圖，每張才會長得一樣。
• 04:35 這次要三張圖：第一張全黑空背景，必須完全平，任何顆粒或陰影動畫時都會在字母底下移動
  ↳ 這次用三張圖。第一張是純黑背景，而且要完全平整。只要有顆粒或陰影，動畫時就會在字底下晃，很明顯。
• 04:35 第二張是單獨的 R，正中央、約畫面一半高；完整單字直接以這張為基礎生成，字形會延續，不用再重新描述
  ↳ 第二張只放一個 R，在畫面正中央。完整的單字直接拿這張 R 當參考來做，字型會自然延續，不用再描述一次。
• 05:06 動畫設定：黑背景當起始、完整單字當結尾、R 放中間當途中要靠近的大致目標
  ↳ 黑背景當開頭、完整單字當結尾，單獨的 R 放在中間，等於告訴模型「途中大概要經過這個樣子」。
• 05:06 成果：R 先單獨淡入，接著縮小定位，其餘字母在周圍補上，共 6 秒
  ↳ 做出來是 R 先自己出現，接著縮小移到定位，其他字母在旁邊補上。6 秒，就是一段像樣的 logo 開場。
• 05:06 但這仍然只是黑畫面上一個東西在動，實際需要的畫面通常複雜得多
  ↳ 不過到這裡，都還只是黑底上一個東西在動。實際工作上要的畫面，元素通常多很多。
• 05:37 下一個範例改成把多張圖串起來：類似 iPhone 的設定面板，切換主開關後下方全部跟著開，按 save 後顯示確認
  ↳ 下一個範例把多張圖串成一段：模仿 iPhone 的設定頁，打開總開關後下面跟著全開，按下儲存後出現確認。
• 05:37 圖一張一張做，每張先檢查過再往下做
  ↳ 每做好一張就先檢查，沒問題才做下一張。後面的圖都拿前一張當參考，前面錯了會一路錯下去。
• 05:37 四張圖：①全關、save 灰色；②主開關開、save 變藍；③其他三列跟著開，游標往 save 移動；④點擊後 save 收成綠色勾勾
  ↳ 四張圖就是四個關鍵狀態，像漫畫的四格：全關 → 總開關打開、儲存鍵變藍 → 其他也打開、游標往儲存鍵移動 → 點下去變成綠色勾勾。
• 06:08 成果完全看不出是四張不同的圖
  ↳ 做出來的影片很順，完全看不出是四張圖接起來的。
• 06:08 做介面類一定加的規則：游標要落在右側的開關上，不是落在文字上，因為位置不對最容易穿幫
  ↳ UI 是使用者介面，也就是 App 的畫面。做這類畫面時，游標要點在右邊的開關上，不是點在文字上。位置點錯，觀眾一眼就覺得假。
• 06:08 Claude 另外補了一條作者沒想到的規則：開關圓點必須保持正圓，否則滑動時會被拉長
  ↳ Claude 還主動補了一條規則：開關上的小圓點要維持正圓，不然滑動時會被拉成橢圓。這是作者自己沒想到的細節。
• 06:08 四張圖一起做成一個 8 秒的單一鏡頭，第三張放中間，讓游標往下移到 save
  ↳ 四張圖做成一段 8 秒、不中斷的鏡頭。第三張放在中間，讓游標有方向，往下走到儲存鍵。
• 06:08 這是第一支有聲音的，只用介面音：游標 whoosh、開關切換 click、按下時較深的 click、勾勾出現的 pop
  ↳ 這支開始加聲音，但只用介面音效：游標移動的咻聲、開關切換的喀聲、按下時比較低沉的喀聲、勾勾出現的啵聲。
• 06:38 聲音對 motion graphic 的作用比一般人以為的大；click 剛好對上開關切換的瞬間，才會像真的介面而不只是會動的圖
  ↳ 聲音的作用比大家以為的大。喀聲剛好對上開關切換的那一刻，看的人就會覺得這是真的 App，而不只是一張會動的圖。
• 07:09 前面每支的鏡頭都是固定不動，不像真正的廣告；最後一支做產品廣告，由鏡頭負責主要動態
  ↳ 前面幾支的鏡頭都固定不動，所以不像真的廣告。最後一支改由鏡頭移動來帶出主要動感，做成產品廣告。
• 07:09 要求 hyper motion、快速鏡頭、3D render，並讓 Claude 自己挑一個材質值得拍的產品
  ↳ 作者要的是 hyper motion（高速、動感強的鏡頭風格），搭配快速鏡頭和 3D render，也就是電腦算出來的立體畫面。產品則讓 Claude 挑一個材質值得拍的。
• 07:09 Claude 選了 patisserie 糖果棒 Halo：霧面紙、鋁箔、燙金、亮面巧克力、熔融焦糖，在鏡頭下各有不同表現
  ↳ Claude 選了法式甜點風格的糖果棒 Halo。霧面紙、鋁箔、燙金、亮面巧克力、熔化的焦糖，這些材質在鏡頭下反光各不相同。
• 07:09 選材質的理由：鏡頭移動很快時，真正看得到的只有光線滑過物體表面
  ↳ 鏡頭快速掠過時，觀眾其實看不清細節，只看得到光在表面滑過。所以材質越多樣，畫面越有看頭。
• 07:40 先做 product sheet；兩半之間拉出的焦糖是關鍵畫面，決定後續所有畫面中糖果棒的樣子
  ↳ product sheet 是產品外觀的參考圖。其中糖果棒掰開、焦糖拉絲的那個畫面最關鍵，後面所有畫面裡的糖果棒都照它的樣子。
• 07:40 再做 storyboard，作者自訂規則：storyboard 不要放數字，因為數字通常會跑進影片、把畫面搞砸
  ↳ storyboard（分鏡圖）是一格一格排出鏡頭順序的圖。作者規定不要標數字，因為格子上的編號常被模型當成畫面內容，跑進影片裡。
• 07:40 storyboard 每一格看起來都像同一場拍攝
  ↳ 分鏡圖每一格的光線、色調、質感都一致，像同一天在同一個攝影棚拍的，影片才會連貫。
• 07:40 做成 18 秒影片：sheet 和 storyboard 都當 reference，但都不當 start frame
  ↳ 產品參考圖和分鏡圖都丟給模型當參考，但兩張都不設成 start frame（影片的第一個畫面），最後做出 18 秒的影片。
• 07:40 若把格狀圖當 start frame，模型會直接動畫那張格狀圖，變成六格在畫面上滑動，而不是一支影片
  ↳ 如果把格狀的分鏡圖設成第一個畫面，模型會以為要讓那張拼圖動起來，結果就是六個格子在畫面上滑來滑去。
• 08:10 sheet 告訴模型糖果棒長什麼樣，storyboard 決定鏡頭順序，其餘全靠鏡頭運動
  ↳ 分工很清楚：產品參考圖管糖果棒長怎樣，分鏡圖管鏡頭的先後順序，剩下的動感全靠鏡頭運動。
• 08:10 鏡頭全片只停兩次，是刻意的：只有那兩刻 Halo 字樣能靜止，快速鏡頭一拖動文字就會崩壞
  ↳ 鏡頭只停兩次，是刻意的。鏡頭快速移動時字會糊掉，只有停下來的那兩刻，Halo 字樣能清楚地讓人看到。
• 08:47 成果：完整 18 秒沒有任何剪接；鏡頭螺旋穿過焦糖時，焦糖的表現真的像焦糖
  ↳ 成果是 18 秒一鏡到底，中間沒有剪接。鏡頭繞著穿過焦糖時，焦糖黏稠拉絲的樣子很真實。
• 08:47 設定好後可做 title cards、logo 動畫、自家產品 UI demo、explainer graphics 等原本要開 After Effects 的東西
  ↳ 這套接好之後，片頭字卡、logo 動畫、自家 App 的操作展示、說明動畫，這些原本要開專業軟體做的東西，都能用對話完成。
• 08:47 核心觀念只有一個：先把圖做好，再讓模型在圖與圖之間做動畫
  ↳ 核心只有一句：先用圖片模型把每個畫面做好，再讓影片模型負責圖和圖之間的動作。各自做擅長的事。

影片中為什麼要把畫面比例設成獨立設定，而不寫進 prompt？