【実践記事・ADV編⑩】キャラクター選択画面とエンディングへの道——フラグ連鎖と自動遷移の設計

初心者向け実践開発

対応バージョン:Unity 6.3 LTS(6000.3系)/WebGL出力 この記事はシリーズ全11回の第10回です。第9回ではキャラクタークリックと話題システムの改修を行いました。今回はChapter2以降のフラグ連鎖と、TRUE END・BAD ENDへの分岐までを一気に組み上げます。 【PR】本記事にはアフィリエイトリンクを含みます。

目次


はじめに

前回はキャラクタークリックと話題システムの改修を行いました。

今回はゲームの後半部分を完成させます。具体的には以下の4つです。

  • Chapter2終了後にキャラクター選択画面を実装する
  • フラグ連鎖でChapter3・4へ自動的に進む仕組みを作る
  • エンディング選択画面を実装する
  • TRUE END・BAD ENDシーンからタイトルへ戻る導線を追加する

1. キャラクター選択画面の設計

どんな画面か

松本との最初の会話(Chapter1)が終わると、田中・磯部・沙耶・松本の4人が画面上に並びます。プレイヤーはキャラクターをクリックして話題を選びます。

Chapter1終了(met_matsumotoフラグ)
 ↓
田中・磯部・沙耶が画面に登場
 ↓(ready_for_videoフラグ成立後)
松本も画面に登場

松本は最初から4人目として配置するのではなく、ready_for_videoフラグが立ったときだけ表示します。これにより「全員の話を聞き終えて初めて松本に戻れる」という流れが自然に生まれます。

FlagManagerでキャラクターの表示を制御する

キャラクターの表示・非表示をFlagManagerで管理します。FlagManager.csにキャラクターオブジェクトへの参照を持たせます。

[Header("Chapter2キャラクター")]
public GameObject characterTanaka;
public GameObject characterSaya;
public GameObject characterIsobe;
public GameObject characterMatsumoto;

フラグに応じてキャラクターを表示・非表示にする処理をOnFlagChanged()に追加します。

talked_matsumoto_policeフラグ → 田中・磯部・沙耶を表示
ready_for_videoフラグ        → 松本を表示
confronted_tanakaフラグ      → 全員を非表示にしてChapter4へ

選択画面専用の背景

キャラクター選択中は専用の背景(島の俯瞰マップ)に切り替えます。FlagManagerに背景Spriteの参照を持たせて、選択画面に遷移するタイミングで切り替えます。

「キャラクターをクリックしてください」の案内

TopicPanelが開いていない状態でどうすればいいかわからないプレイヤーのために、案内テキストを表示します。

NotificationPanelを使って「キャラクターをクリックしてください」と表示し、TopicPanelが開いたら非表示、会話が終わって選択画面に戻ったら再表示という制御を行います。


2. フラグ連鎖でChapter3・4へ進む

ready_for_videoの仕組み

「動画について」の話題は単独のフラグでは解放されず、2つのフラグが両方立ったときに解放されます。

talked_saya_past(沙耶「月凪の過去」終了)
 AND
talked_isobe_ruins(磯部「廃旅館」終了)
 ↓
ready_for_videoフラグが自動的に立つ
 ↓
松本の「動画について」が解放・松本が選択画面に登場

このコンボフラグの判定はFlagManager.csCheckComboFlags()で行っています。どちらのフラグが後に立っても自動的にready_for_videoが発火します。

Chapter4への自動遷移

田中を追及してconfronted_tanakaフラグが立ったとき、Chapter4(田中の自白)を自動的に再生します。

この処理はFlagManager.csOnFlagChanged()に追加します。

confronted_tanakaフラグが立つ
 ↓
全キャラクターを非表示
案内テキストを非表示
 ↓
Ch4_Tanaka_Confessを自動再生
 ↓(会話終了)
tanaka_confessedフラグが立つ
 ↓
エンディング選択画面を表示

重要なのは、DialogueDataのsetFlagOnCompleteでフラグを立てる処理と、その後のコールバック呼び出しの順番です。フラグを立てた瞬間に新しい会話が始まることがあるため、コールバックを先にローカル変数に退避してからフラグを立てる設計にしています。


3. エンディング選択画面

設計の考え方

Chapter4が終わり、田中が自白すると「記事を本土の編集部に送りますか?」という選択肢が表示されます。

tanaka_confessedフラグ
 ↓
OnChapter4Finished()が呼ばれる
 ↓
EndingManager.ShowEndingChoice()
 ↓
背景をターミナル(bg_terminal)に切り替え
EndingPanelを表示

EndingPanelのレイアウト

EndingPanelには以下の要素を配置します。

要素位置内容
タイトルテキスト画面上部中央「記事を本土の編集部に送りますか?」
TRUE ENDボタン画面下部左「記事を送る」
BAD ENDボタン画面下部右「送るのをやめる」

ボタンの色はゲームのUIカラーに合わせて設定します。TRUE ENDは濃い青(#1A3A6A)、BAD ENDは濃い赤(#6A1A1A)にしています。

証拠アイテムのチェック

ShowEndingChoice()内では、証拠「請求書の動画」を持っているかチェックしています。動画を入手せずにこの画面が表示されることがないよう、安全策として入れています。

public void ShowEndingChoice()
{
    if (!EvidenceManager.Instance.HasEvidence("video")) return;
    // エンディング画面を表示する処理
}

4. TRUE END・BAD ENDシーンの実装

各シーンの構成

TRUE ENDシーンとBAD ENDシーンはそれぞれ独立したシーンです。テキストと背景画像を配置し、最後に「タイトルへ戻る」ボタンを表示します。

タイトルへ戻るボタン

各エンディングシーンにSceneControllerをアタッチして、LoadTitle()メソッドをボタンのOnClick()に登録します。

public void LoadTitle()
{
    SceneManager.LoadScene("TitleScene");
}

ボタンのテキストには日本語フォント(Noto Sans JP)を使います。LiberationSans(デフォルトフォント)では日本語が表示されないため注意してください。

Build ProfilesのScene List

全シーンをBuild Profilesに登録します。TitleSceneを0番にすることが重要です。 0番のシーンがゲーム起動時に最初に表示されます。

TitleScene    (0) ← 起動時に表示
SampleScene   (1)
BadEndScene   (2)
TrueEndScene  (3)

5. 動作確認チェックリスト

  • [ ] Chapter1終了後に田中・磯部・沙耶が表示される
  • [ ] talked_saya_pastとtalked_isobe_ruins両方立つとready_for_videoが発火する
  • [ ] ready_for_video後に松本が選択画面に登場する
  • [ ] 田中追及後にChapter4が自動再生される
  • [ ] Chapter4終了後にエンディング選択画面が表示される
  • [ ] TRUE ENDボタンでTrueEndSceneに遷移する
  • [ ] BAD ENDボタンでBadEndSceneに遷移する
  • [ ] タイトルへ戻るボタンでTitleSceneに遷移する

まとめ

今回でゲームの全フローが完成しました。

フラグ連鎖の設計がゲームの進行を支えています。「このフラグが立ったらこの処理を呼ぶ」というパターンをOnFlagChanged()にまとめることで、スクリプト間の依存関係をFlagManagerに集約できます。

次回は、WebGLビルドとitch.ioへの公開方法を解説します。


あわせて読みたいおすすめ書籍【PR】

今回実装したフラグ連鎖・自動遷移・エンディング分岐についてさらに学びたい方には、以下の書籍もおすすめです。本セクションにはアフィリエイトリンクを含みます。

※このセクションのリンクはアフィリエイトリンクであり、商品が購入された場合、サイト運営者に紹介料が支払われることがあります【PR】。


この記事を作成するにあたって参考にしたサイト

コメント

タイトルとURLをコピーしました