どくらぼ

言いたいことを言います

ワシと WebGL 2016

なんですか

2016 年もあと少しで終わりですね。

今年のうちに書くべきであると思っていたテキストなどだいたい書き終わりまして、このブログに無駄に文章を打ち込む精神的余裕が生まれたので唐突に書きます。

2016 年という年を、自分なりに振り返ってみる内容で、技術的な話はあんまり出てこないと思います。ポエム的な何かです。

 

あらたなるステージ

WebGL は確か、2011 年くらいから徐々に使えるようになってきた技術だったと記憶していますが、それから早五年、やっと WebGL 2.0 が本格的に視野に入る状況になってきました。

2016 年という年を振り返ると、やはり一番大きなトピックはこれだったのかなという気がします。

WebGL 1.0 でさえ十分に普及しているとは言い難いですが、そんななかで WebGL 2.0 が登場してくることが、果たしてウェブという世界にとっていいことなのか、わるいことなのか、それとも大した意味はないのか。いろいろ個人的には思うところもあるんですが、まあ正直言って「大きな意味はない」というのが悲しいことに現実のような気もします。

というのは、WebGL を使いこなせる人がやっぱり少なすぎますよね。2.0 出るぜ! と言っても興奮するのは WebGL おじさんたちだけですしね。

それでも、個人的には WebGL 2.0 はとても楽しみな存在であることには変わりありません。一般ユーザーがその恩恵になにかしらの形であやかることになるのは、二年後くらいじゃないですかね。

要するに、私としては今までとやることは変わらないということです。地道に WebGL について語る機会を作り、粛々と、普及のために努力していこうと思います。

この段の最後にあえて WebGL おじさんとして一言、言わせていただけるなら「WebGL 2.0 は激アツだし最高」と思ってます。はやく普通に使えるようになってほしいなあ。

 

WebGL をどう啓発するか

私が WebGL を勉強し始めたのは、2012 年のころだと思います。

当時は、JavaScript もろくにわかってなかったので、まあ大変でした。WebGL に関する資料の大半は英語でしたし、やっと Chrome がデフォルトで WebGL を有効化させたくらいのころでした。

当時に比べると、日本語の WebGL に関する情報は結構たくさんありますよね。Qiita なんか見てても、今では普通に探せば大抵のことは日本語の解説つきで紹介されているかと思います。

それでも WebGL が普及している感じがしないのは、やっぱり成果物が出回ってないからじゃないかなと思います。なんていうか、three.js 使ってとりあえずやってみました! みたいなところから、一歩抜け出している和製 WebGL コンテンツは本当に少ないです。

でも、それって必ずしも悪いことじゃないと思ってます。

three.js 使ってて全然構わないし、むしろスクラッチWebGL バリバリ書くとか頭おかしいなこの人って思います。

要するに、もっとみんな気軽に WebGL 使ってみたらいいんじゃないかな。ウェブに 3D とか GPU 使った高速な描画とか必要ないと思う人は(あるひとつの側面から見たときに)時代に取り残されていけばいいと思いますし、なんか危機感持ってるなら、あくまでも選択肢のひとつとして、WebGL の可能性を探ってみればいいと思います。今は、3D 表現だけでなく、2D を高速にさばくためのライブラリとかもあります。要は、どう付き合っていくのかの問題ですから、触らずに無視してしまうのは、とてももったいないなと思いますね。

そういうことを無意識のうちに感じたからなのか、私の取り組みを振り返ってみると今年は GLSL の普及に結構ちからを注いだように感じます。

GLSL は WebGL を利用する上で欠かせないものですが、WebGL が先にあって、そこに GLSL を加えていくというのは学習コストが一気に上がりすぎてなかなか苦しいんですよね。そこで私が考えたのは、GLSL を逆に入り口にして、そこから WebGL に興味を持ってもらうことでした。

GLSL 単体なら、結構覚えることも少なくて済むし、その割に、すぐカッコいい絵が出るんですよね。成果につながりやすいというこの GLSL の特性をうまく引き出すことができたかどうか、それは私自身にはわかりませんが、ワークショップを開催したりスクールを運営したりするなかで、それなりになにかが得られた感触は少なくとも私のなかにはありました。

この GLSL を起爆剤とするスタイルは、今後もしばらく続けてみて、より良い形での WebGL 学習の導入として洗練させていけたらいいなと思っています。

 

ゲームエンジンWebGL

Unity などのゲームエンジンから WebGL 出力を行い、それによりブラウザ上でコンテンツを展開していくケースが増えてきましたね。

将来的には、それこそそういった、なにかしらのツールから出力された WebGL プロダクトが当たり前になっていくのかなとも思っています。だって簡単にカッコよくでき、管理もしやすいとしたら、それを使わないのはおかしいですもの。

WebGL を直接記述できる、コードを書く人間としてそういう流れに不安はないのですかみたいにもしかしたら思う人がいるかもしれませんが、私は一切感じてません。だって両者は全然違うものだと思うし。アナログな絵描きとデジタルな絵描きがそれぞれに全然異なるものであるのと、同じようなものじゃないでしょうか。(ちょっと違うかw)

ちょっとだけ困っちゃうのは、WebGL 出力されたソーシャルゲームに対する苦情がそのまま WebGL 全体の苦情になっちゃうことかな。まあ、古くてスペックの低い PC 使ってると、どうしても Unity の WebGL ビルドとか動かないよね。それはしょうがないし、どうしてもゲームとかをプレイしたいなら PC 買い替えてください。お金がないなら稼ぐなり節約するなりしてください。それも無理なら、諦めましょう。

あとは、Unity 様におかれましては是非「WebGL ビルドという名称」の変更をお願いしたいですね。WebGL に首まで浸かってる私個人の勝手なお願いなので別に Unity の中のひとたちに声高に訴えたりする気は一切ないのですが、調べ物とかするときにめっちゃノイズ混じるし、Unity 使いにとっても WebGLクラッチ勢にとっても、いいことがないですね。

今すぐには難しいかと思いますが、Unity について調べるひとにとっても厄介な問題だと思いますので、ゆくゆくはなにかしら、別の表現が出てくるといいなあと思ったりしています。

 

これからの WebGL とわたし

2017 年は、どんな年にしたいかなあ。

正直あまりビジョンみたいなのはないのですが、私と WebGL との付き合い方が大きく変化する一年なのかなと個人的には予想しています。

私個人はたぶん、WebGL にトライしてみたい人をよりしっかりとサポートする意味で、three.js の学習を個人的に進めていくことになると思っています。なんていうか、自分で使うつもりはなくても、というかないんですが、three.js について質問されたときに教えてあげられなくて、歯がゆい思いをすることが本当に多くなりすぎました。

three.js は非常に優れたライブラリだと思います。ただ、私個人にとっては、ぶっちゃけ要りません。それでも、そこをきっかけにして WebGL に入っていったほうがいい場合ってやっぱり多いと思うんですよね。むしろスクラッチWebGL 書けるようになっていく人たちは、wgld.org みたいなサイトがあれば勝手にやれるようになりますからね。

来年の WebGL スクール運営では、そのあたりがキーになると思います。

three.js から入って、徐々にカスタムシェーダとか使えるようにしていく、そんなアプローチでしょうか。

年々スクールのレベル、というか扱う範囲は、どんどん敷居を下げる方向に移っていってます。より初心者向けに、より簡単に導入できるように、修正されていっています。これは結局、私の自己満足でスクラッチWebGL の記述について講義しても、それが受講者の身につかなかったら意味ないなと毎回思うからです。

精一杯サンプルやテキストを精査し、全力で講義しています。それでも、伝わらなかったり、受講者が使いこなせるようにならなかったりするなら、私のほうが間違ってます。私自身にも、three.js の学習や、よりわかりやすい資料作成のスキルが求められるのは自然なことでしょう。

がんばらないとね。

 

2017 年にやりたいこと

2017 年にやりたいこと、あるいはやってみたいことを主に自身のために書き連ねて、この無駄にポエミーなエントリを締めくくりたいと思います。

こんな感じの適当な文章を最後まで読んでくださって、ありがとうございます。

 

  • 自身の WebGL 2.0 お勉強
  • 自身の three.js お勉強
  • 自身の WebVR お勉強
  • 自身の 3DCG 全般に関するお勉強
  • wgld.org の WebGL 2.0 に関する情報の拡充
  • wgld.org の GLSL に関する情報の拡充
  • GLSL の表現をテンプレート化してなんか知らんけど並べたサイト
  • パーティクルや GPGPU 的なマッチョなテクニック重視のテキスト
  • three.js における学習の助けとなるテキスト
  • Unity の特にシェーダにおける学習の助けとなるテキスト
  • より受講者のニーズに合わせたスクールの運営(three.js 取り入れるなど)
  • GLSL ファンが集うワークショップやアワードイベント
  • 関東都心以外での WebGL 普及活動
  • フロントエンド+WebGL なコミュニティを作る