リクエスト詳細
✨ 既存アプリの改善
対応完了
対象アプリ: 合体ドロップ
自己ベスト更新時にCanvas上で紙吹雪演出を表示
1. 目的:
ゲームオーバー画面には既に「あなたのベスト」欄と new-best-disp による自己ベスト更新表示があるが、テキスト表示のみで視覚的な達成感が薄い。既存のコンボ演出(v1.14.0)と同じCanvas描画の仕組みを流用し、自己ベスト更新時に紙吹雪(confetti)アニメーションを追加することで、達成感を高めプレイの継続動機を強化する。
2. 具体的な仕様:
- ゲームオーバー判定後、送信前の最終スコアが localStorage に保存済みの当該モード・言語の自己ベストを上回った場合(既存の new-best-disp 表示ロジックと同じ条件)、game-canvas 上に紙吹雪パーティクルを生成して1.5〜2秒間アニメーションさせる。
- パーティクルは画像を使わず、Canvas の fillRect / arc で小さな色付き矩形・円を描画し、重力に従って落下・回転させるシンプルな実装(既存のコンボアニメーション用の requestAnimationFrame ループを再利用または同様の手法で実装)。
- 色は選択中モードのテーマカラー(vd_themes)から2〜3色をランダムに使用し、モードごとの一体感を保つ。
- 演出はゲームオーバーオーバーレイ表示時に1回だけ再生し、既に自己ベストがない(初回プレイで比較対象がない)場合や、更新されなかった場合は演出を出さない(現状の new-best-disp 非表示条件と同じ判定を利用)。
- 演出中もスコア送信フォームやリザルトコピー、順位プレビューなど他のUI操作をブロックしない(pointer-events はUI要素に影響しないようcanvas内描画のみで完結)。
- モーション過多を避けたいユーザーのため、既存の振動オン/オフ設定のように localStorage に「演出オン/オフ」設定を追加してもよいが必須ではない(実装コストが上がる場合は省略可)。
3. 既存機能との整合:
- 自己ベスト判定・保存ロジック、new-best-disp のテキスト表示、スコア送信フロー、DBスキーマは一切変更しない。
- 既存のコンボアニメーションや振動・BGM・効果音のオン/オフ設定には影響を与えない。
- Canvas描画のみの追加のため、レイアウトやDOM構造の変更は最小限(ゲームオーバー時に一時的なパーティクル配列を描画するのみ)。
- スマホ・PC双方でCanvasはすでにレスポンシブ対応済みのため追加対応不要。
ゲームオーバー画面には既に「あなたのベスト」欄と new-best-disp による自己ベスト更新表示があるが、テキスト表示のみで視覚的な達成感が薄い。既存のコンボ演出(v1.14.0)と同じCanvas描画の仕組みを流用し、自己ベスト更新時に紙吹雪(confetti)アニメーションを追加することで、達成感を高めプレイの継続動機を強化する。
2. 具体的な仕様:
- ゲームオーバー判定後、送信前の最終スコアが localStorage に保存済みの当該モード・言語の自己ベストを上回った場合(既存の new-best-disp 表示ロジックと同じ条件)、game-canvas 上に紙吹雪パーティクルを生成して1.5〜2秒間アニメーションさせる。
- パーティクルは画像を使わず、Canvas の fillRect / arc で小さな色付き矩形・円を描画し、重力に従って落下・回転させるシンプルな実装(既存のコンボアニメーション用の requestAnimationFrame ループを再利用または同様の手法で実装)。
- 色は選択中モードのテーマカラー(vd_themes)から2〜3色をランダムに使用し、モードごとの一体感を保つ。
- 演出はゲームオーバーオーバーレイ表示時に1回だけ再生し、既に自己ベストがない(初回プレイで比較対象がない)場合や、更新されなかった場合は演出を出さない(現状の new-best-disp 非表示条件と同じ判定を利用)。
- 演出中もスコア送信フォームやリザルトコピー、順位プレビューなど他のUI操作をブロックしない(pointer-events はUI要素に影響しないようcanvas内描画のみで完結)。
- モーション過多を避けたいユーザーのため、既存の振動オン/オフ設定のように localStorage に「演出オン/オフ」設定を追加してもよいが必須ではない(実装コストが上がる場合は省略可)。
3. 既存機能との整合:
- 自己ベスト判定・保存ロジック、new-best-disp のテキスト表示、スコア送信フロー、DBスキーマは一切変更しない。
- 既存のコンボアニメーションや振動・BGM・効果音のオン/オフ設定には影響を与えない。
- Canvas描画のみの追加のため、レイアウトやDOM構造の変更は最小限(ゲームオーバー時に一時的なパーティクル配列を描画するのみ)。
- スマホ・PC双方でCanvasはすでにレスポンシブ対応済みのため追加対応不要。
💬 返信 (3)
🛠 開発を開始しました (機能追加 vegetable-drop)
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
ご要望ありがとうございます。AI 開発ワーカーが実装を開始します。
通常 5〜30 分で Pull Request を作成し、レビュー後にリリースされます。
📝 開発が完了しました
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
ご要望いただいた内容の実装が完了し、最終チェック段階に入りました。
レビュー (自動) → リリース、の流れで進みます。
もう少々お待ちください。
✅ リリース完了のお知らせ
ご要望いただいた「合体ドロップ」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=vegetable-drop
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/vegetable-drop/
ご利用ありがとうございます!
ご要望いただいた「合体ドロップ」を実装し、リリースいたしました。
【ご利用方法】
ダッシュボード: https://www.aiapps.jp/?action=dashboard
アプリ詳細: https://www.aiapps.jp/apps/show.php?slug=vegetable-drop
デモ環境は 1 時間以内に自動構築されます:
https://www.aiapps.jp/demo/vegetable-drop/
ご利用ありがとうございます!
Echo
Iris