次なる Web を見据えて

来たるべき WebGL2 の時代へ

2011 年、最初のバージョンである 1.0 が勧告された WebGL は、ウェブブラウザ上で OpenGL ES に相当するグラフィックス API の機能を利用することができる JavaScript の API です。

そして 2016 年、WebGL の正当な後継バージョンとなる WebGL2 (もしくは WebGL 2.0) がいよいよ本格的に利用できる段階になりつつあります。

当サイトでは、2012 年の開設以来、WebGL 1.0 系の API を用いるための技術解説を掲載してきました。そして今後は、時代の変遷に合わせて WebGL 2.0 系の解説記事も公開していく方針です。

WebGL 2.0 が登場するとは言っても、後方互換を保つという意味もあって 意図的に有効化 しない限りは WebGL 1.0 相当の API がこれまでどおり利用されます。当サイトに掲載されている多くのテクニックや概念は、これまで同様に利用できるものがほとんどですので学習の参考に利用してみてください。

WebGL 2.0 系に特有な技術や概念については、別のカテゴリに分けて掲載します。

WebGL とは

WebGL は、ウェブブラウザ上で OpenGL ES 相当の描画処理を行うことができる低レベル API で、GPU を利用した高速で強力な描画性能をウェブにもたらします。

セキュリティの観点から、ブラウザにはプラグイン等をインストールすることが敬遠されて久しいですが、WebGL は JavaScript の API として実装されているため、あらためてプラグイン等を一切インストールすること無く実行できます。ブラウザが WebGL を実行できるのであれば、通常のウェブページと同様に、PC だけでなくモバイル端末などでも同様のコンテンツを配信することができ、マルチプラットフォームな開発が行えるのが特徴です。

wgld.org の特徴

当サイトでは実際にブラウザ上で動作する多くの WebGL サンプル・デモを用意しています。

WebGL 初心者にもわかりやすいよう、できる限り詳細に概念やテクニックを解説しています。また、中級者以上のレベルの人にも参考になるようなコンテンツをたくさん紹介できたらと考えています。

各テキストの内容を参照しても理解できない部分や、テキスト内の誤りを発見した場合には下のほうにメールアドレスを記載してありますので、そちらまでお気軽にご連絡ください。できる限り迅速に対応します。※確実に対応することをお約束するものではありませんが……

Twitter で DM やリプライ飛ばしてもらえれば割とすぐに反応できると思いますので、そういった形でのお問合わせでも大丈夫です。

@h_doxas on Twitter

また、当サイトのサンプルやデモに限らず WebGL には環境によって動作に差が出る場合があります。完全に動作しない場合もあれば、動作はするが描画がおかしくなる場合など様々です。3D の PC ゲームがそうであるように、環境に依存する部分がどうしても出てしまいますのでその点はご理解ください。

また、当サイトは 極力ライブラリを使わない 方針で解説記事が書かれています。ライブラリの使い方は、それに詳しい方々がやってくれるでしょうし、当サイトはあくまでも、ライブラリを使わず直接 WebGL を書く方針で運営しています。ライブラリの中身でどのようなことが起こっているのかを理解するためにも、まず WebGL そのものがどのように機能するのかを理解することは無駄にはならないと思います。

コンテンツ

当サイトを初めてご利用いただく場合には、サイトポリシーに目を通していただけるとよろしいかと思います。

当サイトの全てのコンテンツにアクセスするには、サイトマップを活用してください。

そのほか、利用規約や免責次項についても確認してください。

ご意見、ご要望などは admin[$]wgld.org ($ -> @) までご連絡ください。

WebGL JP コミュニティ

WebGL は OpenGL ES の API を直接操作するような実装を行う必要があり、普段 Web のフロントエンドをバリバリこなしている方であっても、3DCG の経験がないと非常に難しいと感じる場面が多いでしょう。また、WebGL の API の他に GLSL と呼ばれるシェーダ言語を同時に習得する必要があり、学習コストが高めになる傾向もあります。

当サイトでは、Slack を用いた WebGL コミュニティを開設しています。参加は無料で、質問や意見交換、雑談など、参加者の自由な粒度で活用できると思います。気軽にご参加ください。

WebGL に限らず、3DCG はちょっとしたことで大きな罠に引っかかることが多いです。

自分の力でじっくりと問題解決に取り組むことももちろん大切ですが、どうしてもわからないことがある場合など、気軽に質問してみましょう。きっと WebGL 界の猛者たちが、あなたの助けになってくれると思います(笑)

entry

PR

press Z key