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

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

「パニシング:グレイレイヴン」世界観を表現するグリッチ表現を取り入れるとユーザーの満足度につながるかも

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

 

何度目かですがグリッチ表現の事例紹介です。
今回は「パニシング:グレイレイヴン」から紹介します。

 

今回は3つの画面での採用事例を紹介します。まず最初の画面はこちらです!
アドベンチャーパートの画面です。 

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

 

静止画で見ても分からないと思います。
アニメーションで見るとこんな感じになります。

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

 

アニメーションで見ても分かりづらいですよね…。 
拡大します!

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

 

見やすくなりましたかね…。かなり大人しいフィルタのかけ方ですね。

以下が特徴的な要素かと思います。

  • 走査線
  • ラインノイズ
  • ブロックノイズ
  • 発光しているような色

このようなデザインです。
色収差がないのも珍しいですね。

以上がアドベンチャーパートでの採用事例です。

 

続いてもうひとつ。

戦闘終了後に表示されるケースです。
新しく機能が開放された後のチュートリアルの実行を確認する際に表示されています。

f:id:appgameui:20210503183403p:image

 

 

該当の部分を拡大表示します!今度は分かりやすいでしょうか…?

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

 

デザインとしては以下が特徴的な要素かと思います。

  • 歪み
  • 色収差
  • 発光しているような色

アドベンチャーパートとは違った表現ですね。
こっちの表現の方がよく見る表現であるように感じました。 

 

 

最後に!
チュートリアル中に表示されているナビゲーションでの事例です。

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

 

 

画面左上のこちらですね。

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

 

 

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

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

 

こちらのデザインの特徴も先ほど紹介した事例と似たほぼ同じものですね。

  • やや大き目な歪み
  • 色収差
  • 発光しているような色

歪みが大きいのは表示面積が小さいためなのかな…
少し目立たせて、変化を認識しやすくする意図があるのかもしれません。

 

 

以上です。

UIの評価軸には「満足度」というものがあげられます。
ゲームUIの場合は「世界観に対する没入感」というものがユーザーの満足度に繋がるものかと考えます。

今回紹介したグリッチ演出は世界観の表現に繋がる表現のひとつだと考えます。 

世界観を構築する参考のひとつになれば幸いです。