ひとりでのアプリ開発 - fineの備忘録 -

ひとりでアプリ開発をするなかで起こったことや学んだことを書き溜めていきます

Unity - WebGL とは

初めに

 Unity では WindowsMacOSAndroid などビルド時に対応するプラットフォームを選択できます。そのなかに WebGL というプラットフォームを選択することができます。本記事では、WebGL について簡単な説明をします。

WebGL とは

 WebGL(Web Graphics Library)は、ウェブブラウザ上で3Dグラフィックスを描画するためのJavaScript APIApplication Programming Interface)です。

 通常、ウェブブラウザはHTMLやCSSを解釈するためのツールですが、WebGLを使用することで、ウェブブラウザ上で3Dモデルやアニメーション、ゲームなどをリアルタイムに描画することが可能となります。

 簡単にまとめると、WebGLはブラウザ上で動かすことができるもの。基本的には、ChromeFireFoxSafariをはじめ、すべてのブラウザで動作可能です。

どのようなものができるのか

 WebGLでは、ウェブサイト上にゲームを設置したり、3Dモデルを描画したりなど、さまざまなことができます。

 具体例を見たほうがわかりやすいと思いますので、WebGLが利用されているウェブページの例を二つ載せておきます。

InterLand

 Google が提供するインターネットリテラシーの理解を進めるためのオンラインゲームです。

beinternetawesome.withgoogle.com

1 DAY 1 WORK

 WebGL のデモがたくさん載っています。

lab.subskill.com

Unity WebGL

Unity WebGL とは

 Unity 上で作ったものは WebGL 形式でビルドすることができます。

 Unity WebGL はデスクトップブラウザを想定しており、モバイルブラウザで Unity WebGL アプリケーションをロードしようとすると警告メッセージを表示するようです。Unity のドキュメントでは、ハイエンドのデバイスでは動作する可能性がありますが、現在のデバイスは多くの場合、Unity WebGL コンテンツをサポートするのに十分な性能がなく、メモリが不足してしまうと書いてありました。

事前準備

 使用するバージョンに WebGL Build Support をインストールする必要があります。

 次の手順でインストールすることができます。

WebGL Build Support のインストール手順)

  1. バージョンの右上にある ”︙” をクリック
  2. モジュールを加える
  3. WebGL Build Support をインストールする

出力方法

 プラットフォームを WebGL にし、Switch Platform をクリックします。

 次の画面をシーンを作り、Build してみます。

 File > Build Settings... から Build and Run をクリックします。

 ローカルで実行され、ブラウザ上で先ほどの画面が表示されました。


出力ファイル

 Build して、出力されるファイルは次のようになります。

 これらのファイルが入っているフォルダを丸ごとサーバーにアップロードすればよいようです。

参考

docs.unity3d.com

www.sejuku.net

(電脳産物:WebGLビルドで公開する)
dianxnao.com