こんにちは！ちょこです！
このブログでは「ゲームUIを見てみよう！」というテーマでゲームUIを紹介しています。少しでもゲームUIに興味を持ってくれる方が増えると嬉しいです！
今回は「ブレイクマイケース」（以下「ブレマイ」）からパズル部分に視線が集中される仕組みを紹介します。視線の誘導って割と自然にデザインされているので、意識して見てみると要素分解が難しい部分だと感じました。
以下、目次です。
周囲と比較して彩度が高い
人は一般的に無彩色より有彩色、低コントラストよりハイコントラストのものに視線が誘導される特性があります。
「ブレマイ」の画面を見てみると、パズル部分は彩度やコントラストが高く、キャラや背景は彩度が落ち着いた色合いとコントラストでデザインされ、パズル部分に視線が誘導されるデザインになっています。
▲「ブレマイ」のパズル画面
- 誘目性とは？色の組み合わせや売場デザインへの応用例、視認性との違いを解説！ - アパラボ
- 【グラフィックデザインのコツ】~明度による視線誘導~｜FLAMo-Flat Motion Studio
- 色彩による誘目性の定量化に関する研究（2018）
パズル部分がよく動く
動く対象や動き方にもよりますが、人は動くものに視線が誘導される傾向があります。
「ブレマイ」ではパズル部分は明滅したりラインを動かすなどしており、背景は動かしていないため、パズル部分に視線が誘導されると考えます。
注意したい点としては、人は一度に一か所しか見ることができないため、目立たせたい部分を派手に明滅させたり動かすのが必ずしも効果的というわけではありません。
「ブレマイ」のように、目立たせたものを目立たせるために「何を動かさないか決める」ことも重要だと感じました。
▲「ブレマイ」のパズル画面
▲ピースが明滅し、ラインが動いている
面積が広い
半ば当然ですが、画面内で大きいものは視界に入りやすくなります。
「ブレマイ」のパズル画面を見てみると、パズル部分が画面の約半分を占めていることが分かります。
残りの半分は背景ですが、背景は画面の左右に分断されているため、ひとつの塊には見えず、面積比の割には視線の誘導は控えめになっています。
「引き算のデザイン」を利用
個人的に気付きにくいのが「引き算のデザイン」だと感じています。
例えば、ボードの周囲に境界線を引いていないのは引き算のデザインだと考えます。
もし、ボードに境界線が引かれ、線が太かったり明るかったら視線が誘導され、ノイズになっていたと推測します。
▲境界線を引かなくても境界が分かる配色
角丸と角の使い分け
矩形の角が丸くなっているのも重要な要素だと感じました。
角が尖っていると、人は本能的に危険なものだと感じ、視線がわずかに誘導されます。
スキル発動のボタンやピースのパーツなどは尖っている要素が含まれており、相対的に目立たせる必要がない「STOP」や「AUTO」などはやや丸みを帯びているデザインです。
▲尖っているパーツ
▲丸みを帯びたパーツ
ボタンが尖っていると直感的に危険だと感じ、触れることに抵抗感を感じる懸念もありますが、形状以外の要素を利用し、危険度を下げるような取り組みをしているようにも見えます。
例えば以下の要素が考えられます。
- スキル発動ボタンは頻繁に触らないため、危険に感じる頻度も少ない
- ピースは優しい色使いにすることで尖りを軽減し、丸みを醸し出している
▲シルエットは尖っているけど、優しい色使いで丸みを表現
「ブレマイ」のデザインを俯瞰してみると、目立たせたい部分に情報を足し続ける「足し算のデザイン」だけではなく、目立たせない部分の情報を省略する「引き算のデザイン」も利用し、パズル部分に視線が誘導されていると感じました。
また、ゲームUIは見るだけではなく、操作するグラフィックでもあるため、もしかすると視覚的な特性だけではなく、触覚的な特性も少なからず考慮する必要があるかもしれません。
以上です。
パズル部分に視線を誘導させたい際の見せ方の参考になれば幸いです。
このブログではこのようにゲームUIついて簡単にまとめて紹介しています。
他のゲームUIも紹介しているので、もし良かったら他の記事も見て行っていただけると嬉しいです。
当ページは株式会社coly「ブレイクマイケース」の画像を利用しております。該当画像の転載・配布等は禁止しております。
©coly
権利者さまへ
以下はコンテンツ利用に関する認識の説明です。
「ブレイクマイケース」のガイドラインを確認したところ、公式HPにて、ゲーム内で使用されている画像やスクリーンショット画像はWebサイトやSNSへ投稿しても良い旨の文章がありました。
主な参照箇所を抜粋します。
1）画像について
すべてにおいて当社もしくはゲーム公式と詐称しての活動や投稿、作品やキャラクターのイメージを著しく損なう行為はご遠慮ください。 当ゲームを題材としてウェブサイトの公開をされる場合や公式の情報を出す際には必ず下記のようにコピーライトの明記をお願いいたします。
これによりゲーム画面のスクリーンショットのブログの利用についてはガイドラインに従った前提で許可されている認識でおります。
画像利用、記事の内容について問題がありましたら、お手数ですがご連絡ください。
速やかに対応いたします。
