本文來自網易雲社群，轉載務必請注明出處。
1. 概述
live2d是由日本Cybernoids公司開發，通過扭曲像素位置營造僞3d空間感的二維動畫軟體。官網下載下傳安裝包直接安裝可以得到兩種軟體，分别是Cubism Modeler和Cubism Animator，最後我們還需要安裝第三個軟體Viewer用作預覽調戲等。
由于還是由2d圖形制作，是以對動畫師要求比較高，除去原畫繪制能力，動畫師還需要具有一定三維空間感，以及複雜邏輯能力（問什麼要有邏輯能力，請看完= =）。
先簡單說一下制作流程：
- psd原畫切圖
- 導入Cubism Modeler裡蒙皮
- 設定蒙皮
- 導出到Cubism Animator裡面制作動畫
- 導出
搞定，這樣就能得到一個活蹦亂跳的二次元小哥哥了。看起來十分簡單，然而... ...
期間踩過的坑，可能比吃過的飯都多...
2.執行個體解析：
- psd原畫切圖
為什麼我每個圖層後面都标注了序号，因為免費版對圖層數量有要求，不能超過30個，是以在切圖的時候，請務必精打細算，重點擺在那裡，是表情動畫還是四肢動畫，哪裡需要細緻一些，哪裡可以合在一起，算準了之後，在多數幾遍，確定圖層數目≤30就ok。
在live2d裡貼圖自動排列成這樣。
切圖沒神馬難點，下一步蒙皮其實也簡單。
- 蒙皮
導入psd之後，會直接跳出蒙皮界面，左側的數值可以自己調整，建議邊界不要太大，但也不能太小，太小會切割原畫，基本上不用手動設定，眉毛和嘴巴這種細長的部件可以手動多加幾個點，也可以在後期制作的時候補上。
另外，如果不是太奇葩的原畫，live2d内置了一些模闆可以直接套用。
左邊是萬惡的蒙皮設定，就是前面說到需要較強邏輯的地方。
- 蒙皮設定
先了解一下幾個簡單工具。
1選擇蒙皮點的工具，
2點選網格工具，
3.曲線蒙皮工具，多數用在頭發，眉毛這樣的細長部件上，适合制作飄動的物體使用。
4點開後可以建立旋轉和網格的蒙皮，
差別是：
網格将部件按照格子的每個點做綁定，網格的縱列數目可以自己調整。
旋轉可以控制物體按照圓點進行整體位移或者旋轉。
5.自由選擇和柔選工具，柔選比較常用。
了解了工具之後，然後開始講這個我十分不想講的東西：
看下圖四個闆塊
1是綁定樹，可以直覺檢視部件與部件之間父級關系
2是部件+蒙皮圖層關系，關聯3
3可以設定部件或者蒙皮的ID（技術讀取的關鍵），部位，透明度，圖層等等
4考驗動畫師三維空間和邏輯關系的操控台（可以簡單了解為設定部件位移範圍的操作台）
psd檔案在蒙皮關系全部整理完之後，大把的時間都花在第四個闆塊上，舉一個“臉”講一下：
裡面有兩個控制器（變形工具），以及自身蒙皮。
一個部件蒙皮後可以由多個控制器控制運動範圍以及運動方式，如上圖1，曲面主要控制3d空間的轉面，回轉控制繞圓心點的整個位移和左右軸旋轉，而部件自身蒙皮的點可以單獨操控精修彌補。
首先可以思考一下，臉的動畫拆出來大概有點頭擡頭低頭，向左看向右看，以及左右歪腦袋，轉換到3d視角就是球體以自身為軸點的上下左右旋轉，以及世界軸的X軸旋轉位移（脖子是中心）。
注意一下，由于live2d實際上還是個2d工具，是以3d裡面的沿着世界軸X軸的旋轉動畫在live2d裡面是Z軸動畫。
我們将原畫角度設定為0點動畫，選擇第四闆塊中的角度X，點選後選擇插入3點，其中，0點是原畫角度，将綠色小點依次拖到最左邊以及最右邊後挪動控制器，（軟體将自動記錄挪動後的結果作為關鍵pose）然後将角度Y,角度Z也設定完，就可以調戲控制點玩（檢查）了。
是不是看起來很簡單，然後可以點開
參數左邊的空格，可以愉快的多元度的繼續玩（檢查）了。
蒙皮的控制器們的父子關系是：旋轉＞曲面＞曲線＞點
每一個部件設定好之後都要記得檢查，并檢查他的上下級關系，如果下級部件沒有被上級動畫帶動起來，那就一定是哪裡出了問題。具體大家可以自己試着做一個完整的小動畫嘗試下，畢竟，隻是一個臉還是很簡單的，不然你看下圖：
還有下圖：
是不是瞬間很迷... ...總之，蒙皮設定就到此為止，我們接着下一步。
- 動畫制作
打開Cubism Animator，将蒙皮檔案直接丢進去，然後得到界面
1舞台
2動作檔案夾
3時間軸
4控制器
首先在2裡面建立一個動作檔案，設定好檔案名如：idle，在3裡打開live2d參數，點選4裡的操控器擺好第一幀pose，建議将所有部件都K上動作，然後複制這個初始動作檔案繼續可以繼續制作下一個動作。
最後導出。對沒錯，動畫制作就這麼簡單，并沒有什麼難點，除了快捷鍵讓人蛋疼之外...
常用快捷鍵：A回到第一幀，S前一幀，D後一幀，F播放，再按一次暫停，Z前一關鍵幀，X後一關鍵幀，C曲線。
- 導出
一個完整的文檔應當包含以下内容:
其中幾個比較重要的檔案：
1.蒙皮等參數資訊moc檔案導出
Live2D Cubism Moc(*.moc)檔案是用于為CubismSDK提供繪制資料的檔案格式。這個檔案包含了圖層、參數、坐标系群組件，這四部分資訊。一個Moc檔案和一個圖像檔案（用于存儲紋理），在理論上就能夠提供重制角色所需的全部資訊（這裡不包括動作動畫）。
2動畫導出gif/序列幀
3動畫導出技術可以使用的js檔案
注意下截圖是兩個軟體。
踩過的坑和心得
- psd原稿過大記得先轉化為智能對象再縮放。
- 不要再live2d裡面修改尺寸，會很蛋疼，可以保留原來的檔案，去psd裡重新縮放拆好後，啟用舊檔案當做模闆，可以減少返工時間。
- 記得檢查控制器下部件動作的父子關系！！！！！
- 蒙皮時記得更改部件ID資訊，友善技術讀取。
- 蒙皮控制器兩邊的pose不滿意可以右鍵整個删除回複初始pose重新制作（前提是已經保留了0點pose）
- 動畫時間軸不要有空幀，工作區間一定要設定好，如下圖是錯誤示範：
-
純幹貨！live2d動畫制作簡述以及踩坑
- live2d兩個軟體可以無縫銜接，psd不行。但是如果moc重新修改了建議動畫檔案關閉後再打開，可以自動更新最新蒙皮資訊。
最後介紹一下Viewer軟體的使用：
紅框内把√取消可以去掉邊框和背景
勾上紅框可以讓小哥哥自己動
點選左上角的project→sample可以設定實體運算，讓頭發飄動更加自然，還有自帶的微笑眨眼等等~~~
如上這樣就可以得到一個自己心儀的小哥（姐）哥（姐）了~可以自己擺在PC/手機桌面玩耍，或者根據項目需求交給技術大佬可以實作在WEB端or遊戲中使用。
本文來自網易雲社群 ，經作者（網易雷火夏琰）授權釋出。
網易雲免費體驗館，0成本體驗20+款雲産品！
更多網易研發、産品、營運經驗分享請通路網易雲社群。
相關文章：
【推薦】 網易猛犸：資料品質漫談
【推薦】 BRVAH（讓RecyclerView變得更高效） （2）