色分けパズルのゲーム ソースコード：最初に変えること
Mochi Monsters を例に、ルール、ファイル構成、ひとつだけの設定ファイル、再ビルドが必要な変更を見ていきます。
移動ルール、レベル生成、セーブ機能を自分で書かずに、ウォーターソート風のゲームを自社サイトに置きたいなら、色分けパズルのゲーム ソースコードを買うのは理にかなっています。Mochi Monsters はまさにそういうパッケージです。3つのワールドに全60レベル、Endless（エンドレス）モード、読みやすい TypeScript、そのままホスティングできるゲームフォルダが付いて、定価 39 ドルです。
ウォーターソート、ボールソート、そして Mochi Monsters のルールは共通です。動かせるのは空の容器か、いちばん上が同じものの上だけ。テンプレートの差が出るのは、そのルールの周りにあるすべてです。このガイドでは購入者が触れる順番にパッケージを見ていき、最後に5分でできる変更と、開発者が必要な変更を整理します。
仕分けのルールと、その上に重なる2つのひねり
プレイヤーは巣をひとつタップし、続けて別の巣をタップします。いちばん上にいるゼリーの仲間たちのグループは、移動先の巣が空か、いちばん上の仲間が同じ種類のときだけ飛び移ります。すべての巣が1種類ずつになれば、その盤面はクリアです。Hint（ヒント）、Undo（取り消し）、Restart（リスタート）を標準搭載しています。
60のレベルが同じことの繰り返しに感じられないよう、2つの仕掛けがあります。貝殻のフタは巣をふさぎ、フタに描かれた種類でその巣を満たすと開きます。Undo でまた閉じることもあります。つながった潮の巣は、片方が空になると場所を入れ替えるので、プレイヤーが立てた計画の足元で盤面が変わります。
購入者にとって大事なのは、これらがすでに実装され、テスト済みだという点です。普通の仕分けゲームにこうしたひねりを加える作業は、たいてい想定より時間がかかります。手間の大半は Undo まわりのエッジケースです。
色分けパズルのゲーム ソースコードに含まれるもの
- Sugar Meadow、Bubble Beach、Mushroom Village の3ワールドに各20、計60のキャンペーンレベル。
- レベル20クリア後に開放される、シード方式の Endless モード。
- コレクションアルバム、触って遊べる庭、プレイで貯めた Sugar Drops で買える6種類の帽子。
- タッチとマウスの操作、ローカル保存、動きを減らすオプション。
- そのままホスティングできる game/ フォルダ、読みやすい JavaScript と TypeScript のソース、設定、テスト、ライセンス表記。
- 14言語に対応したオフラインの図解ガイド（スクリーンショットは英語）。
インターフェースは14言語に対応しています：英語、ポルトガル語、スペイン語、フランス語、ドイツ語、イタリア語、オランダ語、ポーランド語、トルコ語、ロシア語、インドネシア語、日本語、韓国語、簡体字中国語。ガイドは読む人の言語に自動で切り替わります。
技術スタックは Canvas 2D 上の TypeScript と JavaScript で、音声には Web Audio を使っています。ファイルは HTML、CSS、JavaScript、JSON、TypeScript、WebP、PNG、MP3 です。
プロジェクトの構成
パッケージは3つの層に分けて考えると分かりやすく、それぞれ必要な手間が違います。
第1層：ホスティングするゲーム
game/ フォルダは完成品です。中身を静的 HTTP(S) ホスティングにアップロードすれば遊べます。ここではビルドは一切不要です。
第2層：設定ファイル
mochi.config.js は index.html と同じ場所にあり、ブラウザのタイトル、ロゴ、初期言語、セーブキーを設定します。値を変えてファイルをアップロードし、ページを再読み込みするだけ。ここでもビルドは要りません。
第3層：TypeScript のソース
ルール、アート、レベル、帽子の価格はソースにあります。変更するには TypeScript を編集して npm で再ビルドする必要があり、Node.js 22.13 以降が必要です。ソースにはレベルのベイクツールと、ルール、レベル、保存、翻訳をカバーする52件の自動テストが含まれています。
色分けのゲームテンプレートで最初に変えること
ビルド不要な変更から開発作業まで、おすすめの順番は次のとおりです。
- mochi.config.js でタイトルとロゴを変え、ブラウザのタブとスタート画面を自社ブランドにする。
- プレイヤーの多くが英語話者でなければ、同じファイルで初期言語を変える。
- セーブキー：公開前に一度だけ設定し、その後は触らない。公開中のサイトで変えると、プレイヤーの進行状況が消えてしまう。
- 全面的なリスキンが必要なら、ゼリーの仲間たちのアートと色を変える。これはソースでの作業。
- 帽子の価格と報酬バランス。これもソースで変更する。
- レベルのベイクツールで新しいレベルを作り、テストを実行する。
多くのサイトでは、最初の3ステップで作業は終わりです。一方、全面的なリスキンは3つのワールドのキャラクター、巣、背景をすべて差し替えることになり、時間の大半はそこにかかります。クライアントに納期を約束する前に、正直に見積もってください。
ホワイトラベルも可能です。ゲーム内のどこでも、こちらの名前とロゴをあなたやクライアントのものに置き換えられます。
ホスティング、埋め込み、その先の展開
game/ の中身を任意の静的 HTTP(S) ホストにアップロードします。サブフォルダでもかまいません。遊ぶのにデータベース、PHP、Node.js のサービスは不要です。file:// でディスクから直接開いても動かないので、ローカルまたは本番の Web サーバーでテストしてください。
パソコン、タブレット、スマートフォンの最新版 Chrome、Edge、Firefox、Safari で動作します。進行状況はブラウザのローカルストレージに保存され、端末間の同期はありません。インストールできるオフラインアプリではなく、プレイヤーはあなたの Web アドレスから読み込みます。
パッケージにネイティブアプリのプロジェクトは含まれていません。アプリストアへの公開、ゲームポータルの SDK との連携、あなたのサーバーへの導入をご希望なら、案件ごとにお見積もりします。
Mochi Monsters に含まれないもの
このエディションには、オンラインアカウント、クラウドセーブ、グローバルランキング、実際のお金を使う課金、広告 SDK はありません。ネイティブアプリのプロジェクト、ホスティング、カスタム開発も含まれません。3つのワールド以外に遊べるキャンペーンはなく、その後は Endless モードがゲームを続けさせる役割を担います。
広告を表示する予定なら、ライセンス上は最終製品の広告収益化が認められています。ただし広告ネットワークとの接続は、ご自身で行うか、こちらで見積もりのうえ請け負う作業になります。
ライセンスと価格をひとまとめに
1回の購入で、このエディションを1つの最終製品（あなた自身のもの、または1社のクライアントのもの）に使える、永続的かつ非独占的なライセンスが得られます。プレイヤーには無料で、または広告収益化を通じて提供できます。その製品の中ではコード、アート、音声を変更できますが、テンプレート、ソース、アセットを単体で再販・共有することはできません。キットとして配布することも、開発者向けの別製品に組み込むことも同様です。サポート期間は6か月で、購入時に延長を付ければ12か月になります。対象はファイルの導入と使い方、再現できる不具合の修正で、サポートが終わってもライセンスは失効しません。定価は 39 ドルですが、2026年11月30日まではブラックフライデーのプロモーションで全テンプレートが15%オフとなり、Mochi Monsters は 33.15 ドルです。12月1日からは定価に戻ります。
よくある質問
Mochi Monsters はウォーターソートのゲームですか？
中心となるルールは同じです。グループが移動できるのは、空の巣か同じ仲間の上だけです。試験管の液体の代わりにゼリーの生き物を巣に仕分け、さらに貝殻のフタと潮の巣が加わっています。
アップロード前にゲームをビルドする必要はありますか？
ありません。game/ の中身を HTTP(S) ホスティングにアップロードしてください。ソースでの開発は任意です。
再ビルドせずに変えられるのは何ですか？
ブラウザのタイトル、ロゴ、初期言語、セーブキーで、すべて mochi.config.js にあります。ルール、アート、レベル、帽子の価格には TypeScript のソースと npm での再ビルドが必要です。
ワールドやレベルを追加できますか？
このエディションは3つのワールドに全60レベルです。追加するには、付属のレベルのベイクツールを使ってソースを編集します。追加のキャンペーンはパッケージに含まれません。
プレイヤーの進行状況はどこに保存されますか？
使っているブラウザのローカルストレージです。クラウド同期は含まれません。
スマートフォンで動きますか？
動きます。最新のモバイルブラウザではタッチ操作で、デスクトップではマウスで遊べます。
色分けパズルが向いている相手と、ほかの選択肢
色分けパズルは、カジュアルゲームのポータル、ファミリー向けサイト、短いプレイ時間で落ち着いて遊べるゲームを求めるブランドに向いています。スマートフォンでも見やすく、ルールは一文で説明できます。
もっと先読みが必要なパズルがよければ、Beep Out は乗客との色合わせがある全30レベルの3D駐車パズルで、定価 35 ドルです。ユーザーが数字好きなら、Tenguin は同じ数字どうし、または足して10になる2つの数字をペアにする数字マッチパズルで、定価 39 ドルです。