許多設計師在 PS 編輯 GIF 時遇到「縮放後幀數錯亂、透明背景變白、檔案過大、存檔後不動」等問題。本文以 Photoshop CS5.1 Extended 為例(各版本操作邏輯一致),詳細講解多幀同步縮放、裁切透明像素、存為 Web 格式優化輸出的標準化流程。
前置準備
- 開啟 PS → 視窗 → 工作區 → 選擇 「動感」(或「動畫」),開啟時間軸/幀面板。
- Ctrl+O 開啟素材 GIF,時間軸面板會顯示所有幀(例:16 幀)。
核心難點:每幀對應獨立圖層,必須逐幀同步縮放
GIF 每幀對應圖層面板的一個圖層(或圖層組)。關鍵操作:選中第 1 幀 → 圖層面板自動高亮對應圖層 → Ctrl+T 自由變換縮放 → 確認。按住選項列「鏈結圖示」可鎖定長寬比,數值輸入同比例縮放(例:33%)。
重複上述動作:選第 2 幀 → 對應圖層 2 → Ctrl+T 同比例縮放 → 確認……直到所有幀完成。切記:每幀操作前必須先在時間軸選中該幀,圖層面板才會自動切換至對應圖層。
裁切多餘透明像素(減小畫布、去除邊緣空白)
- 工具列選 裁切工具 (C),框選保留區域。
- 選單列 影像 → 裁切,或按 Enter 確認。
- 預設「根據透明像素裁切」通常已勾選,直接確定即可精準去除四周透明區塊。
關鍵輸出:存為 Web 所用格式(舊版)/ 匯出 → 存為舊版 Web 格式(新版)
- 選單列 檔案 → 匯出 → 存為舊版 Web 格式(CC 版本路徑;舊版直接「存為 Web 及裝置格式」)。
- 右側預設面板關鍵設定:
- 格式:GIF。
- 顏色:256(最大),或視畫面複雜度降至 128/64 減小檔案。
- 抖動:選 散佈,百分比 88%~100%(漸層畫面需較高抖動)。
- 透明度:勾選,鬆脆邊緣可設
0% 或 128。
- 轉換為 sRGB:勾選(確保瀏覽器色彩一致)。
- 循環選項:永遠(無限循環)。
- 影像大小:若前面已縮放可勾選「縮放至」100%,或在此二次調整輸出尺寸。
進階優化技巧
| 優化目標 |
操作建議 |
| 減小檔案體積 | 降低顏色數(128/64);裁切畫布;刪除冗餘幀;啟用「優化」選項(面板右上選單 → 優化動畫 → 繫結/去除重複幀)。 |
| 修復邊緣鋸齒/白邊 | 原始圖層邊緣羽化 0.5~1px;輸出時「鬆脆」設 0 或取消透明度改用遮罩合成背景色。 |
| 解決存檔後不動 | 必須用「存為 Web 格式」,不可用「另存為」→ GIF(會合併圖層只存第一幀)。 |
| 加速預覽/編輯 | 時間軸面板選單 → 「面板選項」→ 縮圖大小調小;暫時關閉圖層縮圖預覽。 |
常見問題 Q&A
- Q: 為什麼我縮放後畫面變模糊?
- A: 位圖縮放必然損失銳度。建議:原始素材解析度足夠高;縮放後銳化(濾鏡 → 銳化 → Unsharp Mask);或改用向量圖層(形狀圖層/智慧物件)製作動畫再輸出 GIF。
- Q: 如何批次調整所有幀的位置/不透明度?
時間軸面板選單 → 「全選幀」 → 對圖層面板操作(移動/不透明度/樣式)會套用至所有選中幀對應的圖層。
Q: 怎麼把視頻轉 GIF?
檔案 → 匯入 → 視頻幀到圖層 → 選取範圍/每幀間隔 → 確定 → 依本流程輸出。
總結
PS 處理 GIF 核心口訣:工作區切動感 → 逐幀對應圖層 Ctrl+T 同步縮放 → 裁切透明像素 → 存為 Web 格式(GIF、256色、透明度開啟、永遠循環)。掌握此流程,輕鬆解決「小圖不動、白邊、檔案過大」諸多痛點。