日本発 WebGL フレームワーク Grimoire.js の開発チームが IPA の未踏事業スーパークリエイターに認定!

kyasbal : 2017-06-05 13:29:44

日本の若き WebGL 開発者たちの快挙!

今回ご紹介するのは、日本人の若き開発チームの手によって開発が進められている WebGL フレームワーク、Grimoire.js に関する寄稿記事です。

これまでにも、当サイトでは何度か Grimoire.js に関する記事を書いたことがありましたが、今回は開発チームでリーダー的存在の @kyasbal_1994 さんから記事を寄稿していただくことができました。

その開発背景や設計思想にまで及ぶ、思いのこもった原稿となっています。WebGL や、それを取り巻くウェブを彼らがどのように捉えているのか、現役の多くの開発者にとっても興味深い内容になっていると思います。

以下より、寄稿記事をぜひ読んでみてください。

未踏事業とは

基本情報技術者試験などの主催団体等で知られる独立行政法人情報処理推進機構では、毎年25名前後の25歳以下でITを用いて革新的なことをしたい若者のプロジェクトの応募を募集しプロジェクトとして採択支援し、その中でも特に未踏的なプロジェクトを行い、クリエイターとしての技能が高いものに対して"スーパークリエイター"の称号を与える人材発掘事業です。

今回、総本山でもしばしば取り上げていただいたWebGLのためのJavascriptフレームワーク「Grimoire.js」の主要開発メンバー4名がこのスーパークリエイターに採択されました。これを期に、Grimoire.jsがどんなプロジェクトで、僕らが何を成し遂げようとしたのか、その先にどんな未来があると描いているかをご紹介したいと思います。

Web開発のフローとWebGL開発を融合させるためのフレームワーク「Grimoire.js」

Web開発のためのWebGLフレームワーク
(https://grimoire.gl)

WebGLはWebで生まれた技術ですが、元々はCGの世界で育ったOpenGLと呼ばれる技術がベースになっています。そのため、他のWeb系のAPIとは大きく異なる特徴があります。

まず、見た目を管理する他のWeb系の技術とは異なりDOMのような状態を保持するデータを、必要があるたびに操作するようなデータドリブンな構造ではありません。何か表示するには基本的には毎回ループを回して描画し、更新してあげる必要があります。

他のJavascriptのAPIと比べても、ループをフレームをまたいで回し続けるというケースは類を見ません。初期化処理やユーザーインタラクション、通信処理を含めてすべてイベントドリブンで行われ、その都度適切な必要な処理を用います。

少し小難しくなってしまいましたが、とにかくWebエンジニアからしたら慣れた書き方とは程遠いという事に尽きます。

しかし実はこの逆も隠れた問題でもあるのです。つまり、これらに使い慣れたはずのCGエンジニアからしてもどんなAPIをWebエンジニアに提供したらいいのかわからないということです。この影響からか、超ハイスペックなWebエンジニアが作成したWebGLのコンテンツでないものはほとんど、Webページ丸ごとWebGLだけで描画しているCGの技術だけで構築されたページが散見されると思います。

Webの世界とCGの世界の差(Grimoire.jsの発表スライドより)

そこでGrimoire.jsが作成されました。Webの世界とCGの世界を綺麗な形で接続するための設計の定式化、双方のエンジニアが綺麗に協業できるよう、それぞれに適したAPIを提供し、結果的にうまく繋がっているような綺麗なライブラリはないだろうか。そう考えて作られたのです。

実際、Grimoire.jsは3つの側面でこれを実現しています。まず、Webエンジニアが誰しもが慣れ親しんでいるようなHTMLのようなXMLベースでWebGLのキャンバスの中身が記述できる言語GOML。Webエンジニアが誰でも最初に通るようなライブラリjQueryのような思想でこのWebGLのキャンバスを操作できるようなJavascript API。

一方、CG側のエンジニアから見れば、このGOMLというのはUnityのゲームオブジェクトや、コンポーネントを組み合わせているファイルにすぎないという見方ができ、中身はUnityのようなAPIで拡張することができます。

Grimoire.jsの備える3つの側面(Grimoire.jsの発表スライドより)

このようにして、Grimoire.jsが提供する決められた構造に則ると二つの種類のエンジニアが適切な形で分業可能になる。そんなフレームワークです。

このプロジェクトで考えたWebGLの価値

実際、WebのデザインにWebGLを合わせるのは難しいことです。多くの場合、WebGLを使うことが決まっていて、どんなデザインが良いか考えているケースが大半であるのが現状でした。どうやったらWebGLを使うようになるのか、この先に本当にWebGLは使われるようになるのか

プロジェクト中にこの質問に本当に苦労させられました。ほとんどのユーザーはWebGLを見たいからWebページを開くのでなければ、ほとんどの良識的なWebエンジニアにとってWebとは軽いデザインであるべきなのです。

それに案外ほとんどのことがWebGLなしにCSSやビデオの組み合わせで工夫することで成し得たりしてしまうことが多いですし、ユーザーがインタラクションしない限り、ただの画像か動画と同じようにしか見えません。実際、WebGLが当たり前に存在するようになった世界でユーザーは3Dモデルをわざわざマウスで回転させて眺めるでしょうか?形状の情報を伝えるだけなら、モデルの回転しているデータを動画にした方が良いかもしれません。そもそも、Webブラウジングでクリックとスクロール以外を行わせるのはイレギュラーなことなのですから。

でも、僕の結論としてはWebGLは必要で未来のある技術だということです。もっとも、今もMatterportとかSketchfabとか、Webでやる意味と3Dで行う意味が高いことが明らかなものについては価値が高いことでしょう。

しかし、僕が考えようとしたのは未来のWebの中のWebGLの位置付けです。Webでの3Dが局所的なものでしかないのか?という問いへの答えでした。

今、人間のUXを向上するのにはある種の限界まで来ています。モバイルデバイスが登場してから、人から情報の扱いやすさを最大限向上して、成果率をあげようとする時代はもしかしたら変わるかもしれません。もう少ししたら、人間のUXを向上させるより機械にやらせるほうが早いという時代が来るのではないかと思っています。実際、アメリカでは1日一回以上音声検索する大人は41%、10代の子供に至っては55%にも上っています。(2014年)

さらにGoogleの音声検索トラフィックは2015年から2016年の間に2倍に増えました。アプリの操作性というUXではなく、機械がどれだけ多くのやりたいことを適切な操作に変換できるかというAIによるUIの時代になって来ています。

音声検索率の変化
(https://googleblog.blogspot.jp/2014/10/omg-mobile-voice-survey-reveals-teens.html)

そのような時代、デバイスはどう変革を遂げるでしょう? 僕はHoloLensのようなデバイスはポストモバイルの時代に来る可能性が高いのではないかと思っています。というのも、このようなデバイスを用いれば人間が見るものそのものを撮影でき、聴くものを聞けるので、より適切に様々なコンテキストを理解して人間の思うこと、やりたいことをスピーディーに的確にできるようになるからです。もちろん長い文字とか打つのには向いていないですが、モバイルでも、文章書く時はPCでかいたりしますよね。もっと若い人はモバイルの方が早いなんてことも最近出て来ていますが、これはポストモバイルの時代でも変わらないことでしょう。

Microsoft HoloLens (C) Microsoft.
(https://www.microsoft.com/ja-jp/hololens)

そのようなデバイスを装着すれば、映画館のロビーに行けば次週公開予定のトレーラーが浮いていることでしょうし、不動産屋の前に行けば今売りたい高層マンションのモデルが浮いているかもしれません。広告ウザいと感じるかもしれないですが、検索しようとしている時に入って来るような広告というより、電車のつり広告のような受動的な広告のようなイメージですからユーザーの受け取り方も大きく変わるかもしれません。しかし、映画館行くために映画館に行くためのアプリを開かないでしょうし、不動産屋の前を通り過ぎるためのアプリなんてものがあるはずもありません。そのような未来では、場所とコンテンツをマッピングするような何かがあるはずなのです。しかも、勝手にダウンロードしてきて実行するのは危ないですから何らかのサンドボックスオープンで標準化されたコンテンツ基盤が必要なはずです。これは一種のブラウザの未来なのではないかと考えています。

そんなブラウザの未来、Webコンテンツの定義域の拡張も今のWebの延長線上にあると思っています。なぜなら、今のデバイス上でできるそのような機能はブラウザしか持ち合わせておらず、URLという場所に則ってコンテンツを表示するための一種のVRゴーグルがブラウザだったわけです。コンテンツが標準化されて、ポストモバイルデバイスから見れるころにはWebGLの後継になるようなAPIや、そもそもWebGLを使うよりももっと簡単な標準化された何かが出るかもしれませんが、いずれにせよコンテンツなどの進化の中で先取りするに十分に有用な技術で、Web上の3Dコンテンツという価値が高くなるというのはWebGL問わず言えると考えています。

いずれにせよ、現状のWeb開発フローでWebGLを扱えるようにしてWeb上の3Dコンテンツの価値を増やすための一端を担って行くGrimoire.jsが日本発で世界に届けていきたいと思っています。

リンク

Grimoire.jsの説明スライド(やや重いですが方向キー横で進みます)

Grimoire.js 公式サイト - https://grimoire.gl

未踏2016スーパークリエイター認定に関するプレスリリース

share

follow us in feedly

search

search

monthly

sponsor

social