これは WebGL Advent Calendar 2015 の11日目です。
連日ハイレベルな技術記事が続いておりますが、ここで単なるミュージックビデオの登場です。
技術的にはいたって普通ですが、頑張ってモデリングしました。
たまにはこういうのもいいよねっ。
ちなみに隠しコマンドで、画面をダブルクリックするとフライトモードになります。
マウス左ドラッグでカメラを回転、WASDで前後左右移動、スペースキー + W または S で上下移動ができます。
フライトモードの終了は右クリックです。
#開発環境
- 言語 : TypeScript
- 3Dエディタ : Blender (C#でblendファイルをjsonにコンバートして使用)
- デバッグ : Chorome 開発者ツール
- IDE : Visual Studio Community 2015
- 3Dライブラリ : 特になし
#雑談 WebGLらしいとは何か
今回は作り始める前にWebGLらしい記事にしたいと思ったのがきっかけで少し考えました。
最初に思いついたのは、
- ブラウザ(Electronなど含む)で高速に3D表現ができる
- HTMLと組み合わせることができる
- JavaScriptで書くことができる
WebGLだけでなくその周辺も合わせて考えると、最近はWebGL特有の変化があるように思います。
- ゲームエンジンからのデプロイ先になってきている
- スマホでも動くようになってきた
- GLSLの投稿サイトですごいGLSLが量産されている
- 宣伝用のサイトでかなりWebGLが使われるようになってきた
- WebGLのサンプルプログラムはダウンロードせずにすぐ見られて便利
- 逆にダウンロードが必要なサンプルを面倒くさいと感じるようになった(個人的な感想です)
ここまで挙げてきたことから思うのは、
- WebGLはウェブの可能性を広げている
- 逆にウェブの可能性を広げない形で使ってもWebGLらしくないのではないか(OpenGLになる)
- WebGLは他のウェブ技術と絡めて考えると「らしく」なるかもしれない
ということでした。
それでもミュージックビデオを作りたかったのでそっちにしましたけどね!
…落ちは特にないです!
明日はawesomeさんですね。
よろしくお願いします!