Matrix 作者群裡有不同的作者問過幾次做 GIF 圖的問題：寫文章的時候經常用到 GIF 動圖展示 App 的交互和使用方法，出於對網站訪問速度和服務器流量方面的考慮，不少網站對上傳圖片的體積有嚴格的限制，比如少數派對於 GIF 的體積限制為 2.5 MB，如何做一張畫質好、體積小的 GIF 動圖就成了難題。
我在過去幾年寫文章的過程中做過一些 GIF 動圖，用過不少工具和方法，剛好借這個機會分享一些我用過的 GIF 製作工具和技巧，希望能幫助遇到了 GIF 製作問題的寫作者，簡單、快速地做出一張清晰、小巧的 GIF 動圖。
如果你不會調參數
GIF 圖片的畫質和體積受到很多因素的影響，比如幀數、色彩、每一幀圖片的尺寸等等。如果我們直接將電腦屏幕中的操作過程錄成視頻，再將視頻轉換成 GIF 圖片，往往很難控制圖片的體積：畢竟電腦屏幕的尺寸、分辨率都比較大，為了保證畫面的流程度，直接轉換視頻得到的 GIF 文件幀數也不會低。
如果想在保持 GIF 畫面清晰的同時儘可能地降低文件的體積，最好的方法還是學會 GIF 文件中這些參數的意義和作用，才能在想要讓 GIF 圖像更清晰或者體積更小的時候，知道應該調整哪些參數。
不過，也有不少人覺得只是偶爾做張 GIF 圖，每次都要調整那麼多參數，學習工具也要耗費不少時間，不僅麻煩成本也高。如果你剛好有同樣的想法，可以試試下面幾款工具。
直接錄一張小體積 GIF
很多人做 GIF 是為了向他人演示 App 的功能和使用方法，步驟往往是「錄屏 - 將視頻文件轉為 GIF 圖」，轉換過程不僅耗時，也很難轉換一次就得到一張畫質和體積都能滿足我們需求的動圖。這時候，如果有工具能在錄屏之後，不調參數直接幫我們導出一張畫面清晰、體積小的動圖，會顯得非常實用。
接下來就介紹幾款能夠讓你不調參數、直接錄屏，就能得到一張滿足你需求的 GIF 動圖的工具。
KAP：免費、功能全的 macOS 錄屏工具
Kap 是 macOS 平臺上一款開源的錄屏工具，使用也比較簡單：通過菜單欄中的 Kap 或者快捷鍵打開軟件的錄製工具欄，選好錄製模式後點擊中間的開始按鈕就可以開始錄屏。
Kap 支持三種錄製模式：
- 自定義錄製區域
- 錄製指定的應用程序窗口
- 錄製屏幕
使用 Kap 錄製的視頻文件默認幀率為 30 幀，提供了 60 幀的設置選項。軟件提供了顯示鼠標指針、顯示鼠標動作、錄製過程隱藏桌面圖標和開啟勿擾模式、更改錄製文件存儲位置等設置選項，幾乎涵蓋了錄屏必需的基礎功能。
錄屏後，Kap 支持進行一些簡單的調整，比如更改尺寸、幀率和存儲位置，導出格式支持 GIF、MP4、WebM、APNG 四種格式。
除了基礎功能，Kap 也有亮點。軟件內置了一套插件系統，提供瞭如複製 GIF 圖像到剪貼板、分享 GIF 文件到 Dropbox 等實用插件。不過，Kap 的插件多數與分享功能相關，支持的都是國外服務，對於國內用戶的實用性比較弱。Kap 的插件數量目前也比較少，還不能自定義，只能等開發者繼續完善插件功能了。
你可以在 Kap 官網 下載 Kap 的正式版本，也可以在 軟件的 GitHub 頁面 下載最新的 3.0 測試版本，軟件完全免費，僅支持 macOS 系統。
LICEcap：免費、支持雙平臺，文件體積控制優秀
比起 Kap 超過 100 MB 的軟件體積，LICEcap 的大小雖然只有 2 MB，像調幀率、顯示鼠標動作、設置 GIF 循環方式等基礎功能一個都不少。另外，LICEcap 還支持在錄製過程中直接移動軟件窗口，改變錄製區域；如果演示區域的範圍變化比較大，LICEcap 能夠讓你在限制錄屏窗口尺寸的同時，保證演示內容的完整和直觀。
LICEcap 支持在錄屏時改變錄屏區域
LICEcap 是我用過的 GIF 工具裡，在不調參數的前提下，對於錄製文件體積控制的最好的應用，只是寫文章介紹軟件功能時錄張動圖，LICEcap 錄製出來的文件體積基本保持在幾百 KB 到 2 MB 不等，畫質方面也少有色彩失真嚴重、畫面模糊的情況。
LICEcap 是一款免費的開源軟件，支持 macOS 和 Windows 平臺，你可以在 官網 下載 LICEcap。
試試這幾款能壓 GIF 的壓圖工具
如果你做出來的 GIF 圖不能滿足你的需求，你還可以用支持壓縮 GIF 的壓圖工具，進一步壓縮 GIF 文件的體積。
ezGIF：免費的在線壓縮工具
ezGIF 是我經常用的 GIF 壓縮工具，使用方法很簡單：在「GIF Optimizer」界面上傳 GIF 文件，拖動調整壓縮率的進度條，越往右壓縮率越高，調好壓縮率之後就可以壓圖了。
用 ezGIF 壓圖後，你可以直接預覽壓縮後 GIF 的畫面和體積，如果你不滿意，可以選擇調整壓縮率重新壓圖。除了重新調整壓縮率，你也可以選擇在壓圖之前或之後進行像裁剪、調整尺寸、調整 GIF 播放速度等一些基礎操作，來嘗試進一步降低 GIF 的體積。
雖然是一款在線工具，ezGIF 的處理速度還算不錯，只調整壓縮率的情況下，得到的 GIF 圖也基本上夠用了。
Optimage：支持 GIF 壓縮，免費版就夠用
macOS 上的圖片壓縮工具不少，有免費開源的 TinyPNG，也有以設計見長的 Squash。不過，它們的缺點也很明顯：不能壓 GIF。
Optimage 是一款還算老牌的圖片壓縮工具，上個月發佈了 3.0 版本。除了基本的 PNG、JPEG 等格式的圖片壓縮功能，Optimage 還能壓縮 MP4、HEIC、WebP 等格式的文件，可謂相當全面。
在壓圖效果方面，我在不改變軟件默認參數的情況下進行了多張圖片的壓縮測試，Optimage 對於 PNG、JPEG 等常見圖片格式文件的壓縮率平均能達到 70% 以上，對於 GIF 的壓縮效果則相對差一些，還是能應付一些小尺寸 GIF 文件的壓縮場景。
Optimage 的免費版本每天能壓 24 張圖，足夠應付大部分日常的寫作場景了。關於壓縮率數據，你可以在 官網 找到更多開發團隊對於同類軟件的對比數據表格。
PP 鴨：雙平臺、老牌國產壓圖工具
PP 鴨是一款老牌的國產壓圖工具，主打智能壓縮算法的功能。據開發團隊稱，PP 鴨整合了多種優秀的開源圖片壓縮算法，軟件能夠自動根據圖像特徵自動選擇合適的壓縮參數，還支持批量壓圖。
PP 鴨在官網給出的 GIF 壓縮測試案例顯示，GIF 文件的壓縮率超過了 30%。我在實際測試之後得到的結果雖然略低於官網給出的數據，也還算不錯，考慮到 PP 鴨除了 GIF 還支持大多數常見格式的圖片壓縮，
PP 鴨支持 macOS 和 Windows 平臺，你可以在 官網 下載軟件，免費版本每天的壓圖數量限制為 10 張，付費版本售價 ¥69.9，沒有壓圖數量的限制。
參數怎麼調？
如果你經常在網上寫文章、寫博客，經常和 GIF 打交道，可能因為寫作平臺的限制、或者出於節省博客服務器流量的考慮，你可能對 GIF 文件的畫質和體積有更多和更高的要求。這時候，你就要了解 GIF 圖像裡不同參數的意義和作用，學會如何在 GIF 圖像的畫質、體積和流暢度之間保持比較好的平衡了。
由於 GIF 圖像可以調的參數很多，寫這篇文章的目的也不是為了向你科普 GIF 的背景、技術和原理，所以我不會對 GIF 中的每項參數進行詳細的介紹，而是將 GIF 圖像中最容易理解、也最好掌握的幾項參數介紹給你，希望能幫你簡單做出一張符合自己需求的 GIF 圖片。
一般來說，功能全面的 GIF 製作工具能夠調節的 GIF 參數也都基本一致，接下來我會以我在用的 GIF Brewery 為例，介紹我認為需要關注的參數和調節的方法。
如果你想了解更多關於 GIF 的知識、技巧和 App，可以閱讀「GIF 還能這麼玩」專題。
調整起點和終點
我們在錄視頻時，為了保證演示內容的完整性，往往會在開始錄屏之後停頓幾秒，再進行操作演示。錄製完成後，因為要手動結束錄製過程，也會有幾秒中的無用畫面出現在視頻裡。
調整 GIF 的開始和結束位置
不要忽視了這短短几秒，把開頭和結尾的無用畫面裁掉不僅能讓最後做出來的 GIF 圖更「完美」，也能在一定程度上縮小 GIF 文件的體積。
調整圖像尺寸
這個方法比較好理解，比如 iPhone XS Max 的錄屏尺寸為 888x1920，如果以原比例轉為 GIF 圖片放在網頁中展示，不僅排版樣式不好看，文件體積也會很大。很多網站為了提升網頁的訪問速度，也為了節省服務器流量，還會限制上傳圖片的體積，體積太大的話圖都傳不上去，比如少數派對於 GIF 的體積限制為 2.5 MB。
合理地調整圖片寬度不僅能讓排版樣式更好看，也能顯示更多內容
為了測試這個方法在降低 GIF 文件體積時的效果，我在 iPhone 上錄製了一個時長為 11 秒的視頻，用 GIF Brewery 直接轉換成 GIF 之後的文件體積為 2.4 MB。接下來，我將同一份視頻文件的尺寸改為 350x756，將它轉換成 GIF 後的文件體積為 428KB，效果非常明顯。
為了保證圖片內容的顯示效果，只需要更改寬度參數，再選擇保持寬高比的選項
裁剪畫面
我們在文章裡放 GIF，很多情況是為了展示 App 的交互和具體的操作，只需要錄下某個區域的操作過程就行了。不過，我不建議你在錄屏前就準確地選好要錄製操作步驟的屏幕區域，如果你對錄製出來的圖像效果不滿意，只能重新錄一遍。
更好的做法是先多錄製一部分區域，比如整個屏幕或者整個應用窗口，之後再裁剪不要的畫面，如果裁剪後的圖像效果不好，你只需要撤銷裁剪操作，重新選擇裁剪區域就行。
裁剪畫面
調整色彩數量
GIF 能夠顯示色彩的數量為 8 位，也就是說 GIF 能夠顯示的色彩數量只有 2^8 = 256 種。不過，由於 GIF 由多幀靜態圖像組成，只要不同幀之間畫面的像素有變化，GIF 都會記錄下這些變化，也就是說，GIF 圖像的色彩變化越多，文件的體積就會越大。
因為 GIF 的作用經常是為了展示 App 的動效或操作步驟，只要讓讀者看懂就行，所以我們可以適當地降低 GIF 文件的色彩數量以減小 GIF 文件的體積，即使這樣做在一定程度上會降低 GIF 圖像的清晰度。
調整 GIF 的色彩數量時，我們可以按照色彩的位數作為參考數值進行調整，比如 4 位代表 16 種色彩、5 位代表 32 種色彩、6 位代表 64 種色彩，等等。我們可以從高位色彩數量開始逐級降低 GIF 的色彩數量，直到 GIF 文件的畫質和體積達到了讓你滿意的程度。
調整「幀數」和「幀延遲」
先解釋一下「幀數」和「幀延遲」的概念：
- 幀數 (Frame Count)：GIF 由多張靜態圖片組成，幀數代表了一張 GIF 圖包含了多少張靜態圖片，幀數越多，GIF 體積就越大。
- 幀延遲1 (Frame Delay)：GIF 中每一幀圖像的播放時間，也就是播放一幀畫面需要多少毫秒。幀延遲數值越高，GIF 的播放速度越慢，反過來，GIF 的播放速度越快。
在我用的 GIF Brewery 中，「幀延遲」的單位是毫秒，1000 毫秒 = 1 秒。我們可以先將「幀延遲」的數值換算成秒，在用幀數去計算 GIF 的幀率，計算公式為：幀率 (幀 / 秒) = 1000 / 幀延遲
很明顯，在不改變「幀延遲」的前提下，幀數越低，GIF 的播放速度就越快。因此，我們雖然可以通過降低幀數的方法減小 GIF 圖的體積，但是同時也要考慮 GIF 的播放速度，讓讀者可以看清 GIF 圖的演示過程。
雖然「幀延遲」的數值大小直接決定了幀率高低，但是「幀延遲」也不是越低越好。像我在前文所述，做 GIF 的圖是為了讓讀者更直觀地理解 App 的交互和操作方法，所以 GIF 圖不是越流暢越好，只要讀者能看懂就行，GIF 圖播放太快反而會讓讀者看不清圖裡的內容。因此，我們可以適當地調高「幀延遲」的數值，通過犧牲一定流暢度的方法減小 GIF 圖的體積。
如果你和我一樣用的是 GIF Brewery，要注意的是 GIF Brewery 的默認將幀數和幀率設為了 20 幀和 100 毫秒，換算成幀率為 10 幀/ 秒。由於幀數只有 20 幀，導致了我們每次用它做出來的 GIF 播放速度都非常快。為了不用每次做 GIF 都要手動調一遍幀數和幀延遲的參數，我們可以在 GIF Brewery 的設置選項裡直接更改這兩個參數的默認數值。
調整 GIF Brewery 的默認幀數和幀率
總結
以上是我在寫文章、做 GIF 圖的過程中總結出來的一些經驗，主要目的是希望能幫你在做 GIF 圖的時候，簡單、快速地得到一張畫質好、體積小的 GIF 動圖。
除了我介紹的幾種方法和工具，你也可以用 Photoshop 或者直接刪除幀的方法等減小 GIF 圖的體積。不過，由於這些工具和方法需要對 GIF 和工具本身有更深入的瞭解，因此不在本文的討論範圍之內。
如果你有製作 GIF 的技巧或 App 想分享，可以在評論區留言和我們討論。
閱讀更多 少數派 的文章
