html5experts night #2で発表した資料です。 http://atnd.org/event/E0020309

1. WebGLと<video>を
組み合わせると
おもしろい
HTML5 Experts Night #2
2013/10/25(Fri)
!
@pirosikick

2. 自己紹介
• 穴井 宏幸
• @pirosikick
• エンジニア
• どちらかと言えばフロントエンド
• 好きな言語: JavaScript
• HTML5大好きっ！！！！

3. 初LTです

4. 緊張しています

5. よろしく
お願いします
m(_ _)m

6. WebGL
• OpenGLのブラウザで動く版
• Canvasと違ってGPUを使うからさくさく
• 対応ブラウザが増えてきた！

7. http://html5experts.jp/yomotsu/2897/

8. WebGLと<video>?
• Textureとして<video>が使える
• <canvas>とかも使える

9. サンプル
http://threejs.org/examples/#webgl_materials_video

10. • 派手
• なんかすごい
• なんかかっこいい
• 素敵っ////

11. でも、むずかしいんでしょう？

12. three.jsを使おう
• WebGLのラッパーライブラリ
• 現在のバージョンはr62
• WebGLと一緒に紹介されることが多い

13. デモ１
http://s3.pirosikick.com/html5exp-night-2/ex1.html

14. 50

15. さらにWebRTCを
組み合わせる

16. デモ２
http://s3.pirosikick.com/html5exp-night-2/ex2.html

17. まとめ
• three.jsのお陰で難しいことを考えな
くてよい
• OpenGLではできないことが絶対できる
と思う。
• しかもOpenGLのノウハウは使えそう

18. ありがとう
ございました