ガイド

ビリヤードゲームのソースコード:HTML5の8ボール・パッケージの中身

物理、ルール、CPU、セーブを別々のファイルに。Velvet Pool のソースに何が入っていて、購入者がまず何を変えるのかを解説します。

Velvet Pool のアートワーク:緑のテーブルで手球の後ろに構えたキュー、コーナーポケット近くに3番・8番・4番のボール。

ビリヤードゲームのソースコードを買う価値があるかどうかは、3つの要素が読みやすい別々のファイルに分かれているかで決まります。ボールの物理、8ボールのルール、そしてコンピューター対戦相手です。これらが絡み合っていると、ラシャの色や CPU の難易度を変えるたびにデバッグ作業になります。当スタジオの8ボールテンプレート Velvet Pool はこれらを分けており、このガイドではそのパッケージをファイルごとに見ていきます。

コードの構成、購入者が最初に変えることの多い部分、ホスティングやアプリ化の方法、ライセンスで認められていること、このエディションに含まれないものを取り上げます。以下のファイル名はすべて、ゲームに同梱の購入者ガイドから取ったものです。

要点だけ言うと、Velvet Pool は WebGL2 上で動く素の JavaScript で、3D ライブラリもビルド工程もありません。ファイルを編集し、ゲームフォルダにコピーして、ページを再読み込みするだけです。

このビリヤードゲームのソースコードに含まれるもの

Velvet Pool は完成した8ボールゲームで、エンジンやスターターキットではありません。ダウンロードには4つのフォルダがあります。game/ はそのままアップロードできるビルド、source/ は README、package.json、テスト付きの開発者向けエディション(中身は同じゲーム)、documentation/ は英語とポルトガル語の図解ガイド、THIRD-PARTY-LICENSES/ はフォントのライセンス文書です。

ゲーム自体は、ファウル、ボールインハンド、ソリッドかストライプかを含む8ボールです。CPU は3段階(Easy、Medium、Hard)で、取り消し、ボール配置、再ラックができるフリー練習台と、1台での2人対戦もあります。手球にはフォロー、ドロー、サイドのスピンをかけられ、ローカル実績でラシャの色5種とキューのスタイル5種が解放されます。UI は14言語に対応しています。

  • 技術構成:素の JavaScript、ES モジュール、WebGL2。Three.js などのコードライブラリは使っていません。
  • コード:source/src と game/src にある、整形された素の JavaScript。ミニファイもバンドルもされていません。
  • テスト:任意。Node.js 20 以降で、物理、8ボールのルール、CPU 戦、翻訳キーを確認します。
  • 執筆時点のバージョン:1.1.0、2026年10月22日更新。

Velvet Pool の商品ページ・デモ・マニュアルを見る

ファイルの構成

game/ と source/ は同じ構成なので、一方のフォルダのパスはもう一方でも同じファイルを指します。ビリヤードゲームで最も重要なのは、src/core/(シミュレーションとルール)と src/game/(プレイヤーが触れるすべて)の分け方です。

  • src/core/physics.js:ボールのシミュレーション、スピン、クッションの反発。
  • src/core/rules.js:8ボールのルールとファウル判定。
  • src/core/ai.js:CPU がショットを選ぶ仕組み。
  • src/game/controls.js:狙い、パワー、スピンの入力。
  • src/game/progress.js:実績、ラシャ、キュー、試合のスコア。
  • src/game/i18n.js:14言語のテキスト。言語は LANGS に一覧があります。
  • src/game/localRecords.js:ローカルのスコア履歴。
  • src/game/audio.js:効果音と音楽の再生。
  • css/style.css と css/fonts.css:テーマ、レスポンシブレイアウト、フォント宣言。
  • assets/:アート、オーディオ、フォント。ロゴファイルは assets/logo/ にあります。

物理、ルール、CPU が別モジュールなので、ボールの動きに触れずに CPU を手加減させたり、クッションを調整し直さずにファウルのルールを変えたりできます。どんなビリヤードのコードを買う場合でも、この分離こそ最初に確認すべき点です。

購入者が最初に変えるところ

ほとんどのプロジェクトは同じ順番で進みます。まずプレイヤーの目に入るもの、次に手触り、そしてルールは最後です。ルールは最もバグを入れやすい場所だからです。

  1. ブランディング:assets/logo/ のロゴファイルを差し替え、CSS で対応するサイズを調整します。ホワイトラベルが認められているので、当スタジオの名前を御社やクライアントの名前に置き換えられます。
  2. テーブルの見た目:色とフォントは css/style.css にあります。ラシャとキューの定義は progress.js にあります。ID は変えないでください。変えるとプレイヤーが解放済みの見た目を失います。
  3. テキストと言語:すべての文字列は i18n.js にあります。必要な文言を編集してください。言語の一覧は LANGS にあります。
  4. CPU の難易度:ショットの選択は ai.js にあります。1段階ずつ調整し、そのたびに1試合通して対戦してみてください。
  5. 物理:摩擦、スピン、クッションの反発は physics.js にあります。ここは小さな変更でも大きく効くので、変更のたびにテストを実行してください。
  6. ルール:ハウスルールのバリエーションは rules.js に入れます。ファウルとボールインハンドは、テストスイートに加えて手でも確かめてください。

どの変更も流れは同じです。source/ でファイルを編集し、game/ の同じパスにコピーし、フォルダを HTTP で配信して再読み込みします。購入者ガイドでは、機能を1つずつ変え、そのたびにメニュー、1試合、一時停止、結果画面、再読み込みをテストすることを勧めています。

ホスティング、埋め込み、アプリ化

ホスティングはいちばん簡単な部分です。game/ の中身をすべて public_html/velvet-pool/ のようなフォルダにアップロードし、サブフォルダの構成を保ったままアドレスを開きます。サーバー側に npm、ターミナル、PHP、データベース、アカウントは不要です。HTTPS で静的ファイルを配信できるプランで十分です。

  • index.html をダブルクリックで開かないでください。file:// ではブラウザがゲームのモジュールをブロックします。ローカルでテストするなら、game/ の中で python -m http.server 8765 を実行します。
  • 画面が真っ白のままなら、WebGL2 が有効か、ファイル名の大文字・小文字が保たれているかを確認してください。
  • ブラウザがモジュールを拒否する場合、サーバーが .js を誤った MIME タイプで送っています。
  • ポータルの iframe 内に置く場合は、fullscreen と autoplay を許可してください。

実行時に必要なものはすべて game/ の中にあり、CDN や他サイトから読み込むものはありません。ただしページを新たに読み込むときはホストにアクセスするので、インストール型のオフラインアプリではありません。タッチスクリーンでも動き、プレイヤーはテーブル上で狙ってパワーコントロールを引きます。

ネイティブアプリのプロジェクトはパッケージに含まれません。Google Play や App Store で配信したい場合、よく使われるのは Capacitor のようなラッパーです。開発元は、Web のコードでモバイルアプリを作るためのクロスプラットフォームのネイティブランタイムと説明しています。ストア向けプロジェクトの構築と保守は御社の作業となるか、当スタジオが別途お見積もりするサービスになります。

このエディションに含まれないもの

Velvet Pool はローカルのブラウザ版です。オンライン対戦やプライベートルーム、オンラインランキング、クラウドアカウント、広告 SDK はありません。1台で2人対戦ができ、対象となる CPU 戦の個人スコアはブラウザに保存されます。練習と同じ端末での対戦ではスコアは保存されません。

オンライン対戦には、御社独自のサーバーと開発が必要です。これは本格的なプロジェクトなので、テンプレートがいずれそうなることを期待するのではなく、最初から予算に入れてください。カタログにスポーツゲームを増やしたい場合は、次の2本もすぐにホスティングできるブラウザ版として販売しています。

Puttide:30ホールの3Dミニゴルフ。こちらも素の JavaScript

Golazo:50の代表チームが登場するテーブルサッカー

ライセンスと価格をひとまとめに

Velvet Pool の定価は39ドルです。2026年11月30日まで、ブラックフライデーのプロモーションで全テンプレートが15%オフになり、33.15ドルで購入できます。さらに2本以上の注文では5〜20%の追加割引があります。購入ごとに、1つの最終製品(ご自身のもの、またはクライアント1社のもの)に対する永続的・非独占的なライセンスが付与されます。その製品内でコード、アート、オーディオを変更し、独自のブランドを付けられます。プレイヤーには無料で、または広告付きで提供できます。テンプレートやそのコードを単体で再販することはできません。6か月のサポートが含まれ、購入時に延長すれば12か月になります。カスタム作業、ホスティング、SDK やポータルとの連携は別途お見積もりです。

ライセンスとサポートの規約全文を読む

よくある質問

このビリヤードゲームのソースコードは読めますか?ミニファイされていますか?

読めます。source/src と game/src の JavaScript は整形された素のコードで、ミニファイやバンドルされたファイルはありません。

Node.js やビルド工程は必要ですか?

いいえ。source/ のファイルを編集して game/ にコピーするだけです。Node.js 20 以降が必要なのは、任意のテストを実行したい場合だけです。

CPU を弱くしたり強くしたりできますか?

できます。CPU のショット選択は物理とは別の src/core/ai.js にあるので、ボールの動きを変えずに調整できます。

スマホで動きますか?

はい。タッチ入力に対応し、操作は画面に合わせて調整されます。WebGL2 が必須で、パフォーマンスは端末によって異なるため、プレイヤーが使うスマホでテストしてください。

ゲームを新しいドメインに移しても、プレイヤーの進行状況は残りますか?

残りません。セーブはブラウザのオリジンに紐づくため、ドメインを変えるとプレイヤーは最初からになります。公開前に最終的なアドレスを決めてください。

オンライン対戦を追加できますか?

このエディションだけではできません。独自のサーバーと開発が必要です。カスタム作業としてお見積もりできます。

このビリヤードのコードが合う人

カタログに8ボールゲームを加えたいポータルやサイト、クライアント1社にブランド入りのビリヤードゲームを納品する代理店、そして3D ライブラリに邪魔されずにビリヤードの物理とルールの書き方を読みたい開発者に向いています。オンライン対戦や共有リーダーボードが前提の計画にはあまり向きません。

購入前にスマホとノートPCの両方でデモを遊び、マニュアルのファイルマップを開いてみてください。物理、ルール、CPU の分け方が御社の作業の進め方に合っていれば、残りは午後を何回か使えば済む変更作業です。

Velvet Pool のデモを試してライセンスを購入する

変更や複数ライセンスが必要ですか?見積もりを依頼する