Needle Engine ドキュメント
Downloads
  • What is Needle Engine?
  • お客様の声
  • Get an overview

    • Samples and Showcase
    • 私たちのビジョン 🔮
    • 機能概要
    • 技術概要
  • Resources

    • Pricing and Plans
    • Changelog
    • API Documentation
    • Support & Community
  • Integrations

    • Unity用Needle Engine
    • Blender 用 Needle Engine
    • Web ComponentとしてのNeedle Engine
    • ウェブサイトでのNeedle Engine
    • Needle Cloud
  • Core Concepts

    • Needle Engineプロジェクトの構造
    • Everywhere Actions
    • glTFへのアセットのエクスポート
    • フレームワーク、バンドラー、HTML
    • ローカルデバイスでのテスト
    • デプロイと最適化
  • Advanced

    • VR & AR (WebXR)
    • Image Tracking (WebXR)
    • ネットワーキング
    • MaterialX
    • Editor Sync
  • Troubleshooting

    • デバッグの方法
    • よくある質問(FAQ)💡
    • Support and Community
  • Videos

    • Tutorials on Youtube
    • Interviews on Youtube
  • Scripting Overview

    • Needle Engineでのスクリプティング
    • Unity開発者向けスクリプト入門
    • Needleコアコンポーネント
    • Everywhere Actions
  • Components and Lifecycle

    • コンポーネントの作成と使用
    • @serializable およびその他のデコレーター
    • 自動コンポーネント生成
    • Scripting Examples
    • Community Contributions
    • 追加モジュール
  • Settings and APIs

    • <needle-engine> 設定
    • /lang/ja/reference/needle-config-json.html
    • Needle Engine API
    • three.js API
Help
Samples
Pricing
  • Needle Website
  • Needle Cloud
  • Support Community
  • Discord Server
  • X/Twitter
  • YouTube
  • Newsletter
  • Email
  • Feedback
  • Github
  • English
  • 简体中文
  • Español
  • Português
  • Français
  • हिन्दी
  • 日本語
  • Deutsch
  • Tiếng Việt
Downloads
  • What is Needle Engine?
  • お客様の声
  • Get an overview

    • Samples and Showcase
    • 私たちのビジョン 🔮
    • 機能概要
    • 技術概要
  • Resources

    • Pricing and Plans
    • Changelog
    • API Documentation
    • Support & Community
  • Integrations

    • Unity用Needle Engine
    • Blender 用 Needle Engine
    • Web ComponentとしてのNeedle Engine
    • ウェブサイトでのNeedle Engine
    • Needle Cloud
  • Core Concepts

    • Needle Engineプロジェクトの構造
    • Everywhere Actions
    • glTFへのアセットのエクスポート
    • フレームワーク、バンドラー、HTML
    • ローカルデバイスでのテスト
    • デプロイと最適化
  • Advanced

    • VR & AR (WebXR)
    • Image Tracking (WebXR)
    • ネットワーキング
    • MaterialX
    • Editor Sync
  • Troubleshooting

    • デバッグの方法
    • よくある質問(FAQ)💡
    • Support and Community
  • Videos

    • Tutorials on Youtube
    • Interviews on Youtube
  • Scripting Overview

    • Needle Engineでのスクリプティング
    • Unity開発者向けスクリプト入門
    • Needleコアコンポーネント
    • Everywhere Actions
  • Components and Lifecycle

    • コンポーネントの作成と使用
    • @serializable およびその他のデコレーター
    • 自動コンポーネント生成
    • Scripting Examples
    • Community Contributions
    • 追加モジュール
  • Settings and APIs

    • <needle-engine> 設定
    • /lang/ja/reference/needle-config-json.html
    • Needle Engine API
    • three.js API
Help
Samples
Pricing
  • Needle Website
  • Needle Cloud
  • Support Community
  • Discord Server
  • X/Twitter
  • YouTube
  • Newsletter
  • Email
  • Feedback
  • Github
  • English
  • 简体中文
  • Español
  • Português
  • Français
  • हिन्दी
  • 日本語
  • Deutsch
  • Tiếng Việt
  • Getting Started

    • Downloads
    • Needle Engine for Unity
    • Needle Engine for Blender
    • Needle Engine no Editor
    • Needle Engine on your Website
    • Needle Cloud
    • Custom integrations
    • Support and Community
  • Core Concepts

    • Needle Engineプロジェクトの構造
    • Everywhere Actions
    • glTFへのアセットのエクスポート
    • フレームワーク、バンドラー、HTML
    • ローカルデバイスでのテスト
    • デプロイと最適化
  • Scripting

    • Needle Engineでのスクリプティング
    • コンポーネントの作成と使用
    • Unity開発者向けスクリプト入門
    • 自動コンポーネント生成
    • Scripting Examples
    • Community Contributions
  • Advanced

    • VR & AR (WebXR)
    • Image Tracking (WebXR)
    • ネットワーキング
    • MaterialX
    • Editor Sync
  • Troubleshooting

    • デバッグの方法
    • よくある質問(FAQ)💡
    • Support and Community
  • Reference

    • 機能概要
    • 技術概要
    • Needleコアコンポーネント
    • /lang/ja/reference/needle-config-json.html
    • <needle-engine> 設定
    • @serializable およびその他のデコレーター

Needle Logo +

Unity用Needle Engine

Unity用Needle Engineを使用すると、Unity内で直接、非常にインタラクティブで柔軟性があり軽量なWebアプリケーションを作成できます。Unityエディターの強力なツールを使用して、3Dシーンの視覚的な設定、アニメーション、デザインを行います。Unity用Needle Engineは、シーンをglTFにエクスポートすることを担当し、あらゆるWebフロントエンドフレームワークと簡単に統合できます。

Unityパッケージのインストール


  1. ダウンロードした.unitypackageファイルをUnityプロジェクトにドロップし、インポートすることを確認します。

  2. インストールとインポートが完了するまでしばらく待ちます。「A new scoped registry is now available in the Package Manager.」というウィンドウが表示される場合があります。これはNeedle Packageレジストリです。このウィンドウは安全に閉じることができます。

  3. サンプルを探索。
    メニューオプションNeedle Engine > Explore Samplesを選択して、利用可能なすべてのサンプルシーンを表示、開く、変更します。

クイックスタートビデオチュートリアル

サンプルから開始

幅広いトピック、ユースケース、業界をカバーする100以上のサンプルがあります。
概要については、サンプルページをご覧ください。

これらのサンプルはすべてUnityで直接利用できます。

  1. サンプルをブラウズするには、Needle Engine > Explore Samplesに進みます
  2. 「Install Samples」をクリックして、エディター内にサンプルパッケージをインストールします(または、パッケージを手動でインストールするには、サンプルのunitypackageをダウンロードします)
  3. 任意のサンプルを選択し、Open Sceneをクリックします。

サンプルは読み取り専用です – これにより簡単に更新できます。

私たちのサンプルシーンは、UnityのUPMパッケージの一部です。これは、それらのアセットやスクリプトを直接編集できないことを意味します – それらは読み取り専用です。サンプルパッケージからアセットを編集するには、プロジェクトのAssetsフォルダーにコピーします。サンプルパッケージからスクリプトを編集するには、Webプロジェクトのsrcフォルダーにコピーします。

テンプレートから開始

新規プロジェクトを迅速に開始するためのシーンテンプレートを多数提供しています。
これにより、アイデアからプロトタイプまで数クリックで進むことができます。

  1. File > New Sceneをクリックします

  2. 名前に(needle)が含まれるテンプレートのいずれかを選択し、Createをクリックします。Collaborative Sandboxテンプレートをお勧めします。これは、インタラクティビティ、マルチプレイヤー、アセットの追加を始めるのに最適な方法です。

  3. Playをクリックして、新しいWebプロジェクトをインストールして起動します。

20220822-140539-wqvW-Unity_oC0z-needle

ゼロから開始

シーンテンプレートから開始したくない場合は、以下の手順に従うことができます。
実際には、パッケージに含まれている「Minimal (Needle)」テンプレートを再作成します。

  1. 新しい空のシーンを作成

  2. エクスポート用にシーンを設定
    空のGameObjectを追加し、名前を「Exporter」にして、Needle Engineコンポーネント(旧称Export Info)を追加します。
    このコンポーネントでは、エクスポートされたランタイムプロジェクトを作成し、迅速にアクセスできます。
    また、いずれかのパッケージやモジュールが古いか、Webプロジェクトにローカルにインストールされていない場合に警告が表示されます。

    プロジェクト名とシーン名

    デフォルトでは、プロジェクト名はシーンの名前に一致します。それを変更したい場合は、新しいWebプロジェクトを作成したいDirectory Nameを選択または入力できます。パスはUnityプロジェクトからの相対パスです。

  3. Webプロジェクトテンプレートを選択 次に、プロジェクトのWebプロジェクトテンプレートを選択します。デフォルトのテンプレートは、高速なWebアプリバンドラーであるViteに基づいています。

    Unity ExportInfo local templates

  4. Playをクリックして、新しいWebプロジェクトをインストールして開始します

独自のテンプレートを定義

似たようなプロジェクトを多数作成する場合は、Project ViewのコンテキストメニューにあるCreate/Needle Engine/Project Templateを使用して、独自のローカルまたはリモートテンプレートを作成できます。テンプレートは、ディスク上のローカル(コピーされるフォルダ)またはリモートリポジトリ(クローンされるgitリポジトリ)のいずれかにすることができます。

プロジェクトフォルダとファイル

File Tree: Unity Project

Unity ProjectDescription
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組み込みコンポーネントが含まれています。コンポーネントリファレンスで詳細を学べます。サンプルを見てこのフォルダを確認することは、利用可能なコンポーネントとそのプロジェクトでの使用方法を知るのに最適な方法です。

Unityで新しいWebプロジェクトを作成する際、ローカルテンプレートから作成するかを選択できます(デフォルトでは、ViteベースのWebテンプレートを出荷しています)。

ExportInfoプロジェクトパスにリポジトリURLを入力して、リモートテンプレートを参照することもできます(これはシーンと一緒に保存できます)。新しいWebプロジェクトを作成する際、リポジトリはクローンされるかダウンロードされ(gitがインストールされているかどうかによります)、needle.config.jsonファイルが検索されます。クローンされたリポジトリに見つからない場合は、ルートディレクトリが使用されます。github.com/needle-engineでリモートテンプレートプロジェクトの例を見つけることができます。

Unity ExportInfo local templates

一時プロジェクト

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>を実行するのと同じです)。

image

ExportInfoコンポーネントでInstallをクリックするなどして、新しく追加したパッケージをインストールすることを忘れないでください。また、サーバーが既に実行されている場合は再起動してください。

NPM Definitionパッケージ内のコードを編集するには、プロジェクトブラウザーでNPM Definitionアセットをダブルクリックするだけで、各npmdefに付属するvscodeワークスペースが開きます。

次のステップ

  • コンセプト: Webプロジェクト
  • コンセプト: アセットのエクスポート
  • コンセプト: デプロイメント(Webサイトの共有)
  • コンポーネント: Everywhere Actionsについて学ぶ
  • 初心者向けスクリプト: Typescriptの基本
  • 初心者向けスクリプト: カスタムコンポーネントの書き方

このページはAIによって自動的に翻訳されました

Suggest changes
最終更新: 2025/08/15 8:05
Prev
Downloads
Next
Needle Engine for Blender