ガチャシステムと報酬獲得の演出に必要なアセット
ガチャの全体フローと、各ステップで必要なアセット。
ボタン押下から結果表示までの流れ
ガチャボタンを押してから結果が出るまでの画面演出。ガチャの体験を大きく左右する。
ゲームテーマに合わせた演出の型
| パターン | 演出内容 | 推奨形式 | 長さ |
|---|---|---|---|
| 召喚型 | 魔法陣展開 → 光の柱 → キャラ出現 | MP4 or CSS+WebPアニメ | 2-4秒 |
| カードめくり型 | カード裏面 → 回転 → 表面 | CSS transform | 1-2秒 |
| 宝箱型 | 宝箱に光が集まる → 開く → アイテム飛び出し | WebPアニメ / MP4 | 2-3秒 |
| スロット型 | リール回転 → 停止 → 結果 | CSS animation | 2-4秒 |
| くじ引き型 | カプセルが落ちてくる → 開く | CSS + WebPアニメ | 2-3秒 |
必要な素材と形式
| アセット | 形式 | バリエーション |
|---|---|---|
| 背景アニメ | MP4 or CSS gradient animation | 通常 / レア確定時（色変化） |
| 魔法陣 / シンボル | PNG（透過）+ CSS rotation | 通常 / SR確定（金）/ SSR確定（虹） |
| 光エフェクト | WebPアニメ / CSS | 白 / 青 / 金 / 虹 |
| パーティクル | CSS / Canvas | 通常の光粒子 / レアの大粒子 |
| SE: 演出開始 | MP3 | 1種 |
| SE: レア確定 | MP3 | SR / SSR で差分 |
| SE: 結果表示 | MP3 | N-R / SR / SSR で差分 |
レアリティごとに異なるビジュアルエフェクト。高レアほど派手に。
各レアリティの演出差分
| レアリティ | 演出色 | エフェクト強度 | SE | 画面効果 |
|---|---|---|---|---|
| N（ノーマル） | 白 / グレー | 控えめ | 短い「ポン」 | 軽いフラッシュ |
| R（レア） | 青 | やや控えめ | 「キラン」 | 青い光のフラッシュ |
| SR（スーパーレア） | 金 | 派手 | 華やかなファンファーレ | 金色フラッシュ + パーティクル |
| SSR / UR | 虹 / 特殊色 | 最大級 | 壮大なファンファーレ | 虹色フラッシュ + 大量パーティクル + 画面揺れ |
| アセット | N | R | SR | SSR |
|---|---|---|---|---|
| 背景フラッシュ | 白 | 青 | 金 | 虹グラデーション |
| 枠エフェクト | — | — | 金枠ﾌﾟﾗｽ | 虹枠 + 発光 |
| パーティクル | — | 小量 | 中量（金色） | 大量（虹色） |
| SE | 通常 | 通常 | SR専用 | SSR専用 |
| カード登場アニメ | フェードイン | フェードイン | 光の柱 + 回転 | 全画面演出 + 光の柱 |
ガチャ結果のキャラクター/アイテムを表示する画面。
1回引きの結果画面
| 要素 | アセット | 備考 |
|---|---|---|
| キャラ全身イラスト | PNG（透過）1200×1600程度 | 通常の立ち絵とは別に専用ポーズを用意すると◎ |
| 背景 | レアリティ色の光背景 | SR: 金背景 / SSR: 虹背景 |
| 名前テロップ | CSS + フォント | キャラ名 + 二つ名 |
| レアリティ表示 | PNG（星/バッジ） | ★の数 or レアリティバッジ |
| NEW表示 | PNG / CSS | 初獲得時に表示するバッジ |
| 属性/クラスアイコン | PNG | キャラの属性やクラスを表示 |
10連ガチャの結果一覧画面
| 要素 | 内容 |
|---|---|
| カードグリッド | 10枚のカードを2行×5列 or 横並びで表示 |
| カード裏面→表面 | 順番にめくるアニメーション（CSS transition） |
| 一括めくりボタン | 全カードを一度に表示するスキップ機能 |
| レアリティ枠 | 各カードの枠色でレアリティを区別 |
| タップで拡大 | 個別カードをタップすると単発結果画面と同じ表示 |
| もう一度引くボタン | 結果画面から直接再ガチャ |
バトル報酬・ミッション報酬・ログインボーナス等の報酬表示。
報酬を渡す場面ごとのUI
| 報酬シーン | 表示形式 | 演出 | アセット |
|---|---|---|---|
| バトル勝利報酬 | アイテムアイコン + 個数リスト | アイコンが順番にポップイン | アイテムアイコン + ポップSE |
| クエスト報酬 | 宝箱 → 中身表示 | 宝箱オープンアニメ | 宝箱PNG + オープンWebPアニメ |
| ログインボーナス | 7日間カレンダー + 当日ハイライト | 当日枠が光る + スタンプ | カレンダーUI + チェックマーク |
| ミッション達成 | ミッション名 + 報酬ボタン | 受取ボタン → 獲得エフェクト | バッジ + 光るボタン |
| ランクアップ | ランクエンブレム変化 | 旧ランク → 新ランク演出 | ランクバッジ × レベル数 |
| 実績解除 | トースト通知 | 画面端にスライドイン | 実績アイコン + 枠 |
ガチャを引く前の選択画面・ショップ画面のUI要素。
開催中ガチャの告知画像
| 要素 | サイズ | 内容 |
|---|---|---|
| メインバナー | 960×540 or 1200×630 | ピックアップキャラ + ガチャ名 + 期間 |
| サムネイルバナー | 480×270 | ガチャ選択リストのサムネイル |
| ピックアップ表示 | — | 対象キャラのミニ一覧（顔アイコン + レアリティ） |
| 残り期間表示 | — | カウントダウンタイマー |
ガチャを引くためのUI要素
| UI要素 | 内容 | アセット |
|---|---|---|
| 通貨アイコン | 有償石/無償石/チケット | 各通貨のアイコン（32×32） |
| 所持数表示 | 現在の通貨残高 | テキスト + アイコン |
| 1回引くボタン | 単発ガチャ（消費量表示） | ボタン + 通貨アイコン + 数値 |
| 10連引くボタン | 10連ガチャ（消費量 + お得表示） | ボタン（大きめ）+ 「お得!」バッジ |
| 排出率確認ボタン | 法律で義務付けられた確率表示へ | テキストリンク or 小ボタン |
| 天井/保証表示 | あと何回で確定か | プログレスバー + 数値 |