こんにちは！ちょこです！
このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！
今回は「モンスターハンター ライダーズ」、通称「モンハンライダーズ」から、長押しすると表示されるリングゲージのデザインの事例についてご紹介します。
「モンスターハンター ライダーズ」一部キャラなどのアイコンを長押しすると、詳細画面に遷移します。その際にアイコンの周囲にリングゲージが表示されます。
該当の画面はこちらです。
ガチャで獲得できるキャラクターの一部がアイコンで並んでいます。
画面上部にはアイコンが長押しすることができる旨が書かれています。
アイコン長押しで詳細を確認できます
長押し操作は一見して見落とすので、ユーザーの学習を手助けするという意味では文章による説明は有効な手段のひとつかなと思います。
実際にアイコンを長押しするとアイコンの周囲にリングゲージが表示され、画面が遷移します。
リングゲージが表示されていることで、どのくらいの時間長押しすれば良いのか、視覚的に目安にすることができます。
アニメーションで見るとこんな感じです。
アイコンが暗くなることで操作が受付中であることが仄めかされています。
また、アイコンとリングゲージの色のコントラストが高まるため、僅かながらリングゲージの視認性の向上にも繋がっているのかもしれません。
リングゲージ部分が一瞬過ぎるのと、サイズが小さかったので分かりやすくするために大きくしてみます。
ゲージが満タンになるの一瞬すぎますね。
ゲージの開始位置が６時の方向から始まっていたり、背景色と溶けているため、やや分かりづらく感じます。
ゲージ部分が分かりやすくするために色を変えたものがこちらです。
まとめ
まとめると「モンスターハンター ライダーズ」の長押しゲージについて感じたことは以下の６点です。
- 長押しすることでコンテンツが表示されることが文章によって説明されているため、ユーザーの学習コストを抑えている
- ゲージがあることでどの程度長押しするとコンテンツが表示されるかが分かる
- アイコンの周囲のスペースを利用することで省スペースに繋がっている
- アイコンが暗くなっていることでリングゲージの見やすくなり、操作中であることも 仄めかされている
- ゲージの開始位置は指で隠れない位置にする方が開始と終了が分かりやすい
- ゲージの色は背景に溶け込まないようにすると見やすい
以上です。
リングゲージをデザインする際の参考になれば幸いです。
このブログではこのようにゲームUIついて簡単にまとめて紹介しています。
他のゲームUIも紹介しているので、もし良かったら他の記事も見て行っていただけると嬉しいです。
権利者さまへ
以下はコンテンツ利用に関する認識の説明です。
「モンスターハンター ライダーズ」のガイドラインを確認したところ、権利者のカプコン公式HPにて、SNSやwebサイトへのゲーム画像の投稿は許諾されている旨の記載がありました。
カプコンのゲームの画像を動画サイトやSNS・個人サイト等に掲載してもいいですか？ (著作物に関するＱ＆Ａ) | 株式会社カプコン : サポート
主な参照箇所を抜粋します。
ご自身で撮影されたゲーム映像のスクリーンショットに関しては、動画投稿のガイドライン（カプコン動画ガイドライン）に沿った内容であれば、使用していただくことが可能です。
以下は上記のQ&Aにて示されているリンク先の画面のキャプチャです。
主な参照箇所を抜粋します。
【投稿できるもの】
- PCのキャプチャーボード・PCソフト（Steamクライアントを除く）など、ゲーム機やゲームの機能以外を使用する場合は、「ご自身がプレイした映像を編集する」「ご自身のコメントを付ける」など、ゲーム映像に独自の付加価値を付けたもの
【投稿できないものの主な例】
- 感想や意見などを付けずに、スクリーンショットのみ掲載したもの
4：タイトル個別でガイドラインを設けているタイトルはありますか？
現時点では、ございません。
10：ガイドラインの対象になるゲームソフトは何ですか？
機種にかかわらず、カプコンから発売されているゲームソフト（ゲームアプリも含む）全てが対象です。
画像利用、記事の内容について問題がありましたら、お手数ですがご連絡ください。
速やかに対応いたします。
