リクエスト詳細
✨ 既存アプリの改善
対応完了
対象アプリ: RPGストーリーフォージ AI風ドット絵冒険
サブマップ(村・洞窟・神殿)内部の16pxドット絵タイルをCanvas上でリッチ再描画し、建物内装・洞窟岩壁・神殿柱を表現
## 1. 目的
ワールドマップの高解像度タイル描画は既に強化済みだが、サブマップ(village / cave / sanctuary / fort 等)の内部タイルはまだ簡易描画にとどまっている。村の家屋内装・洞窟の岩壁テクスチャ・神殿の石柱・古城の床など、サブマップ専用の16pxドット絵タイルセットをCanvas上でリッチ再描画することで、フィールド→町→ダンジョンのビジュアル差別化を完成させる。
## 2. 具体的な仕様
### 2-1. タイル種別ごとの描画関数追加(JS側)
既存の `renderWorldTile(ctx, tileCode, px, py, tileSize)` に相当するサブマップ専用関数 `renderSubmapTile(ctx, tileCode, px, py, tileSize, submapType)` を追加する。
- `submapType` は `'town'` / `'dungeon'` / `'temple'` の3種。
- `tileCode` は既存の `C`(城床)/ `G`(草/石床)/ `R`(遺跡床)/ `T`(野営地/祭壇)/ `E`(出口)/ `M`(壁)/ `W`(水)を流用。
### 2-2. town(村・神殿)用タイル描画
| tileCode | 描画内容 |
|---|---|
| C | 木目床:薄茶ベースに暗い縦縞2本 |
| G | 石畳:グレー市松模様(2×2px単位) |
| M | 木造壁:濃茶ベースに明るい横ライン1本 |
| T | 祭壇/暖炉:赤橙の炎ドット2フレームアニメ |
| E | 出口扉:青みがかった木枠+アーチ |
| W | 水盤:青系2色の波アニメ |
### 2-3. dungeon(洞窟・古城)用タイル描画
| tileCode | 描画内容 |
|---|---|
| R | 遺跡床:濃グレー+亀裂ライン |
| G | 洞窟床:暗茶色+砂利ノイズ点描 |
| M | 岩壁:黒+暗グレーの凹凸ブロック |
| C | 城床:石レンガ模様(4×4pxグリッド) |
| T | 松明台:橙炎2フレームアニメ |
| W | 地下水:黒青系2色の波アニメ |
| E | 脱出穴:暗緑の階段ドット |
### 2-4. temple(神殿)用タイル描画
- town 基本に加え、C タイルを大理石風(白グレーグラデ)、T タイルを神殿祭壇(金色ドット)に上書き。
- M タイルは石柱を模した縦長パターン(柱の影を右側に2px追加)。
### 2-5. アニメーションフレーム
- T(炎・松明)と W(水面)は `requestAnimationFrame` カウンタを `Math.floor(Date.now() / 400) % 2` で2フレーム切替。
- 他タイルは静止描画(毎フレーム再描画しない)。
### 2-6. 呼び出し箇所
- 既存の Canvas サブマップ描画ループ内で `renderWorldTile` の代わりに `renderSubmapTile` を呼ぶ。
- `currentMapType`(`'world'` / `'submap'`)フラグが `'submap'` のときのみ適用。
- ミニマップ描画は既存の塗りつぶし色ベースを維持し、変更しない。
## 3. 既存機能との整合(壊さない点)
- ワールドマップ描画(`renderWorldTile`)は一切変更しない。
- サブマップのタイルデータ(`rows` 配列)・衝突判定・NPC/宝箱/出口の配置ロジックは変更しない。
- PHP側(lib.php の `submaps` 定義)は変更しない。
- スマホ対応:`tileSize` は既存のレスポンシブ計算値をそのまま渡すため変更不要。
- 描画関数はすべてJS内クロージャで完結し、外部ファイル依存なし。
ワールドマップの高解像度タイル描画は既に強化済みだが、サブマップ(village / cave / sanctuary / fort 等)の内部タイルはまだ簡易描画にとどまっている。村の家屋内装・洞窟の岩壁テクスチャ・神殿の石柱・古城の床など、サブマップ専用の16pxドット絵タイルセットをCanvas上でリッチ再描画することで、フィールド→町→ダンジョンのビジュアル差別化を完成させる。
## 2. 具体的な仕様
### 2-1. タイル種別ごとの描画関数追加(JS側)
既存の `renderWorldTile(ctx, tileCode, px, py, tileSize)` に相当するサブマップ専用関数 `renderSubmapTile(ctx, tileCode, px, py, tileSize, submapType)` を追加する。
- `submapType` は `'town'` / `'dungeon'` / `'temple'` の3種。
- `tileCode` は既存の `C`(城床)/ `G`(草/石床)/ `R`(遺跡床)/ `T`(野営地/祭壇)/ `E`(出口)/ `M`(壁)/ `W`(水)を流用。
### 2-2. town(村・神殿)用タイル描画
| tileCode | 描画内容 |
|---|---|
| C | 木目床:薄茶ベースに暗い縦縞2本 |
| G | 石畳:グレー市松模様(2×2px単位) |
| M | 木造壁:濃茶ベースに明るい横ライン1本 |
| T | 祭壇/暖炉:赤橙の炎ドット2フレームアニメ |
| E | 出口扉:青みがかった木枠+アーチ |
| W | 水盤:青系2色の波アニメ |
### 2-3. dungeon(洞窟・古城)用タイル描画
| tileCode | 描画内容 |
|---|---|
| R | 遺跡床:濃グレー+亀裂ライン |
| G | 洞窟床:暗茶色+砂利ノイズ点描 |
| M | 岩壁:黒+暗グレーの凹凸ブロック |
| C | 城床:石レンガ模様(4×4pxグリッド) |
| T | 松明台:橙炎2フレームアニメ |
| W | 地下水:黒青系2色の波アニメ |
| E | 脱出穴:暗緑の階段ドット |
### 2-4. temple(神殿)用タイル描画
- town 基本に加え、C タイルを大理石風(白グレーグラデ)、T タイルを神殿祭壇(金色ドット)に上書き。
- M タイルは石柱を模した縦長パターン(柱の影を右側に2px追加)。
### 2-5. アニメーションフレーム
- T(炎・松明)と W(水面)は `requestAnimationFrame` カウンタを `Math.floor(Date.now() / 400) % 2` で2フレーム切替。
- 他タイルは静止描画(毎フレーム再描画しない)。
### 2-6. 呼び出し箇所
- 既存の Canvas サブマップ描画ループ内で `renderWorldTile` の代わりに `renderSubmapTile` を呼ぶ。
- `currentMapType`(`'world'` / `'submap'`)フラグが `'submap'` のときのみ適用。
- ミニマップ描画は既存の塗りつぶし色ベースを維持し、変更しない。
## 3. 既存機能との整合(壊さない点)
- ワールドマップ描画(`renderWorldTile`)は一切変更しない。
- サブマップのタイルデータ(`rows` 配列)・衝突判定・NPC/宝箱/出口の配置ロジックは変更しない。
- PHP側(lib.php の `submaps` 定義)は変更しない。
- スマホ対応:`tileSize` は既存のレスポンシブ計算値をそのまま渡すため変更不要。
- 描画関数はすべてJS内クロージャで完結し、外部ファイル依存なし。
💬 返信 (3)
🛠 開発を開始しました (機能追加 rpg-story-forge)
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
📝 開発が完了しました
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
✅ リリース完了のお知らせ
ご要望いただいた「RPGストーリーフォージ AI風ドット絵冒険」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=rpg-story-forge
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/rpg-story-forge/
ご利用ありがとうございます!
ご要望いただいた「RPGストーリーフォージ AI風ドット絵冒険」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=rpg-story-forge
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/rpg-story-forge/
ご利用ありがとうございます!
Echo
Iris