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

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

「ブラック・サージナイト」ステージ選択画面で拡大縮小を示す目盛りが表示されていたデザインの紹介

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

 

 

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

 

 

今回は「ブラック・サージナイト」のステージ選択画面のデザインを紹介いたします。

 

該当の画面はこちらです!
攻略中のエリア、イベントエリアなどが世界地図を用いて表示されています。

f:id:appgameui:20210815112751p:image

 

挙動を紹介します。画面をスクロールすることはもちろん、このようにピンチイン、ピンチアウトで画面を拡大、縮小することもできます。

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

 

 

画面をよく見ると、画面右側に目盛りが表示されていることが分かります。
これは画面の拡大率を示しています。

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


画面遷移した際のデフォルト値は20%で、最少は0%、最大は100%です。
これは拡大率の係数というよりも、最小と最大を100分割した感じですかね。

 

 

またスライダーのように操作することも可能です。
一見して触れるようには見えなかったのですが、試したら掴めた感じですね。

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


 

このように「ブラック・サージナイト」では細かなギミックで世界観を表現していました。

単純にマップを拡大、縮小するだけであれば不要なギミックですが、世界観に合わせる形で要素を足したデザインだと感じました。

 

以上です。

世界観を表現するのはパーツだけではないのですね。
このように操作性を活かすことも選択肢の一つだと感じました。
世界観をモチーフとした画面をデザインしたいと考えるヒントになれば幸いです。