minote

Photoshop/UI/雑記ブログです。

【UIデザイン】レイアウトの際に重心をどこにおくか

ゲームの画面は情報量が多いので、これをどう見やすく
わかりやすくデザインするかがUIアーティストの腕の見せ所であります('◇')ゞ
今日はレイアウトを考えているときに「どうもしっくりこない」を
解決する手段の1つをブログに書きます。

下に重心を置くと落ち着いたレイアウトになる

デザインを考えるときに、余白を均等にとることがあると思います。
例えば以下のような (上下の幅と、文字などの隙間をきっちり均等にわけたものです。) f:id:yuumin5220:20190601121049p:plain

ただ、数値的には正確に余白を取っていたとしても
・なぜか上が詰まっているように見える。
 →落ち着かない( なんかザワつく )ことが起きたりします。抽象的な表現ですが・・。

そんなときは以下のように調整すると、安定感が出ます。
f:id:yuumin5220:20190601125838p:plain 枠内の要素を全体的に(2~3ドット)下げました。
微妙な差ですが、見え方はだいぶ変わってきます。

身の回りにある商品を見て気づいたこと

パッと見て落ち着きがあるなと感じたデザインは以下のようなレイアウトが
多かったです。紙面の下のほうが情報の重さや量が多い。
f:id:yuumin5220:20190601141406p:plain

情報量が多い内容をなるべくきれいに配置したいときは、今回ご紹介した
上は詰まりすぎるのは良くない。下は詰まっていても良い。を解決の1つとして
取り入れてみると、上手くいくかもしれません。