Unity - WebGLでビルドしてみる



WebGLでビルドする記事をよく目にするようになりました。
前から注目されていましたがそろそろ実用レベルになってきたのかもしれません。

私も調べつつ、初めてWebGLで出力をしてみたいと思います。
まずはWebGLとはなんだろう?というところからですね。


WebGLとは?


色々調べてみてもよく理解できないので自分なりの解釈になります。

Internet ExplorerやFirefoxなどのブラウザーで表示できる技術らしいです。
特別なプラグインが必要なく、インターネットにアクセスできれば表示できます。
わざわざUnityWebPlayerを入れる必要がないのはいいですね。

どうやら今後ブラウザーではUnityWebPlayerの代わりにWebGLが主流になるようです。
ただまだ機能制限があったり、安定しなかったり、重かったりと不具合が報告されています。


実際にWebGLでビルドしてみましょう


AndroidやiOSにビルドするのは結構大変だったので、不安というか面倒くさい感じがありましたが調べてみると簡単みたいです。

では実際にやってみます。


まずは適当にオブジェクトを作成しました。
「File」メニューからBuild Settingsを選択します。



「Platform」からWebGLを選択します。
右の方を見ると、No WebGL module loaded.と書かれています。
どうやらWebGLを使用するための何かが足りていないようです。
「Open Download Page」をクリックしましょう。

※Unityをインストールするときに、インストールするコンポートを選ぶ場所があったと思います。そこでWebGL Build Supportにチェックを入れていた方はこの作業は必要ありません。

WebGLに関係のあるexeファイルがダウンロードされます。
ダブルクリックしてインストールします。



Unityを再起動して、再びBuild Settingsに戻ります。
「Switch Pratform」ボタンを押します。
※私の環境ではUnityを再起動しないと「Switch Pratform」がグレーのままで押せませんでした

WebGLの横にUnityマークがついてBuildボタンも押せるようになりました。
本来であればPlayer Settingsで色々設定するのですが、今回は出力テストなので割愛します。
このまま「Build」ボタンを押してみます。

保存先を聞かれるので適当な場所にフォルダを作って指定しましょう。
ビルドが始まります。

このシーンはデフォルトのシーンにスフィアとキューブを置いて、それぞれ違う色のマテリアルをアサインしただけの軽いデータですが、4分程ビルド終了までかかりました。結構時間かかりますね。



保存先を見ると三つのデータが作成されています。
index.htmlをダブルクリックします。



ブラウザーが開いて、先ほどのシーンを表示することができました!
無事ビルド成功です。


*注意点です
ローカルで書き出したものを確認するときはFirefoxが推奨のようです。
セキュリティーの問題らしく、ローカルのデータはIEやChromeでは表示することはできません。
(データをどこかのサーバーに上げれば、IEやChromeでも大丈夫です。)

解決策としては、Build & Runであれば大丈夫です。
これはローカルにサーバーを立てるようなものなのでIEやChromeでも確認できます。


≫Unity関連記事 もくじへ
≫トップページへ

2016年11月28日