白鷺時代動畫設計工具DragonBones
自我(wo)介紹一下，劉(liu)晨光，多年伴隨設(she)(she)計師(shi)(shi)的(de)程(cheng)序(xu)開發者，白鷺時代(dai) DragonBones的(de)負(fu)責人。很多人對我(wo)的(de)自我(wo)描述感覺很奇怪。實(shi)際上(shang)由于產品的(de)緣故，我(wo)接觸(chu)的(de)更多的(de)是設(she)(she)計師(shi)(shi)而(er)非開發者，故常自嘲為(wei)“多年伴隨設(she)(she)計師(shi)(shi)的(de)程(cheng)序(xu)開發者”。
1 近(jin)年底，我們也在(zai)總結一年以來(lai)DragonBones的一些經驗和未來(lai)的發展(zhan)方(fang)向(xiang)。這次我想從四個方(fang)面(mian)想跟大家說(shuo)(shuo)一說(shuo)(shuo)DragonBones。
2一、產品定位，不忘初心
動畫從來都是游戲中最能體現效果的重要組成部分，但往往動畫制作也是游戲開發中較為頭疼的一個環節。多年的重慶影視公司從(cong)業經驗(yan)告訴我，對于游戲中的動畫而(er)言，主要(yao)存(cun)在(zai)一下(xia)幾個(ge)問題。
1、設計師很容易被游(you)戲的技術選型所束縛，難以發(fa)揮(hui)在動畫效果上做最(zui)大化的發(fa)揮(hui)。
2、骨骼動(dong)畫(hua)對于可以讓游戲畫(hua)面素材(cai)提及(ji)減小，但(dan)是(shi)做(zuo)起來麻煩，效率(lv)低。
3、沒(mei)有專門為移動游戲所服務器的(de)動畫制作工(gong)具(ju)，大部(bu)分還是沿用以前頁游和端由的(de)工(gong)具(ju)。
4、設(she)計(ji)師與動畫設(she)計(ji)師之間的(de)協同不(bu)(bu)理想，各種PSD文件導(dao)來導(dao)去，不(bu)(bu)勝其煩(fan)。
5、骨骼動畫與傳統幀動畫不能(neng)有效整合，放到一起使用，總有不能(neng)和諧處(chu)理(li)的地方。
在DragonBones開發過程中，我們希望(wang)能(neng)夠從根本上(shang)(shang)解決游戲開發過程中動畫部分(fen)的瓶頸。對于上(shang)(shang)面(mian)的五(wu)個(ge)問題，我們通過不同的方法進行逐一攻(gong)克(ke)。
1、統一的(de)動(dong)畫(hua)數據(ju)格(ge)式：DragonBones定(ding)義了一套(tao)完整(zheng)的(de)動(dong)畫(hua)數據(ju)格(ge)式，這樣便(bian)可(ke)以適用于任何工具，以及任何引擎(qing)。在工具方面，我們支持DragonBones Pro(獨(du)立動(dong)畫(hua)編輯(ji)器)和DragonBones DesignPanel(基(ji)于FlashPro的(de)骨骼(ge)動(dong)畫(hua)制作插(cha)件)。而程序(xu)(xu)方面，我們擁有(you)多語言版本的(de)動(dong)畫(hua)程序(xu)(xu)庫(DragonBones Library)。這樣，動(dong)畫(hua)設計師可(ke)將(jiang)精力放置與DragonBones中，而無需關(guan)心程序(xu)(xu)是(shi)否能夠完整(zheng)還原所設計的(de)動(dong)畫(hua)。
3
2、DragonBones Pro：這(zhe)是一(yi)個完(wan)整的獨立動畫(hua)編(bian)輯器，專門為(wei)動畫(hua)編(bian)輯所準備，更加適合游(you)戲中動畫(hua)制作(zuo)。
3、專門為移(yi)(yi)動游(you)戲(xi)優(you)化(hua)(hua)：DragonBones無論在功能(neng)的設計(ji)上，還是程序庫(ku)的優(you)化(hua)(hua)上，都針對(dui)移(yi)(yi)動設備(bei)做了大量優(you)化(hua)(hua)，保(bao)證在不同手機中維持(chi)一個理想的性能(neng)狀(zhuang)態。
4、插(cha)件(jian)系統：我們所提供的(de)(de)(de)插(cha)件(jian)可(ke)(ke)以將PhotoShop中設計好的(de)(de)(de)圖片直接(jie)導出為DragonBones Pro項(xiang)目文(wen)件(jian)，然后直接(jie)編輯。我們的(de)(de)(de)一些插(cha)件(jian)可(ke)(ke)提供對Spine、Cocos等(deng)格(ge)式的(de)(de)(de)支持(chi)，可(ke)(ke)以方便(bian)做工具遷(qian)移。
5、普通動(dong)(dong)(dong)畫支持(chi)：DragonBones Pro不(bu)僅僅可(ke)(ke)以(yi)(yi)制(zhi)作骨骼動(dong)(dong)(dong)畫，亦可(ke)(ke)以(yi)(yi)制(zhi)作逐幀動(dong)(dong)(dong)畫。與此同時，在動(dong)(dong)(dong)畫程(cheng)序(xu)庫(ku)中，兩種(zhong)不(bu)同的動(dong)(dong)(dong)畫形式(shi)可(ke)(ke)以(yi)(yi)進行嵌套操作，這極大的增強了兩種(zhong)形式(shi)的動(dong)(dong)(dong)畫相互融合。
說(shuo)了這(zhe)么多，從動(dong)畫(hua)原(yuan)型設(she)計，到素材設(she)計，再到動(dong)畫(hua)制(zhi)作(zuo)(zuo)，最終由程序在游戲中(zhong)實現，我們能夠(gou)做到一(yi)個“跨引擎”的(de)動(dong)畫(hua)制(zhi)作(zuo)(zuo)流(liu)程，我們將這(zhe)個流(liu)程總結為一(yi)句話便是，DragonBones是為移動(dong)開發者服(fu)務動(dong)畫(hua)制(zhi)作(zuo)(zuo)完整工作(zuo)(zuo)流(liu)產品(pin)。
二、時刻不忘取悅用戶
很多人對這句話的理解都是用戶想要什么我們就給什么，大而全則好。我則不這么認為。需求永遠都不可能存在盡頭，重慶動畫制作而將(jiang)這些(xie)(xie)全部變為(wei)實(shi)實(shi)在在的(de)(de)(de)(de)功能(neng)，則是拖累用戶，讓產(chan)品變得愈加臃腫(zhong)。DragonBones則一直秉承為(wei)快(kuai)不破(po)，動畫(hua)制作應該再簡單一些(xie)(xie)，再方便一些(xie)(xie)，考慮的(de)(de)(de)(de)再少一些(xie)(xie)，而不是一味的(de)(de)(de)(de)堆(dui)砌(qi)功能(neng)。這部分我想將(jiang)幾個產(chan)品中的(de)(de)(de)(de)功能(neng)詳細(xi)說說。
1、時(shi)間(jian)(jian)軸：經過多(duo)年的(de)洗禮，我相信絕大部分動畫視(shi)頻制作類(lei)軟(ruan)件(jian)都由時(shi)間(jian)(jian)軸的(de)概念。Adobe的(de)部分產品則更(geng)是(shi)將時(shi)間(jian)(jian)軸發揚(yang)光大。但DragonBones則對時(shi)間(jian)(jian)軸功能一剪(jian)再(zai)剪(jian)，其目是(shi)讓用戶所(suo)看所(suo)用到的(de)東(dong)西(xi)(xi)是(shi)正(zheng)確(que)的(de)東(dong)西(xi)(xi)。以Flash為參考，Flash是(shi)模擬翻頁動畫，幀(zhen)與幀(zhen)之間(jian)(jian)沒有時(shi)間(jian)(jian)，這是(shi)正(zheng)確(que)的(de)思路(lu)。但目前動畫制作的(de)主流(liu)需求應該是(shi)點(dian)(dian)(dian)與點(dian)(dian)(dian)，譬如循環動畫第二(er)次循環要去掉開始的(de)重復幀(zhen)，如此才擁有更(geng)完美(mei)的(de)動畫表現，DragonBones的(de)時(shi)間(jian)(jian)軸是(shi)按照節(jie)奏(zou)制作和呈現的(de)，設計師所(suo)看到動畫點(dian)(dian)(dian)才是(shi)他們所(suo)關(guan)心的(de)內容。
4
2、骨骼體系：比較重要的功(gong)能就是骨架嵌(qian)(qian)套(tao)，以(yi)及支(zhi)持(chi)同骨骼的序列幀動畫(hua)。如(ru)果沒有骨架嵌(qian)(qian)套(tao)，很多動畫(hua)效(xiao)果也可實(shi)現，但是制(zhi)作(zuo)成本卻要翻倍(bei)。譬如(ru)游戲(xi)中人物與其手上的武(wu)(wu)器，傳統的是做成單個角色，這樣人物動畫(hua)中的動作(zuo)極為(wei)單一，而(er)DragonBones是將(jiang)人物與武(wu)(wu)器做成兩個角色，嵌(qian)(qian)套(tao)在一起，如(ru)此可以(yi)產(chan)生更豐(feng)富(fu)的動作(zuo)和動畫(hua)。所以(yi)骨架嵌(qian)(qian)套(tao)嵌(qian)(qian)套(tao)功(gong)能孕育而(er)生，這也是為(wei)設計師(shi)效(xiao)率所考慮(lv)。
3、反(fan)向(xiang)動力(li)學約束(shu)：所有人(ren)(ren)(ren)都(dou)(dou)不(bu)愿意(yi)看到一個(ge)游(you)戲(xi)中人(ren)(ren)(ren)物的(de)(de)動作(zuo)(zuo)如僵尸般僵硬。但大部分(fen)人(ren)(ren)(ren)應該知道，人(ren)(ren)(ren)物的(de)(de)動作(zuo)(zuo)想要(yao)(yao)鋼筋(jin)有力(li)，亦或(huo)是飄(piao)飄(piao)欲仙，都(dou)(dou)需要(yao)(yao)動畫設(she)計(ji)師不(bu)停的(de)(de)微調(diao)(diao)，反(fan)復修改每(mei)一個(ge)關節(jie)的(de)(de)運動狀態，這(zhe)是極為耗時(shi)和(he)考驗耐(nai)心的(de)(de)工(gong)作(zuo)(zuo)。而反(fan)向(xiang)動力(li)學約束(shu)可以幫助設(she)計(ji)師在(zai)(zai)動畫調(diao)(diao)整過程中幫助想關聯關鍵做出(chu)正確的(de)(de)位置移動。譬如人(ren)(ren)(ren)在(zai)(zai)站立，需要(yao)(yao)上身動腳不(bu)動，在(zai)(zai)DragonBones中將人(ren)(ren)(ren)物上下(xia)半(ban)(ban)身分(fen)割，并且(qie)在(zai)(zai)下(xia)半(ban)(ban)身嵌套入游(you)戲(xi)場景(jing)，簡單(dan)的(de)(de)操作(zuo)(zuo)即可實(shi)現。
4、蒙(meng)皮動(dong)畫(hua)：很抱(bao)歉，在本(ben)文(wen)撰寫時，你能看到的版本(ben)還(huan)不包(bao)含該功能。但(dan)我總是(shi)(shi)喜歡(huan)將(jiang)一些好的東(dong)西提前(qian)分(fen)享給(gei)大家(jia)。蒙(meng)皮動(dong)畫(hua)解決開(kai)發(fa)者(zhe)做柔體動(dong)畫(hua)的需(xu)求，無(wu)論(lun)是(shi)(shi)飄揚(yang)的紅旗還(huan)是(shi)(shi)隨(sui)風而動(dong)的戰袍，都可以通過蒙(meng)皮動(dong)畫(hua)解決。
DragonBones Pro這(zhe)個(ge)獨立骨骼(ge)動畫(hua)編(bian)輯器(qi)，實際上也即是(shi)設計師工具(ju)。它(ta)具(ju)備目前動畫(hua)師需要(yao)的幾乎所有功能，而(er)除了上述的重要(yao)功能之外，DragonBones最大的特點毫(hao)無疑問是(shi)可視(shi)化編(bian)輯，如同PS一樣，動畫(hua)師在制作動畫(hua)的過(guo)程(cheng)中能夠(gou)做到所見即所得。
到(dao)現(xian)在DragonBones不只是單(dan)純用于制作游戲動畫，也可(ke)以像Flash那(nei)樣(yang)制作廣告動畫和其(qi)它交互內容。
三、取之(zhi)于(yu)民當(dang)用之(zhi)于(yu)民
事(shi)實上DragonBones年齡要(yao)比Egret大(da)兩歲，在加入Egret之前，DragonBones第一個(ge)公開發布的(de)(de)版(ban)(ban)本(ben)(ben)(ben)是(shi)在2012年十月的(de)(de)1.4版(ban)(ban)本(ben)(ben)(ben)，它(ta)最主要(yao)的(de)(de)是(shi)打(da)通了在Flash做動(dong)畫(hua)(hua)，然后搭(da)建了從設計師(動(dong)畫(hua)(hua))到(dao)開發者(游戲(xi)(xi))的(de)(de)工作(zuo)流。接下來重要(yao)的(de)(de)是(shi)2.0版(ban)(ban)本(ben)(ben)(ben)，這個(ge)版(ban)(ban)本(ben)(ben)(ben)基(ji)于(yu)動(dong)畫(hua)(hua)功能做了大(da)量(liang)的(de)(de)升(sheng)級，譬(pi)如(ru)可(ke)以(yi)做動(dong)畫(hua)(hua)融和，動(dong)畫(hua)(hua)之間(jian)自動(dong)柔和的(de)(de)過渡。3.0版(ban)(ban)本(ben)(ben)(ben)正式(shi)加入到(dao)了Egret體(ti)系中，在推(tui)(tui)出DragonBones3.0基(ji)礎(chu)是(shi)JS版(ban)(ban)本(ben)(ben)(ben)，不過他全(quan)面(mian)支(zhi)持(chi)各類語言，譬(pi)如(ru)C++版(ban)(ban)本(ben)(ben)(ben)支(zhi)持(chi)Cocos、C#支(zhi)持(chi)Unity，而(er)它(ta)的(de)(de)核心是(shi)制作(zuo)移動(dong)游戲(xi)(xi)的(de)(de)動(dong)畫(hua)(hua)體(ti)系。今年推(tui)(tui)出的(de)(de)4.1版(ban)(ban)本(ben)(ben)(ben)推(tui)(tui)出了極速模式(shi)，其性能比同類產品提升(sheng)了30%左(zuo)右，譬(pi)如(ru)Spine，并且(qie)其包體(ti)容量(liang)在同類產品可(ke)能是(shi)最小(xiao)的(de)(de)。
到目前位置，DragonBones的(de)程序庫很多(duo)修改維護仍來源于社區貢獻，與此同時，我(wo)們也一(yi)直在(zai)(zai)與設(she)計(ji)師進行溝通反(fan)饋(kui)，時刻了(le)解設(she)計(ji)師在(zai)(zai)使用過程中的(de)需求與反(fan)饋(kui)。內部是(shi)我(wo)們最容易接觸(chu)的(de)第一(yi)手渠道，其次我(wo)們會關注(zhu)來自QQ群，論(lun)壇和開發者(zhe)沙龍上所搜集(ji)的(de)反(fan)饋(kui)，根據需求指定功能，隨后確定優先級，逐(zhu)一(yi)完(wan)善。
四、用開放的心態繼續前行
一(yi)開始(shi)已經說(shuo)過，DragonBones一(yi)直圍繞動(dong)(dong)(dong)畫(hua)(hua)服務(wu)，在(zai)(zai)未(wei)來，設(she)計師做的(de)(de)動(dong)(dong)(dong)畫(hua)(hua)，不僅(jin)僅(jin)可(ke)用(yong)于游(you)(you)戲。同時還可(ke)以(yi)應用(yong)于其他(ta)領域(yu)。譬如(ru)，可(ke)以(yi)直接打(da)包(bao)發布，增加互動(dong)(dong)(dong)類功能(neng)，可(ke)以(yi)通過DragonBones制(zhi)作動(dong)(dong)(dong)畫(hua)(hua)效果豐富(fu)的(de)(de)互動(dong)(dong)(dong)類廣(guang)告。在(zai)(zai)游(you)(you)戲動(dong)(dong)(dong)畫(hua)(hua)制(zhi)作這(zhe)個方向上，給予(yu)功能(neng)和性能(neng)上的(de)(de)全面提升，并且在(zai)(zai)性能(neng)上全面支持(chi)WebGL，提供硬件加速。
對于(yu)不同(tong)維(wei)度用(yong)戶，DragonBones會(hui)提供常用(yong)的模板，同(tong)時跟云端的服(fu)務相結(jie)(jie)合，打通白鷺商城，使得美(mei)術素材、模板無縫結(jie)(jie)合。
文章的最后，還想提及一個事情，我們非常希望動畫設計師能夠體驗使用我們的產品，給予我們更多的反饋。而近期，我們重慶多媒體制作開發者服務(wu)平(ping)(ping)臺推出了(le)(le)一項(xiang)尋找“精英(ying)動(dong)畫(hua)師，優秀動(dong)畫(hua)DEMO征集”的活動(dong)，與(yu)此同時，D5Power 、CGjoy也其平(ping)(ping)臺和論壇推出了(le)(le)基于DragonBones制作(zuo)作(zuo)品的專(zhuan)項(xiang)賽事。
歡迎動畫師們(men)使(shi)用DragonBones制作動畫，時下DragonBones正(zheng)在(zai)征集優(you)(you)秀(xiu)DEMO，希望動畫師或(huo)開(kai)(kai)發者們(men)提供優(you)(you)秀(xiu)作品。我更希望開(kai)(kai)發者與動畫師們(men)一起參與到DragonBones未來(lai)的(de)產品設(she)計中來(lai)，這也是(shi)白(bai)鷺(lu)時代一直(zhi)堅(jian)持的(de)理念。
5關于DragonBones
DragonBones最初由Adobe公司于2012年10月主導開發設計的一款專門用于游戲中骨骼動畫制作的FLASH插件。是目前公認的全球最早的骨骼動畫工作流解決方案。一經推出就受到了眾多游戲開發設計者的歡迎和追捧。而在此后，白鷺時代作為HTML5移動游戲新生代企業，接過了DragonBones維護、運營和更新迭代的任務，重慶多媒體并在(zai)2014年正式將(jiang)其(qi)納(na)入白(bai)鷺時代(dai)Egret產(chan)品(pin)序列。目(mu)前不少游戲產(chan)品(pin)的(de)動(dong)(dong)畫系統都是在(zai)基于DragonBones基礎上設計開發的(de)。風靡中國的(de)動(dong)(dong)作(zuo)卡牌手機游戲《刀(dao)塔傳奇》就是其(qi)中的(de)一員。欲知更多詳情，請登(deng)陸(lu)白(bai)鷺時代(dai)官(guan)方網站
