RHKplus BLOG.

【Illustrator】デザインのレイアウトに困った時に使える、黄金比・白銀比の話


今回のメニューはイラレクッキングというよりかは デザインテクニックの部類になります。

ネットで少し前によく見かけた、優れたデザインは 実は黄金比で作られている!的な内容。

当初はなにそれ!?と思って興味津々で見てたんですが、 実際の内容をみると、よくわからんのです。

グリッドを合わせて見せてはくれるものの、 そのグリッドがどう作用しているのかがわからない。

グリッドの線から離れてるじゃん! これじゃ使い方わからんよ! 自然物は黄金比で構成されている? ひまわりの小花の重なり方が黄金比? 知らんがな! フィボナッチ数列のらせん? どう使えと!なんだ!螺旋に合わせて レイアウトしろってか!?わけわからんわ! どんなデザインだよ!

と思ってブラウザをそっと閉じるわけです。

こちらとしては、その黄金比(白銀比)の情報は どう使えるのかという実践的な情報が知りたいのに、 載ってるのはどう使えと?という情報ばかり。

唯一なるほど、と思ったのは、 黄金比、白銀比の実際の比率。

黄金比 1:1.618...

白銀比 1 : 1.414...

ね?どう使えばいいかわからないでしょう?

そこで、比率をサイズに置き換え図にしてみました。

あれれ〜おかしいな〜。 丸の配置がなんだか良い感じにみえてくるな〜? というわけで丸だけにしてみました。

なるほど?なんかもうひとつ丸あると 良い感じになりそうな気が…

試しに大きい方の丸を1として1.618の比率のサイズの丸を追加してみました。

なんだか、バランスの良い何らかのオブジェクトができました。

…そこで気づいたんです。 黄金比、白銀比というものは、「比」という言葉を使うだけあって、 比べられる2つ以上のモノすべてに対して使えるものなのでは…と。

そこで、私が考えた、黄金比、白銀比の使い方をご紹介。

1.マージンに対して使う。

紙媒体のデザインで最初に行うと言っても過言ではない、 マージンの設定。

自分が新人の頃は、なぜかどんなサイズも基本は10mm!と教えられ、 「「「「YES SIR!!」」」」の掛け声のもと、 ひたすら血眼になって作業をしておりました…。

このマージン、情報量が多いものなんかはこの数値で良いと 思うのですが(スペースが無くて変えようがない)、 ポスターのような構成要素が少ないものなんかを この数字でやってしまうと、スッカスカなんですよ。

そういうときに使えるのが黄金比、白銀比!

A4の紙面を1.618として、

それに対して版面が1になるように版面を設定。

すると、縦横比の関係で天地と左右のスペースが揃わない…

そうだ!あんばいが良いほうの数字でそろえよう!というので完成した 黄金比マージンA4ver.

数字を変えればそのまま白銀比マージンも作れてしまうスグレモノ!

さすが自然に生まれた美しい比率だけあって このマージンでデザインを作ると不思議と余白を活かした 素敵なデザインになってしまうという…。

2.ランダムレイアウトのオブジェクトに

対して使う。

既出ですが、デザイン上、光などの飾りを使用したい時があります。

ランダムにレイアウトしつつ、それぞれのオブジェクトに大小の差をつけ 配置していく…

ランダムもそうですが、大小差をつける…基準がないから 加減がほんとにわからない! 加減がわからないから調節に時間がかかる!

そんなときに使えるのが黄金比・白銀比。

黄金比を使って大小差をつけて配置すれば、 レイアウトは適当でも大きさのバランスが良いから 見栄えが良いのです!

3.グリッドを作ってレイアウトで使う。

せっかく黄金比・白銀比を知れたんだから レイアウトにも使いたい! やだやだ!このデザインは黄金比を元に レイアウトしておりますって言いたい! こう思うデザイナーもいるかと思います。 えぇ、私がそうでした。 しかし、ネットに出回っている情報では、 使い方がわからん!ならば!使えるものをつくってしまえ! MY 黄金比・白銀比グリッドを…!

というわけで作ったのが、黄金比(白銀比)3分割グリッド。

A4サイズを1.618の比率として、1のスペースを4つ作り それぞれ4つのスペースを四方の隅に合わせると完成!

では、これをどうレイアウトに使うかというと、 まずは紙面レイアウトに必須のマージンと組み合わせます。

このグリッドのラインとマージンのラインを意識して、

レイアウトしていくと、おのずと良い感じにレイアウトができます。

では実際に、レイアウトに使うときはどうするか、 以下をご覧ください。

このグリッドに綿密に合わせていく必要はなく、 なんとなく合わせられるところは合わせていくスタンスで バランスよくレイアウトできます。 そして、どうしても気になるところはグリッドを無視して調整。

まとめ

はたしてここまで上げた内容が、 実際の使い方として合っているのかわかりませんが(オイ)、 一通り実際に試してみた感想は、 要素をかんたんにバランスよく配置できるようになったな… というものでした。 今まで感覚に頼ってレイアウトしていたところに 基準となるものができたことで、 迷いなくスムーズに作業が進むように。 作業のお供に黄金比・白銀比。 おすすめです。

Copyright (C) 2013 RHKplus co.,ltd. All Rights Reserved.

  • Twitter
  • Instagram