レイアウトの基本

⇓クリックすると大きくなります

レイアウトにはルールがあります。

いわゆる「レイアウト」は制作をする上で基本中の基本。プロとアマチュアの差が一番出やすい部分でもあり、プロと言えどレイアウトが曖昧になっている人もいるのでしっかり基本を抑えておきましょう。

綺麗にするには意味がある

「レイアウトなんて別に」・・・とか

「なんとなく」・・・とか

考えてしまうかもしれませんが、レイアウトを綺麗にすることには意味があります。

それは

「見やすい」です。

これだけ情報社会になれば、見る人はコンテンツに対し何を伝えているものなのかを少しの時間だけで本能的に見ています。

つまり、作り手は一瞬で相手に内容を確実に伝えなければなりません。

↑トップの画像はレイアウトをルールに沿って構成したものです。

↓試しにレイアウトを崩したものが以下の画像です。

レイアウトを崩した画像

かなり大げさにしましたが、どうでしょうか?

このアンバランスなレイアウト。

何を伝えたいかというよりも見る気すら起こらないかもしれません。

わかりやすい例えでいうならパワーポイントなどの資料。

なんかうまく作る人と、内容はいいけど下手だね〜という人がいませんか?

資料作るのが上手な人と下手な人の差はこのレイアウトにあります。

見えない「力線」が鍵

何が違うのか?それは見えない力線に沿って文字や画像を配置しているかなのです。

力線とは、ガイド線とも言います。各テキストや画像をこの線を基準として揃えることで全体に秩序が生まれ、相手がどこを見ればいいかを案内してくれるのです。

力線(ガイド線)を配置して見ると↓

Photoshopでの編集画面 水色の線が力線(ガイド線)

各テキストの両端、上下を1ピクセル単位でガイド線に沿って揃えていきます。「何かしっくりこない」それは1ピクセルのずれだったりします。

こうすることで違和感のないレイアウトにすることができます。

アクセントカラーを使ってピンポイントに見せる

初めてこの画像を見たあなたはまず本能的にピンクの丸を見ているはずです。

適当に余白があったのでピンクの丸をいれて見たのですが、このピンクが違うところだったら?

↓変えて見ました

色の配置違い1

色の配置違い2

いかがでしょうか?目につくポイントが変わったと思います。

このピンポイントで引き立たせるカラーをアクセントカラーと言います。

今回はグレーとピンクのシンプルな作りですが、もう何色かある場合でもアクセントカラーを決めて引き立たせる表現をします。

基本的にはアクセントカラーは補色を使います。この辺りはアクセントカラーの項目でお話します。

デザイン無くして映像はできない

「いや、映像制作なんだけどレイアウトなんて関係ない・・・」と思いのあなた!

映像制作はデザインの延長であることを忘れずに。昨今では映像に必ずと言っていいほどテロップを入れますし、グラフィックスだけで作る映像も多いです。また実写のアングルや背景にもレイアウト力は必須です。

そのためにはポスターやチラシの制作もできた方が良いんです。というか、映像制作ができればそう言った紙系の制作(DTP)、WEBデザインも自ずとできるようになります。逆にデザイナーの方は映像制作はチョチョイのちょいでできてしまいます。

ポスター制作事例 撮影からデザインまで

映像は画像デザインのアニメーションだと考えてください。なぜ、映像編集は時間がかかるのか?それは最初に一画面をデザインしてその一画面のパラパラ漫画を作って行くからなのです。根気のいる作業ですが、デザイン性を大切にすることで、映像クオリティは上がりますし、視聴者にこちらの意図が的確に伝わります。

まとめ

「レイアウトは力線に沿って配置」それだけです。WEBサイトや街で見かける広告物を見てください。必ず綺麗にこのルールにしたがって制作されています。

このレイアウトのできでクオリティの差が大幅に変わります。

視聴者にどこを見てもらいたいか、どのような目の動きをするかを想定して編集をしていきましょう。

最後に、ここまで言ってなんですが・・・

力線にこだわりすぎると、編集時間が長くなったりインパクトがなくなったりもします。今回はお伝えしていませんが文字詰めなんかは最後は感覚であったりもします。

あくまで基本的なルールとして頭の中に入れておいてもらえれば大丈夫です。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする