ゲーム・アニメなどエンターテイメントのプロモーション・Web制作に
関わる人に少しプラスになる情報を発信するメディア

デザイン

ゲーマー徹底討論!!注目のゲームUIUX

日々、多くのゲームが発売されており様々なストーリーや世界観やキャラクター・・・一つ一つタイトルに合わせた独自のデザインがなされていますが、UIも例外ではありません。
没入感が重要なゲームでは、ある種メタ的な側面を持つUIに対していかに違和感を失くすかで体験の満足度が大きく変わります。
果たして、昨今のゲームタイトルにおいてUIはどのようにデザインされているのか?
この記事ではエンタクルに在籍するゲーマーが役職問わずゲームUIについて語った内容を交え、注目のゲームUIを紹介したいと思います。

討論にあたって

今回はジャンルをアクションゲームに絞り、各々のお気に入りを語りました。
参加者は以下の通り

デザイナーK

デザイナーH

エンジニアF

エンジニアM

討論スタート!

デザイナーK

それではみなさん、はじめて行きましょう!

一同

よろしくお願いします!

デザイナーK

皆さんには事前に推しのタイトルを用意してきていただいております。ので、各々自身の推しとポイントを語ってもらってそれに対して皆さんも感想を述べていきましょ~

デザイナーK

それでは早速私から・・・

デザイナーKの推し01

Cyberpunk2077
近未来が舞台のオープンワールドアクションゲーム
「サイバーパンク」と言われるジャンルは以前からありましたがそれと同じ名を冠する作品として申し分ないアートが世界観にもUIにも盛り込まれています。

デザイナーK

発売当初からプレイしてましたサイパン(注:サイバーパンク)です!皆さんもプレイは・・・

一同

しました!

エンジニアF

話題になりましたもんね~、てんやわんやあったのも今は解決してすごく評価もいい。

デザイナーK

そうなんですよ、個人的にAKIRAとか攻殻機動隊とか大好きなんでオマージュモリモリで愛を感じるサイパンは見逃せなくて。デザインもカラースキームが統一されててプロモ含めてスタイリッシュなイメージがかっこいい。

トランジション、細かいアイコンパーツ、インタラクション等々全てにこの作品ならではのデザインが加えられているためメニューというある種メタ的な世界にも没入感を添えている良い例だと考えます。

エンジニアM

SFってUIと相性いいっすもんね。動き含めてめっちゃ没入できる。

デザイナーK

ですね。めちゃデザインの勉強になる仕上がりで大好きです!

デザイナーKの推し02

Ghost of Tsushima
元寇をテーマにしたオープンワールドアクションゲーム

デザイナーK

お次はこちら、ツシマです!

デザイナーH

おお、ツシマは僕もUIの参考にめっちゃしてます。

デザイナーK

かっこいいですよね~、比較的和風ゲームって質感しっかり陰影しっかりでリアルなデザインに寄りがちなんですけどツシマは振り切ってすごくスマート。こんなに洗練された和風ゲームってあんまり見ない。

近代のタイトルで「和風」というコンセプトをどう見せるかはフラットデザインとの兼ね合いで難しいところだと思いますが、墨や筆など細かくなって扱いづらくなりがちなシェイプをしっかり使いつつも無理を生じさせないスマートな作りで個人的には勉強になるデザインでした。
対馬という比較的マイナーな題材でありながら表現するアイコンも芯を食っていながらカッコ良い仕上がりで見どころだと思います。

デザイナーH

ですよね、スペースの取り方とか綺麗で。アイコンとかもちゃんとスキルとか型を要約しててスッキリ見せてくれるからくどくない。けど世界観を崩さない。

デザイナーK

ほんと、新しい和風の見せ方かもしれませんね~

デザイナーKの推し03

FINAL FANTASY 16
言わずと知れた大作RPG。
スクエアエニックスさんは作風も相まってファンタジーのUIに向き合うケースが多い印象ですが、FFに関しては近未来的な作風になることも多いため意外とゴリゴリのファンタジーなUIは少ないです。

デザイナーK

次は今プレイ真っ最中のFF16です!

エンジニアF

僕も今やってますよ!結構ボリュームあるんですよね~

デザイナーK

同志がいましたか・・・プレイ中の人たくさんいるでしょうねw
FFは結構近未来が舞台な事も多いのですが16はダーク寄りのファンタジーなためどんなデザインで来るか期待してたんですよ。 プレイしてみての感想としては力入れて向き合ってるなという印象です。

エンジニアF

最近のゲームらしい感じだけどちゃんとファンタジー要素が入ってますよね。違和感なくスッと入れました。スキル設定に動画で見本つけてくれるのはすごい助かる!

今作ではファンタジーな雰囲気に立ち返るため細かくなりがちなファンタジー風味をどう近代的なデザインに適用するかが見どころでした。
バビロンズフォールでも使用されていたアールデコ調のシェイプがフラットデザインと相性が良いのでシンプルだけどファンタジーしてるのが上手くハマってたんじゃないかと思います。

デザイナーK

説明書くより見た方が早いってのはありますね〜動画or静止画、アイコン、文字で構成は基本かもですね。 そういった構成も取り入れつつ、グラフィックも最近のタイトルで培ったテイストの総決算という感じで仕上がってます!

エンジニアMの推し01

ELDEN RING
オープンワールドの高難易度アクションゲーム
UIの統一が高いレベルでされている作品で、メニューを開こうがキャラクターメイクをおこなおうがショップを訪れようがほぼ同じトンマナで表示されるので少し最初にとまどっても一度覚えてしまいすればストレスはかなり軽減される作りです。

エンジニアM

僕の推しは・・・Kさんもやり込んでましたよね、エルデンリングです!

デザイナーH

これも話題になりましたよね〜

エンジニアM

ですね〜、僕はフロムさんのゲームは色々やりこんでるんですけど正直戦闘中は見てる暇がないw ので注目したことはあんまりなかったんですがエルデンリングは結構細かい配慮があって発見が多かったです。

基本的なプレイ画面のUIに工夫があり、基本的に表示される要素がすくない。
合わせて特徴的なのがそれぞれのUIにアクションが無いと非表示になっている点。
例えば、敵からダメージをウケるまでHPゲージは表示されないし、ダッシュや武器を振らないとスタミナゲージも表示されないなどの仕様となっている。
上記の仕様により、フィールドを移動している際などは表示されるUIがほぼない(方角のみ)ので世界観や風景に没入できるようになっている。

デザイナーK

確かに、言われてみれば・・・な配慮が結構重要だったりしますね。HPゲージが出てる時は変動がある時だから何かでダメージを受けたと気づく仕掛けにもなってる。

デザイナーH

ふと思い出したんですけどワンダと巨像もほぼUI無いっすよね。UIが無いことで没入感を高めるっていうのも理にかなってるんだな〜と。

ワンダと巨像の戦闘画面。UIが最小限に抑えられています。

エンジニアM

確かにそれも手の一つですよね。特にアクションゲームは視界のリソースに余裕ないから操作に慣れるのが優先的になって、UIから卒業するのが早いというか。

デザイナーK

うん、ユーザーの卒業が早い前提で構築してるのはあるかも。

エンジニアMの推し02

CUPHEAD
一昔前のカートゥーン調の横スクロールアクションゲーム

エンジニアM

次の推しはこれです。結構前からありますが。

デザイナーK

この見た目で結構むずいんだよね〜

エンジニアM

そうなんですよ。アクションとしての遊びごたえも良いんですが、世界観にガッツリ当てはめたUIも見どころなんです。全部の操作が世界に入り込んでる。

カートゥーンアニメーション感がふんだんに取りいれられていて世界観に没入できる。
フォントや画面効果にも気を使っているのでより一層カートゥーンアニメーションを実際に動かしているかのような感覚になる。

デザイナーK

確かに!共通してのUIとかシステムを取り入れて慣れを早くさせる形を取るタイトルもあるけどこのゲームはタイトル独自のデザインでしっかり構築してるからUIそのものもゲームとして楽しめるのが良い。

エンジニアM

触ってて気持ちいいんですよね〜、可愛いし!

デザイナーHの推し01

DEATH STRANDING
荷物を運んで届ける異色のオープンワールドゲーム
フィールド上でのUIは、世界観に没入できるよう最低限に抑えられつつも、絶妙に削ぎ落とされたアイコン等で分かりやすくメニューが設計されていて迷うことが少ない完成度の高い作品。

デザイナーH

僕が推すゲームはこちらです!

デザイナーK

これまた話題作ですね!大分遊んだ記憶があります。

デザイナーH

正直内容的に変わってるのでUIも独自のものになってて、慣れるのが大変なイメージなんですが、あんまり苦労しなかったんですよね。

荷物のカスタマイズなどのメニュー画面では、AAAタイトルにありがちな、とにかく字が小さい上に文字だらけになってしまいがちですが、どこを見るべきかがうまく整理されていた印象です。

デザイナーK

運ぶ荷物もできることも徐々に増えていくから操作しながら訓練されていったとか。何気ないけど設計が親切だったのかな。

デザイナーH

そういうことか!やっぱりゲームは付き合う時間が長いからWEBとは違った考え方で設計されてるんですね〜

デザイナーHの推し02

SUPER MARIO ODYSSEY
言わずと知れたスーパーマリオのアクションゲーム

デザイナーH

次はこちらです!

デザイナーK

おお、マリオできましたか。最近触れてなかったんですけど・・・進化しましたね〜

デザイナーH

そうなんですよ、グラフィックもすごいんですけどUIを白文字ドンッでちゃんと機能させてたりここまで引き算されてるとフラットテイストの勉強になるなと。

元々マリオといえばブロック感のあるトンマナのイメージでしたが、今作はかなりフラットなデザインになっている。 グラフィック自体がかなり進化してきたのもあって画面の複雑さとのバランスを取りつつ楽しげな雰囲気はそのままで成立させていてすごい。

デザイナーK

任天堂さんのゲームってサイトもそうなんですけどアイテムとかキャラとかが完成されてるから画像とテキストでバチっと決めるのが上手くて。 そのスタイルがゲームでも発揮されてますね。

エンジニアFの推し01

STREET FIGHTER 6
シリーズ6作目の対戦格闘ゲーム

エンジニアF

僕からはこちらです!

デザイナーK

最近出てましたね〜、僕は対戦格闘はあまりやらないですが毎回イメージを刷新してるなと思ってはいました。

エンジニアF

そうなんですよ、今回はより世界に向けたカッコいいデザインになっています。シンプルだけどそう感じさせない練られたUIだなと思って。

格闘ゲームはeスポーツの流れもあり、ワールドワイドに展開する事もあってか言語対応などユニバーサルなデザインが求められてきているようです。 しかし見栄えとしてシステマチックに偏りすぎないようコンセプトが考えられており、カラースキームやアートとシンプルなシェイプを調和させてバランスを取っていてスタイリッシュなデザインに仕上げている印象です。

デザイナーK

webも多言語対応は割とコンスタントにあるので、カッコよく見せたいけど制約がある・・・っていうのは常に悩みどころなんですがこのゲームはしっかり課題を解決できてる感じですね。

エンジニアF

いろんなジャンルのゲームが世界中に発信されるのでこういった例はすごく参考になります!

エンジニアFの推し02

STAR OCEAN 6
こちらもシリーズ6作目のアクションRPGゲーム
シリーズを通して青色がテーマカラーなのは変わらず、時代に合わせたスタイルに進化し続けています。

エンジニアF

次のタイトルはこちらです。

デザイナーK

奇しくも6繋がり!

エンジニアF

気づけばたくさん出たものです・・・。青色メインで構成されたUIはSFな作風に相変わらずハマってます。 スピーディーなアクションRPGなので戦闘画面の見やすさがキモになりますがそこも見やすく作られていました。

デザイナーK

パーティーメンバー全員のステータスだったり装備やらアイテムやらRPGならではのUIは大変なところが多いけど、スッキリしてますね〜。 SF系のUIデザインとして結構参考になりそうです!

シンプルなアイコンやシェイプで構成され、情報のエリア分けのおかげで細かい項目も読みやすい気がしました。

デザイナーK

みなさんさまざまなゲームを推薦してもらってありがとうございます! ほんとに一人だと遊びきれないくらいあるので、今後もたまにゲーマーを集めて話聞いていきたいなと思いました! ありがとうございました〜!

一同

ありがとうございました〜!

まとめ

長々と紹介しましたゲーマー達の討論はいかがでしたでしょうか?
作風や世界観もありますので左右されるところはありますが、皆さんの推しを見ると昨今のゲームUIの流行りも見えてきますね。

内容をまとめますと

・全体的に傾向としてはフラットデザイン寄りになっており、各パーツは線と塗りで構成されたシェイプが多い。構成要素は少ないが形状、色、アニメーションなどで世界観や作風を表現している。
・コマンド、スキル、Perkなどは文字だけでなくアイコンを添えることが多い。そのアイコン自体も作品ごとのコンセプトに沿ってデザインされている。
・大型のタイトルなどはさまざまな言語での展開を見据えた拡張性のあるデザインが求められている。
・グラフィックが美麗になってきたため、特にアクションゲームは状況に合わせて都度画面の情報量を把握してユーザーが見えやすいようにバランスを取ったUIUXを設定している。

といった所でしょうか。

「上記を意識すれば優れている」とは一概に言えませんが昨今のゲームタイトルに求められるデザインの傾向として大きくずれてはいないはず。
今後エンタクルゲーマーはゲームを遊びながら時代とともに変化するデザインにアンテナを張っていこうと思います!

また、私達エンタクルはWeb制作会社ではありますがアプリやゲームのUIUXデザインの実績もございます。 お悩みの際はお気軽にご相談くださいませ!

この記事を書いた人

黒瀧 崇

kurotaki

前の記事

シリーズ連載:5分でわかる「eスポーツ」-観戦編-

次の記事

いま、注目のアニメ公式インスタグラムアカウントとTikTokアカウント春アニメ編(2024)

Recommend

Projects