Blend4Web：最新の国内ソフトウェア業界のレビュー

長い間ビジネスをしていて、すべてを知っているように見えると、突然、研究のかゆみを引き起こす何かが現れます。 それで私に起こった。



Unityから離れて、3Dマスターからの次のレッスンをゆっくり見て、私はYouTubeから親切に提供されたビデオに出会いました。 絵で描かれたシンプルな立方体は、徐々にエネルギーで満たされました。 Sci-Fiスタイルのグロー効果-わずか6秒のビデオと一部のBlend4Webのリリースに関する簡単なタイトル。 私の最愛のブレンダーとの関係はすぐに生まれ、この「獣」をよりよく知りたいという欲求もすぐに生まれました。







奇妙なことに、開いたサイトはロシア語でしたが、それは喜ばしいことではありませんでした。 英語は私には馴染みがありますが、ネイティブは常に近いです。 「あるいは、スラブも開発されたかもしれません」と私は考え、推測しました。 しかし、最も興味深いことがさらに判明しました-Blend4Webは、Blenderに統合されたWebGLエンジンに過ぎないことが判明しました。 純粋なUnityユーザーにとってはあまり興味がありませんでしたが、熱烈なブレンダー（ちょっと、韻を考える必要はありません）は通り抜けることができませんでした。 そして、プログラマーのこの驚くべき発案について知り合いが始まりました。



WebGLは非常に人気のある技術であり、有望であり、...同様に遅いです。 少なくとも私の弱いタブレットでは、ブラウザで実行されているWebGLアプリケーションは、亀の魅力のように見えました。 公平に言うと、これはBlend4WebやUnityの問題ではないと言えます。 弱いハードウェア+ユニバーサルライブラリは常にこの結果につながります。 開発者としての私の個人的な経験では、弱いデバイスでゲームをテストする必要があると言っているだけです。もちろん、ネイティブデバイスは常に普遍的なソリューションよりも優れています。 しかし、WebGLを使用すると、インターネットの明るい未来がはっきりと見えます...



Blend4Web開発者サイトには多数のデモがあります。 そして、通常のハードウェアで実行すると、非常に興味深いリアルタイム効果がブラウザに直接表示されます。



視覚効果の豊富なセットに感銘を受けました。 写実的な素材、高品質の照明と影、屈折と反射、画像の後処理-リストは膨大です。 各デモにはユニークなものが表示されます。 エンジンの視覚的な力だけでなく、その子孫に対する開発者の愛情も見ることができます。 これを見なければなりません。





図 2



Blenderまたは他の3Dモデリングプログラムでは、このようなシーンを作成しても特別な問題は発生しません。エンジンを知っている場合は、リアルタイムアプリケーションを実装してください。 ただし、Blend4Webの開発者は、Blenderで作成されたシーンはほぼ完全にWebGLプラットフォームに転送されると主張しています：モデル、アニメーション、パーティクルシステム、物理設定、シェーダーなど。 視覚機能にプログラミング言語を追加し、プラグインなしでブラウザーで実行される対話型アプリケーションを取得します。 このような汎用性は非常に価値があります。



誰かが、なぜ私のお気に入りのUnityやUnreal、またはそこにある何かが完全にWebGLにゲームをエクスポートできるのか、と言うことができます。 そうですが、Blend4Webはゲームにのみ適していると言ったのは誰ですか？ 確かに私ではない...



デモを初めて見たとき、人気のあるソーシャルネットワークに設定、コントロール、共有ボタンがある、ある種の普遍的なプレーヤーでスピンすることに感銘を受けました。





図 3



エンジンの機能の大部分は、コードを1行も使わずにBlenderで直接設定されていることがわかりました。 そのため、たとえば、開発者サイトからダウンロードしたプラグインをBlenderに接続して、マウスを数回クリックするだけで標準のデフォルトシーンをエクスポートしました。 エクスポートの結果、同じユニバーサルプレーヤーを持つ単一のhtmlファイルが作成されました。 合計で、わずかな労力で、目立たないキューブをすべての側面から表示できるWebGLアプリケーションがあります（Blenderでは、キューブはデフォルトでゼロシーンに作成されます）。 ご存知のように、このようなファイルは、個別のページとしてサーバーにアップロードしたり、iframeコンテナーに表示したり、顧客に送信して表示したりできます。アーティストのオプションは豊富です。 そして、これはほとんどすべての複雑なシーンで行うことができます！ このようなインタラクティブインサートは、高度なオンラインストアで商品を有利に表示できることは明らかです。



ただし、すべてがそのような原始的な表示のみに制限されている場合、Blend4Webの未来はうらやましいでしょう。 しかし、すべてがはるかにクールであることが判明しました...



開発者のWebサイトでダウンロードページを表示しているときでも、2つのオプションから選択できることに気付きました。Blenderのプラグインと完全なSDKです。 そのため、開発者は将来のユーザーの世話をしました。 簡単な方法であれば、最初のオプションは設計者向けであり、2番目のオプションはプログラマ向けです。



おそらく、エンジンの長所と短所が隠されているのはここです。 Blenderプラグインを使用すると、プログラマーでなくても問題なくインタラクティブシーンを作成できます。 ただし、このシーンは組み込み機能によってのみ制限されます。 関数のセットは本当に堅実で、多くのタスクをカバーしていますが、何かが足りない場合は、完全なSDKを安全にインストールして低レベルの作業を実行できます。 エンジンAPIを調べることで、これに時間をかける必要があります。



しかし、プログラミングなしでアプリケーションを作成できる部分に最も興味がありました。 このプロセスがどれほど直感的に行われているか、新入生がどのような困難に直面しているのか、そして一般的にこのシステム全体が何ができるのか！



もちろん、私からの新人はまだです。 Unityで商用ゲームをリリースしたBlenderの長期使用-これはすべて無条件の有利なスタートを与えます。 それにもかかわらず、計画されたシーンを作成しようとして、私はたくさん座らなければなりませんでした。 そのため、ドキュメントとチュートリアルを完全に省くことができませんでした。 Blend4Webテクノロジーは非常に成熟しており、敬意を払った学生の態度が必要であることが判明しました...



Blend4Web設定は、Blenderパネルに非常によく適合します。 たとえば、このスクリーンショットは、標準のBlenderカメラに関する追加オプションを示しています。 エンジンの知恵に慣れていない人でも、ここでプレーヤーのカメラの動作が設定されていることに気付くでしょう。





図 4



同様のニュアンスは、プログラムのほぼすべてのパネルに見られます。 ところで、ドキュメントについて-それは詳細であり、ロシア語で書かれており、エンジンをマスターするためのしきい値をさらに減らします。



私が最初に嬉しかったのは、Blenderの技術的能力を備えたエンジンのきちんとした仕事でした。 したがって、たとえば、チェーンを作成するために、1つのリンクを作成し、Arrayモディファイアを使用してそれを乗算しました。 エクスポート後、プレーヤーはモディファイヤを使用して、歪みのない形式でチェーンを表示しました。 このアプローチにより、特定のエンジンのシーンの最適化を減らすことができます。 Blend4WebはBlenderを非常によく理解しており、すべてを正しく視覚化しようとします。



同じことが材料設定にも当てはまります。 Blenderでできることのほとんどは、エンジンを表示することもできます。 簡単に言えば、複雑なマテリアルを使用してモデルを作成することにより、ほとんどの場合、ブラウザで変更せずにそれを見ることができます。 そのため、チェーンを試してみたところ、クロムメッキを施した金属の効果は問題なく、硬い光沢とある程度のスペキュラリティで実現しました。 はい、はい、驚いたことに、標準のBlenderシェーダーはWebGLで正しくレンダリングされます。 確かに、それらはすべてサポートされていません。 そのため、たとえば、拡散シェーダーMinnaertの動作を確認できませんでした。 それがまだサポートされていないことをドキュメントで発見したのは後になってからです。 しかし、これらの実験で最も驚くべきことは、シェーダーノードの正しい操作です。



ノードは特別なBlenderの歌です。 ビジュアルエディタを使用すると、ブラウザウィンドウに正しく表示される素晴らしい素材を作成できます！ Blend4Webは、いくつかの例外を除き、ほぼすべての標準エディターノードをサポートしています。 確かに、それらのすべてがリアルタイムでの作業に適しているわけではないため、これを考慮する必要があります。 ところで、標準ノードに加えて、開発者はリアルタイムエンジン用に最適化された独自のノードを提供します。



また、アニメーションを少し試してみました。 Blend4Web開発者のWebサイトは、Blenderアニメーションの主要なタイプがサポートされていると述べました。 素材を使った作品に触発され、振り子の最も単純な動きをすばやく作成しました。 彼はエクスポートボタンをクリックし、ブラウザの揺るぎないチェーンを見つめていました。 率直に言って、私はアニメーションをすぐに開始することができませんでした。 奇妙なことに、ドキュメントを読んで助けました:)したがって、私はすぐに初心者に警告します。 Blend4Webはシーン、オブジェクト、マテリアルの設定を完全に理解していますが、デフォルトでは何もしません。 すべてを手動でオンにする必要があります。 したがって、たとえば、同じアニメーションの場合、オブジェクト設定の対応する場所を確認する必要があります（図5を参照）。 これは、作業のすべての（！）多かれ少なかれ複雑な側面に適用されます。 ほとんどの場合、エンジンの強制通知が必要です：「はい、これを機能させたい！」





図 5



一見、これは過剰に思えます。 たとえば、マテリアルのスペキュラリティを表示するには、マテリアルパネルでマテリアルを構成するだけでなく、シーンパネルで「Render Reflection」オプションを有効にし（グローバルアクティベーション）、特定のオブジェクト（オブジェクトデータ）に対応するチェックボックスを設定する必要があります。 その結果、1つの小さな機能では、3つの異なるBlenderパネルでの操作が必要でした。 このアプローチは非常に不便に見え、組み込みのBlender Game Engine（リアルタイムBlenderエンジン）のセットアップに似ています。



おそらくこれはBlend4Webのモジュール性によるものです。 私が理解しているように、グローバル機能（物理、後処理、いくつかの複雑な視覚化アルゴリズム）を有効または無効にすることで、実行されるコードのサイズを変更できます。 または、Blenderコアコードとエンジンの統合の問題ですか。 いずれにせよ、このアプローチは、特に初心者にとってはあまり役に立ちません。 もっとシンプルまたは自動化したいのですが。 ユーザーがマテリアル設定で反射をオンにした場合（マテリアル->ミラー）、現在のオブジェクトの対応するグローバルエンジン機能とローカル設定が自動的にオンになります。 または多分私はUnityに甘やかされています...



上記のすべては、エンジンの視覚側にのみ適用されます。 ただし、美しい絵によってインタラクティブ性は生まれません。



Blend4Webを使用すると、2つの方法でインタラクティブ機能を追加できることを既に書いています。Blenderプラグインを使用する場合の単純な方法と、JavaScriptコードを記述することによるより複雑な方法です。 この記事では、プラグインの使用にのみ焦点を当てます。 個人的には、開発者はBlend4Webをデザイナーのフレームワークとして位置付けているという意見を受け取りました。



そのため、開発者は特定のタスク用に既製のモジュールセットを提供します。 たとえば、同じカメラに戻った場合（図4を参照）、デフォルトでは、特定のポイントを中心に回転し、スケールを使用して移動（パン）できます。 ここで、カメラパネルでは、「スナップ」、回転、および移動のリミッターを設定できます。最も重要なことは、動作スタイルを完全に変更することです（静的、オブジェクトを参照して、いわゆるFPSカメラなど）。 メニューから目的のスタイルを選択すると、パラメーター自体が変更されます。 便利ですが、タスクの全範囲をカバーすることはできません。



他のモジュールでも同じことが言えます。 たとえば、物理学を考えてください。 デフォルトでは、エンジンはBlenderの組み込みの物理設定を使用できます（もちろん、いくつかの制限があります）。 しかし、Blend4Webブランクを使用することで、生活を簡素化できます（図6）。 ここでは、合計3つの行動モデルが提供されています：水泳、交通、キャラクター。 それに応じてモデルを準備すると（詳細はドキュメントに詳細が記載されています）、出力で既に構成された物理を取得します。 便利なことは何も言わないでしょう。





図 6



同様のアプローチがどこでも使用されています。 水が必要ですか？ 問題ありません-オプションを確認してください。 スカイボーを作成するのが面倒？ 手続き関数を使用します。 サッカー場を考えていますか？ Dynamic Grassをオンにします。 そして、そのようなことすべて。



これにより、オブジェクトの動作をカスタマイズするのが簡単になりますが、インタラクティブ性はまったく得られません。 どういう意味ですか？ はい、最も単純なイベントモデルですらあります。 マウスをクリックしました-ホイールが回転しました。



最初は、Blend4Webを使用してBlender Engineのビジュアルロジックエディタを使用できると考えました。 エンジンとBlenderの緊密な統合を考えると、これは論理的です。 ただし、そうではありません。 開発者は、多くの便利な機能があるAPIを使用してコードを記述するか、NLAを使用することをお勧めします。 知識のあるBlenderユーザーは、「そして、アニメーションエディターはそれと何の関係があるのでしょうか？」と叫ぶでしょう。





図 7



[シーン]パネルの設定をよく見ると、新しいAppend NLAスクリプトスロット機能を見ることができます。 図7は、これらのスロットの1つと、可能な値の開いているメニューを示しています。 別のオブジェクトをクリックしたときにオブジェクトのアニメーションを有効にするとします。 ロジック作成アルゴリズムは次のとおりです。

1. スロット1：「選択してジャンプ」。 アクション：目的のオブジェクトが選択されている場合は、指定されたスロット（スロット2）に移動します。
2. スロット2：「再生」。 アクション：アニメーションを再生します。

これは、特別な「選択して再生」コマンドを使用して高速に実行できますが、その意味は明確だと思います。 何にも似ていませんか？ そうです、Blender自体のロジックエディターの簡易バージョンです。



このようなスロットシステムは、比較的単純なロジックには適していますが、より重いものに使用するのは非現実的です。 結論：通常のスクリプトを使用してください！

結論

私はBlend4Webでかなり働いていましたが、私には権利がなく、客観的な決定を下すことはできません。 しかし、私は主観的な意見を表明します。



長所：

• Blend4Webは、大きな可能性を持つ興味深いオープンシステムです。 開発者は驚くほど多才で、毎月さらにクールな機能を備えた新しいバージョンを着実にリリースしています（本当に！バージョンの名前はリリースの年と月の表示です）。 エンジンの商用版は、基本的に無料版と変わりません。
• このサイトには優れたドキュメント、例があり、すべてがロシア語です（英語に相当するものがあります）。 エンジン自体はBlenderと完全に統合されており、標準設定は簡単にエンジンにエクスポートされます。
• オブジェクトの視覚化または動作のカスタマイズを簡素化するために、さまざまなワークピースを使用できます。
• 初期のビジュアルプログラミングシステムがあります。
• htmlでのエクスポートと実装のさまざまなオプション。 このトピックの説明を読んでください-多くの興味深いアイデアがあります。
• エンジンの視覚的な部分は非常に印象的です。

短所（およびそれらがない場合）：

• NLA論理スロットは、単純なロジックにのみ適しています。
• 一部の機能の過度に複雑なアクティベーションシステムは、行き止まりにつながる可能性があります。 すべてのパネルをカチカチとシャベルするのを忘れていました。 プラグイン側のもう少しの自動化は非常にいいでしょう。

そして今まとめます。 私はエンジンのその部分のみを考慮しましたが、それはプログラマーが作業することを許可せず、もちろん、アプリケーションの複雑さに特定の制限を課します。



私の意見では、Blend4Webプラグインを使用すると、3次元オブジェクトの表示、インタラクティブなプレゼンテーションをすばやく効率的に準備し、サイトを3次元要素で囲み（開発者のWebサイトのロゴを参照）、簡単なゲームを作成できます。 従来フラッシュで行われていたことの多くは、WebGLで完全に行うことができます。 Blenderは3Dを作成するための優れたツールであり、Blend4Webはブラウザでのリアルタイムの優れたソリューションです。



しかし、より複雑なプロジェクト（ゲーム）の作成には疑問があります。 開発者向けサイトにはゲームの作成に関するチュートリアルがいくつかありますが、この複雑さは依然として高すぎます。



Unity（これが私のメインのゲーム開発環境です）とBlend4Webを比較するつもりはありません。 多分次の記事で、私自身が実験の能力を本当に理解するとき...