<table><tbody>
除了乾貨，其它什麼也沒有
職場
數據
新媒體
設計
極客
企業新媒體服務/培訓/開發：021 37218818
在第一彈教程《教程！2.5D二維碼設計！！讓品牌起飛！！！》的基礎上，今天我將傳授 Animation 製作的方法。
藝術二維碼轉化率是普通二維碼的約 5.5 倍。但動態二維碼牽涉多種硬核設計技巧，而很多培訓機構學費高昂，又極少發佈免費教程。如需定製，一般根據設計強度和畫幅大小，其價格在 6K-25K 不等。實際上，只要遵循二維碼的識別原則，再配合一定的動畫基本功，你也可以緊跟我們的教程，為自己的品牌打造一款動態二維碼。
二維碼動畫設計不宜繁複：
動畫過量會導致 GIF 體積暴增。不僅加載緩慢，在圖文對 GIF 體積有限制的情況下，往往要犧牲畫質做壓縮。（雖然你可以點擊閱讀《教程｜突破2M，公眾號上傳超大GIF！》上傳大型 GIF，但這對加載沒有任何好處）
根據二維碼的截屏識別的邊緣計算規則，長按 GIF 二維碼會截取其某個瞬間進行識別。所以對二維碼內部而言，必須確保每一刻其動畫區域的灰度差是具有顯著性的，所以它並不支持過多動畫行為。
基於上述兩點，二維碼動畫的類型主要集中在 ±30° 平移動畫、偏移量動畫、呼吸動畫、軌道動畫、文字特效等（點擊《這73個詞，只有專業新媒體人才懂。》理解這些詞彙）
打開 Adobe After Effect，計老師準備通過上期成品示範二維碼外部的動畫設計。先新建一個 5 秒的合成，將二維碼拖拽進來▼
將雲朵在 AI 工程中分離出來單獨保存，拖入工程內擺放在合適的初始位置。隨後展開雲朵圖層，對「位置」打下關鍵幀▼
因為動態二維碼是循環動畫，所以將這個關鍵幀也複製到工程的最後一幀，確保動畫首尾相接。隨後在 2.5 秒位置設置它關鍵幀位置，由此形成動畫▼
由於這個二維碼要反映出 JZ 的品牌特性，所以我們增加一些註釋，說明品牌的服務範圍。所以我們把二維碼的佔比降低留出註釋空間，先通過鋼筆工具繪製線條，然後選中圖層，單擊添加後邊的小三角按鈕，選擇「修剪路徑」▼
移動到第一幀，將「修剪路徑」的結束值調整到 0，確保 GIF 開始時註釋線不可見▼
在最後一幀打下關鍵幀，將結束值調整到 100% 即可。接下來計老師在更多註釋線上標記“數據可視化”、“黑科技排版”等，並添加「打字機」動畫▼
現在假設我們已經完成了外部的動畫設計，接下來要把這個動畫工程轉化為 GIF，這是動態二維碼設計中極其重要的一環。點擊「合成」-「添加到渲染隊列」，並調整「渲染設置」，建議圖像分辨率取「二分之一」▼
輸出模塊設置中，對「格式選項」進行調整，視頻編碼採用 H.264；80% 品質足矣▼
導出視頻，你會得到一個 MOV 格式的動態二維碼。那現在怎麼將其轉化為 GIF 呢？很多新人會卡在這一關，並且往往去選擇一些第三方視頻轉 GIF 工具，結果轉換出的尺寸、體積、畫質令你苦不堪言。
其實，此刻最合理的選擇是將 MOV 視頻拖入 PS 中，並將 PS 切換到“動感模式”▼
點擊「文件」-「導出」-「存儲為 Web 所用格式」導出，通過尺寸調整和品質調整，讓其小於 2M 體積▼
我們來看一看放在圖文裡的效果，畫質良好，且可以被長按識別（計老師使用 iPhoneX 調試）▼
而二維碼內部的動畫設計是相對有限的，而且為了確保灰度差沒有明顯變化，最常見的策略是使用「修剪路徑」形成描摹的效果。但是動畫的侷限不代表視覺效果的侷限，比如 JZ 也發佈過這款極客範兒二維碼▼
這個平面二維碼使用了大量描摹效果，製造出了一種電路板的形態。值得一提的是，它的動效並非通過 AE 製作，而是利用 H5 的 SVG 動畫特性先完成開發，之後採用錄屏的策略得到了視頻，再轉製為 GIF。
所以動態二維碼設計的軟件和方法並不具有唯一性，只要你能通過合適的技術實現 Animation，並獲得其對應的視頻進行轉換，理論上就都可以完成創作。
希望進一步深入學習，獲得 JZ 的免費輔導，並與更多設計師一起探討？現在給你不容錯過的機會！請查看二維碼的靜態原圖，列舉出全部畫面中的物件，並在本文下方留言區作答。
回答正確的同學即可接受培訓！計老師將側重二維碼優化層面教學，荒村老師作為立體插畫師則會就素材設計層面提供輔導。
如需定製，一般根據設計強度和畫幅大小，其價格在 6K-25K 不等。(021 37218818)
又或者你確實無力進入該領域學習，不妨看看這個案例▼
這個二維碼為什麼可以識別？
-END-
另外關於二維碼的地推和其他創意設計，推薦你閱讀《這些腦洞超大的二維碼設計，讓路人爭相掃描！》、《酷炫！手繪二維碼！！亮瞎！！！》。更多二維碼設計專業內容，請移步新書《硬核運營》（68-79頁）閱讀學習▼
本文作者
計育韜
微信官方 SVG AttributeName 開發者
著有《Prezi 完全解讀：從入門到精通》
《硬核運營：新媒體技術流養成》
上海市信息化青年人才協會會員
復旦大學青年智庫講師
浙江傳媒學院客座導師
上海團市委新媒體顧問
上海市金山區青聯副主席
上海市新的社會階層人士聯誼會會員
新榜 500 強運營人
閱讀更多 JZ多媒體解決方案 的文章
