ゲームアプリのUIデザイン

プレイしたゲームアプリのUIデザインに関して書き残します。毎日頑張って更新!

「ヘブンバーンズレッド」ADVパートのキャラの視線の変化によって臨場感が増す演出

こんにちは!ちょこです!

このブログでは「ゲームUIを見てみよう!」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです!

 

今回は「ヘブンバーンズレッド」、(以下、ヘブバン)から個人的に気になったADVパートの特徴について紹介します。ADVパートの要件を決めたり、デザインを検討する際の参考になれば幸いです。

 

主な特徴は以下です!

f:id:appgameui:20230412100951p:image

それぞれ紹介していきます。

 

キャラの後ろ姿のグラフィックがある

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

「ヘブバン」のADVにはキャラの後ろ姿のグラフィックが用意されています。
3DのADVならまだしも、2DのADVパートで背中が表示されることは珍しい気がします。手前のキャラをやや大きくし、ピントが合っていないようにボケさせています。

これにより、自然と奥のキャラに視線が誘導されています。
個人的にはあまり見ないタイプの演出だと感じたので、面白い試みに見えました。

 

視線を利用しキャラの位置関係、誰に対して話しかけているが分かる

「ヘブバン」ではキャラの視線に情報を乗せている印象を受けました。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

例えば、上の画像ではキャラの視線はこちらを向いています。
これは2人の前に他のキャラがいて、そちらに対して話しかけていることを表しています。

 

流れで見るとこんな感じです。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

オレンジのフードを着たキャラと、制服の二人が対面で会話していることが分かります。

 

また、キャラの視線を動かすだけで誰と会話しているかが分かりやすくなっているのも特徴的です。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

これは先ほどのシーンから少しだけ進み、制服のキャラ同士が会話しているシーンです。お互いの視線が交差しているのが分かりますでしょうか。

 

アニメーションで見るとこんな感じです。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

会話の途中でキャラの視線の向きが変わり、誰に対して話しかけているかがより分かりやすくなっています。

 

 

話していない方のキャラの視線が動く

キャラAが話している最中にキャラBの視線が動く仕組みも特徴的です。
これは山脇さまが話している最中に、しもべである豊後の目線が左右に動く例です。

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

最初は山脇さまの方を向いている豊後ですが、会話の途中で山脇さまの視線の先に向き直しています。

 

◆◆◆◆◆◆◆◆◆◆◆◆◆◆

こちらは山脇さまに呼ばれて視線を向ける豊後です。このように、話者ではないキャラが演技することで会話に参加している様子が強く印象付けられます

 

ちなみに、プレイしている感じそこまで多用されていません。
だからこそ、動くと驚きに変わり印象に残りやすくなっているのかもしれません。

プレイ中は基本的には話者のグラフィックやメッセージに集中していますが、周辺視野で話者ではないキャラの情報も拾えるため、割と気付きやすい演出ではあると思います。

 

余談ですが、ADVのキャラの視線の話は2022年のCEDECの講演で詳しく述べられています。興味があったら以下のレポート記事も読んでみていただければと思います。

 臨場感を表現するために,視線も効果的に用いられている。すでにプレイした人なら分かるはずだが,本作のキャラクターは立ち絵であっても会話の相手へ視線を向ける。こうした視線移動は表情差分のすべてに影響するだが,全員が基本の表情すべてで視線を左,中央,右に向けられるため,自然な芝居が可能になっているという。

 こうした視線移動やまばたきは非同期処理であり,会話中でも自由に実行できる。その例として挙げられたのが,山脇・ボン・イヴァールと豊後弥生の会話だ。山脇は自称「世界征服を企むマッドサイエンティスト」で,豊後は山脇の「しもべ」。山脇が自信満々に語ると,それを見ていた豊後が正面(主人公である茅森月歌がいる方向)に視線を転じてドヤ顔をする。
 つまり,山脇がしゃべっている最中,豊後が独立して視線を動かしており,これはアドベンチャーゲームとして珍しい表現だ。この非同期処理により,2人の関係性がより深く表現できる。

[CEDEC 2022]「ヘブンバーンズレッドのゲームデザイン」レポート。考え抜かれたブランドアイデンティティが開発のバックボーンになる

 

 

以上です。
ADVパートの演出を検討する際の参考になれば幸いです。

 

このブログではこのようにゲームUIついて簡単にまとめて紹介しています。
他のゲームUIも紹介しているので、もし良かったら他の記事も見て行っていただけると嬉しいです。

©WFS Developed by WRIGHT FLYER STUDIOS ©VISUAL ARTS/Key

 


権利者さまへ

 

以下はコンテンツ利用に関する認識の説明です。

「ヘブンバーンズレッド」のガイドラインを確認したところ、以下の記載がありました。

個人または法人格のない団体は、「YouTube」「ニコニコ動画」等の動画投稿サイトや「Twitter」「Instagram」「Facebook」等のSNSに投稿(ストリーミング配信を含むものとし、以下同様とします。)するにあたり以下の事項をすべてご確認いただき、ご同意いただいた場合に限り投稿および収益化プログラムシステムによる収益化が可能です。

「ヘブンバーンズレッド」動画等配信ガイドライン

これによりゲーム画面のスクリーンショットのブログの利用についてはガイドラインに従った前提で許可されている認識でおります。

ヘブンバーンズレッドのコンテンツ利用ガイドラインです。2023年2月10日改定版です

画像利用、記事の内容について問題がありましたら、お手数ですがご連絡ください。
速やかに対応いたします。

 

お問い合わせ