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

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

「魂器学院」縦画面で横方向にパララックス表現をした時の見た目

こんにちは、ちょこです。

 

「魂器学院」のガチャ画面でパララックスの表現が使われていました。

該当の画面はこちらです。

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



 

動かすとこんな感じです。 

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

 

「魂器学院」を見た感じ階層は以下の3つの階層に分かれています。

  1. 手前にある文字列
  2. 中間層にあるキャラクター
  3. 背面にある背景グラフィック

 

 

この表現は「アークナイツ」でも見かけました。流行っているのかな…?

f:id:appgameui:20200201140846g:plain

 

 

「アークナイツ」を見た感じ階層は以下の6つの階層に分かれています。

  1. 手前に散っているエフェクト
  2. ボタンUIやキャラクターのレアリティ、SDキャラ
  3. 左下にある提供割合の情報
  4. ピックアップキャラ近景
  5. ピックアップキャラ中景
  6. ピックアップキャラ遠景、背景

 

 

「魂器学院」と「アークナイツ」のデザインを比較すると、画面の変化量の違いがあげられます。

 

「アークナイツ」は横画面で「魂器学院」は縦画面です。

縦画面にも関わらず横スクロールした時にパララックスの演出がなされるため、画面内の変化量としては少なくなります。

その結果、パララックスが取り入れられていることに気付きづらくなっています。

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

 

変化量が少なく気付きづらくなっているため、「アークナイツ」ほどのインパクトは無いように感じました。

 

ともあれ、細部にこだわりを持ってデザインすることは大切です。
このこだわりる姿勢は参考にしたいと思いました。

 

以上です。

縦画面で横方向のパララックス表現をした時の演出の参考になれば幸いです。