

Unity用Needle Engine
Unity用Needle Engineを使用すると、Unity内で直接、非常にインタラクティブで柔軟性があり軽量なWebアプリケーションを作成できます。Unityエディターの強力なツールを使用して、3Dシーンの視覚的な設定、アニメーション、デザインを行います。Unity用Needle Engineは、シーンをglTFにエクスポートすることを担当し、あらゆるWebフロントエンドフレームワークと簡単に統合できます。
Unityパッケージのインストール
ダウンロードした.unitypackageファイルをUnityプロジェクトにドロップし、インポートすることを確認します。
インストールとインポートが完了するまでしばらく待ちます。「A new scoped registry is now available in the Package Manager.」というウィンドウが表示される場合があります。これはNeedle Packageレジストリです。このウィンドウは安全に閉じることができます。
サンプルを探索。
メニューオプションNeedle Engine > Explore Samples
を選択して、利用可能なすべてのサンプルシーンを表示、開く、変更します。
クイックスタートビデオチュートリアル
サンプルから開始
幅広いトピック、ユースケース、業界をカバーする100以上のサンプルがあります。
概要については、サンプルページをご覧ください。
これらのサンプルはすべてUnityで直接利用できます。
- サンプルをブラウズするには、
Needle Engine > Explore Samples
に進みます - 「Install Samples」をクリックして、エディター内にサンプルパッケージをインストールします(または、パッケージを手動でインストールするには、サンプルのunitypackageをダウンロードします)
- 任意のサンプルを選択し、
Open Scene
をクリックします。
サンプルは読み取り専用です – これにより簡単に更新できます。
私たちのサンプルシーンは、UnityのUPMパッケージの一部です。これは、それらのアセットやスクリプトを直接編集できないことを意味します – それらは読み取り専用です。サンプルパッケージからアセットを編集するには、プロジェクトのAssets
フォルダーにコピーします。サンプルパッケージからスクリプトを編集するには、Webプロジェクトのsrc
フォルダーにコピーします。
テンプレートから開始
新規プロジェクトを迅速に開始するためのシーンテンプレートを多数提供しています。
これにより、アイデアからプロトタイプまで数クリックで進むことができます。
File > New Scene
をクリックします名前に(needle)が含まれるテンプレートのいずれかを選択し、
Create
をクリックします。Collaborative Sandboxテンプレートをお勧めします。これは、インタラクティビティ、マルチプレイヤー、アセットの追加を始めるのに最適な方法です。Playをクリックして、新しいWebプロジェクトをインストールして起動します。
ゼロから開始
シーンテンプレートから開始したくない場合は、以下の手順に従うことができます。
実際には、パッケージに含まれている「Minimal (Needle)」テンプレートを再作成します。
新しい空のシーンを作成
エクスポート用にシーンを設定
空のGameObjectを追加し、名前を「Exporter」にして、Needle Engine
コンポーネント(旧称Export Info
)を追加します。
このコンポーネントでは、エクスポートされたランタイムプロジェクトを作成し、迅速にアクセスできます。
また、いずれかのパッケージやモジュールが古いか、Webプロジェクトにローカルにインストールされていない場合に警告が表示されます。プロジェクト名とシーン名
デフォルトでは、プロジェクト名はシーンの名前に一致します。それを変更したい場合は、新しいWebプロジェクトを作成したい
Directory Name
を選択または入力できます。パスはUnityプロジェクトからの相対パスです。Webプロジェクトテンプレートを選択 次に、プロジェクトのWebプロジェクトテンプレートを選択します。デフォルトのテンプレートは、高速なWebアプリバンドラーであるViteに基づいています。
Playをクリックして、新しいWebプロジェクトをインストールして開始します
独自のテンプレートを定義
似たようなプロジェクトを多数作成する場合は、Project ViewのコンテキストメニューにあるCreate/Needle Engine/Project Template
を使用して、独自のローカルまたはリモートテンプレートを作成できます。テンプレートは、ディスク上のローカル(コピーされるフォルダ)またはリモートリポジトリ(クローンされるgitリポジトリ)のいずれかにすることができます。
プロジェクトフォルダとファイル
- Assets/
プロジェクト固有/専用のアセットがここに配置されます。
- Packages/
このプロジェクトにインストールされたパッケージがここに配置されます。パッケージには任意のアセットタイプを含めることができ、複数のUnityプロジェクトに追加できます。したがって、コードやアセットを共有するための優れた方法です。パッケージの詳細については、パッケージに関するUnityドキュメントを参照してください。
- Packages/Needle Engine/
Unity用Needle Engineは、UnityシーンをWebプロジェクトにエクスポートするために必要なすべてのファイルを含むパッケージです。また、インタラクティブなWebプロジェクトを作成するための組み込みコンポーネントとツールも含まれています。Unity Package Manager経由でパッケージを更新できます。
- Packages/Needle Engine/Core/
- Packages/Needle Engine/Core/Runtime/
- Packages/Needle Engine/Core/Runtime/Components/
すべてのNeedle Engine組み込みコンポーネントが含まれています。コンポーネントリファレンスで詳細を学べます。サンプルを見てこのフォルダを確認することは、利用可能なコンポーネントとそのプロジェクトでの使用方法を知るのに最適な方法です。
File Tree: Unity Project
Unityで新しいWebプロジェクトを作成する際、ローカルテンプレートから作成するかを選択できます(デフォルトでは、ViteベースのWebテンプレートを出荷しています)。
ExportInfoプロジェクトパスにリポジトリURLを入力して、リモートテンプレートを参照することもできます(これはシーンと一緒に保存できます)。新しいWebプロジェクトを作成する際、リポジトリはクローンされるかダウンロードされ(gitがインストールされているかどうかによります)、needle.config.json
ファイルが検索されます。クローンされたリポジトリに見つからない場合は、ルートディレクトリが使用されます。github.com/needle-engineでリモートテンプレートプロジェクトの例を見つけることができます。
一時プロジェクト
NpmDefs経由でのみカスタムファイルを追加し、プロジェクト設定を変更しない場合(例:迅速なフルスクリーンテストの場合)、プロジェクトパスの前にLibrary
を付けることができます。プロジェクトはUnityプロジェクトのLibraryフォルダに生成され、ソース管理に追加する必要はありません(Libraryフォルダはソース管理から除外する必要があります)。私たちはこれらのプロジェクトを_一時プロジェクト_と呼んでいます。アイデアを迅速にテストするのに最適です!
UnityでのTypescript
NPM Definitionsはnpm packagesであり、Unityエディターに密接に統合されており、複数のWebまたはUnityプロジェクトとスクリプトを簡単に共有できます。
NpmDefパッケージ内のスクリプトの場合、TypeScriptファイルに対するC#コンポーネントスタブも自動的に生成されます。
NpmDefの作成とインストール
NPM Definitionを作成するには、Unity Projectブラウザーで右クリックし、「Create/NPM Definition
」を選択します。
NPM Definitionパッケージをランタイムプロジェクトにインストールするには、例えばNeedle Engine
コンポーネント(旧称Export Info
)を選択し、dependencies
リストに追加します(これは実質的に、NpmDefパッケージをWebプロジェクトのpackage.jsonのdependencies
配列に追加するもので、手動で行うか、npm i <path/to/package>
を実行するのと同じです)。
ExportInfoコンポーネントでInstallをクリックするなどして、新しく追加したパッケージをインストールすることを忘れないでください。また、サーバーが既に実行されている場合は再起動してください。
NPM Definitionパッケージ内のコードを編集するには、プロジェクトブラウザーでNPM Definitionアセットをダブルクリックするだけで、各npmdefに付属するvscodeワークスペースが開きます。
次のステップ
- コンセプト: Webプロジェクト
- コンセプト: アセットのエクスポート
- コンセプト: デプロイメント(Webサイトの共有)
- コンポーネント: Everywhere Actionsについて学ぶ
- 初心者向けスクリプト: Typescriptの基本
- 初心者向けスクリプト: カスタムコンポーネントの書き方
このページはAIによって自動的に翻訳されました