AC2016大會講師專訪——極品網紅工程師張磊 dnt

原文連接

官方網站

張磊 dnt 網名當耐特

騰訊AlloyTeam高級工程師

github: github.com/kmdjs

在騰訊公司主要負責和參與日跡、興趣部落等項目，專一開源，樂於分享，主導衆多AlloyTeam開源項目，AlloyFinger、AlloyPaper、AlloyTouch做者。

你的開源做品不少，平時是怎麼平衡工做和開源項目的呢？

個人生活能夠拆成上班+下班。
上班能夠拆成業務忙的時間+業務不忙的時間，下班能夠拆成陪家人時間+獨自思考時間。開源項目和平時的積累源自於：上班業務不忙的時間+下班獨自思考時間。
那麼問題來了，上班的時間是固定的，怎麼擴大上班業務不忙的時間。答案就是高效地完成公司的業務。怎麼高效地完成公司的業務取決於業務以外的時間的積累。這就產生了一個良性循環。業務不忙的時候，積累地越多，業務忙的時候就越高效，越高效，業務不忙的時間就越多，積累就越多，小流成江海，硅步至千里。好比公司須要作個小遊戲AlloyPaper信手拈來，web應用須要手勢支持AlloyFinger拿來就用。須要加速到減速運動還能帶回彈摩擦力AlloyTouch恰好知足。須要作活動推廣頁須要許多轉場動畫transformjs再合適不過。諸如此類，許多需求場景都有着最合適的解決方案在手中，高效工做，良性循環，方可厚積薄發，事半功倍。

(dnt的開源項目)

你有不少圖像處理相關的開源項目，能談談爲何對圖像方向這麼感興趣嗎？

隨着流量廉價，網絡全方位覆蓋，也會愈來愈多地承載一些複雜交互的富媒體內容，這都離不開圖像工程師，以爲朝着這個方向發展仍是蠻有前景。來騰訊以前在北京作了兩年遊戲開發，本身也是資深遊戲玩家（王者榮耀、全民槍王、皇室戰爭的遊戲玩家），如今也常常玩遊戲，遊戲離不開圖像。常常會被遊戲裏、電影的特效衝擊到，都會很慣性地去想怎麼實現，能不能更炫酷什麼的。來騰訊以後，業餘時間也和小夥伴們一塊兒作了一款《坦克爭霸》的實時對戰遊戲。本身要積累了一些圖形庫如CSS3的transformjs，SVG的Sword，Canvas和WebGL的AlloyPaper和AlloyPixel等。學習圖像技術還有一好處，就是--利用本身的聰明才智（心形曲線什麼的），把姑娘追到手。

本次AC大會你將分享WebGL相關的內容，有什麼WebGL入門的建議嗎？

首先要聲明學習WebGL不等於學習Three.js。Thress.js已經徹底面向對象編程了，封裝了不少圖形處理渲染的細節。

學習WebGL和學OpenGL、D3D同樣，高數、線性代數和解析幾何是基礎。有了這些基礎，再看API類、應用類的書籍《xxx從入門到精通》、《xxx高級編程》、《xxx高級程序設計》、《從零開始學xxx》什麼的，這些書裏面也會有部分章節出點一點那些基礎數學知識。邊看書的同時，從例子下手，好比從學習繪製三角形開始吧。之前微軟IE Test Driver上的image wrap的例子也很適合入門（圖片切成N多個三角形，能夠拖拽頂點），我也寫了一個image wrap的例子很適合入門。

再繼續：

1. 畫個立方體，指定頂點順序，瞭解頂點順序的做用和意義；
2. 貼個紋理，瞭解頂點和紋理映射關係；
3. 對紋理進行處理，如模糊、震盪、馬賽克等特效。熟悉着色器編程模型
4. 建個3D模型、熟悉3D模型工具的使用，並分析導出的數據結構的意義
5. 3D模型綁個事件、綁事件的方式方法研究和對比；
6. 模型容器分組、熟悉分組的意義和做用；
7. 寫個粒子系統、CPU寫粒子系統、GPU再寫粒子系統、差別對比
8. 加上光照，熟悉環境光、平行光、點光源的實現。這裏能強化着色器編程和解析幾何知識；
9. 幀動畫、骨骼動畫；
10. 實時碰撞檢測，基本AABB和OBB碰撞檢測。WebGL是爲實時渲染設計的，配合實時碰撞檢測技術才能作出複雜的遊戲程序。
11. 最後：各類性能優化，上面提到的每一個點都有大量的優化和探索空間。

更多精彩內容，敬請期待張磊在AC2016上的分享——《3D引擎架構設計》