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

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

「アズールレーン」そろそろ商品を並べるだけでなく、魅力的に伝えるデザインが必要になってきている

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

 

アズールレーン」のショップUIが大分思い切りが凄かったのでデザインの参考までに紹介してみます!

f:id:appgameui:20200601090233p:image

 

見て分かる通り、商品の一覧性や価格以上にキャラクターのプレビューの面積が圧倒的に大きく取られています。

 

商品の一覧性や価格を犠牲にしてまで訴求にバランスを振り切るデザインは私の頭の中にはなかったので、そういった面でかなり振り切ったデザインだと感じています。

f:id:appgameui:20200607215751p:plain

▲非選択以外の商品を隠して、価格の表示も見えなくなっている

 

これほどまでに訴求している思い切りの良さが凄い…。なんというか…勢いを感じます。

 

ちなみに衣装を切り替えるとこんな感じで切り替わります。

f:id:appgameui:20200607214158g:plain
▲キャライラストが切り替わってから、遅れて背景が切り替わっている

 

同じYoster社がサービスを展開している「アークナイツ」の衣装ショップはこんな感じです。

f:id:appgameui:20200211185545g:plain

▲パララックスの表現が用いられている

 

キャラクターを訴求する、という方向性は同じですが、訴求の仕方が違うことが特徴的ですね。面積は大きくないですが「アークナイツ」は余白を使っていて「アズールレーン」とは趣が違っています。

 

七つの大罪 ~ 光と闇の交戦(ひかりとやみのグランドクロス)~」もかなり気合が入ってました。

f:id:appgameui:20200607223145g:plain

ショップ画面だからと言って商品をきれいに並べるだけで終わらずに、その商品をより魅力的にディスプレイすることも求められてきているのかもですね。

 

とはいえ、ショップ画面のディスプレイだけを頑張ってもあまり意味はなく、ゲーム部分をしっかり作り込んだ上で臨むと良さそうです!