achrefelouafi/LinearAbiltyCastingThreeJS

これは何？

主な機能

• 01ラインキャストと遠距離キャストの照準方式に対応した6種類のアビリティ。
• 02スプライトテクスチャを使わない、プロシージャルジオメトリと符号付き距離関数シェーダー。
• 03シミュレーションを一時停止しても操作できる938個のライブパラメータースライダー。
• 04組み込みエディターからのプリセット保存、JSONのエクスポート、インポート。
• 05プーリングとリングバッファによるスロット再利用に対応したGPUパーティクルシステム。
• 06深度プリパス、ブルーム、ACESトーンマッピング、カラーグレーディングを備えたレンダーパイプライン。

ユースケース

• Three.jsで、ゲーム向けのスキルショットやAoEアビリティのエフェクトをプロトタイピングする。
• SDF矢印、ライトニングリボン、ボリュームビームなどのGLSL技法を学ぶ。
• 値をコードに反映する前に、パーティクルやライティングの見た目をインタラクティブに調整する。
• 単一の共有設定オブジェクトを中心にリアルタイムVFXプロジェクトを構成する方法を学ぶ。

クイックスタート

1. 1

   依存関係をインストールする

   npm install
2. 2

   開発サーバーを起動する

   npm run dev
3. 3

   Viteが表示するURLを開く（デフォルトは http://127.0.0.1:5173）

トピック

よくある質問

LinearAbiltyCastingThreeJS とは？

シミュレーションを一時停止してもスライダーを操作できる、ゲーム風スキルショットのVFX調整用Three.js・GLSLサンドボックス。 Elemental Sandboxは、Three.js、Vite、手書きのGLSLで構築されたブラウザベースのVFXサンドボックスです。League of Legends風のアビリティを6種類収録しています。地面の矢印で狙うラインキャストが4種類、ターゲティングサークルで狙う遠距離キャストが2種類です。各アビリティはプロシージャルジオメトリ、符号付き距離関数シェーダー、GPUパーティクルで構成されており、キャラクターモデルとカラーマップを除いてテクスチャやスプライトシートを使いません。

LinearAbiltyCastingThreeJS は無料で使えますか？ライセンスは？

LinearAbiltyCastingThreeJS は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

LinearAbiltyCastingThreeJS は今もメンテナンスされていますか？

活発にメンテナンス中。LinearAbiltyCastingThreeJS の最終コミットは 2026年9月23日 です。

LinearAbiltyCastingThreeJS は何に使えますか？

Three.jsで、ゲーム向けのスキルショットやAoEアビリティのエフェクトをプロトタイピングする。 SDF矢印、ライトニングリボン、ボリュームビームなどのGLSL技法を学ぶ。 値をコードに反映する前に、パーティクルやライティングの見た目をインタラクティブに調整する。 単一の共有設定オブジェクトを中心にリアルタイムVFXプロジェクトを構成する方法を学ぶ。

LinearAbiltyCastingThreeJS のインストール方法は？

依存関係をインストールする: npm install 開発サーバーを起動する: npm run dev Viteが表示するURLを開く（デフォルトは http://127.0.0.1:5173）

LinearAbiltyCastingThreeJS はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/achrefelouafi/LinearAbiltyCastingThreeJS