自主練の記録

バナー模写 #31.野村證券

f:id:ne-ochi:20181125203315j:image f:id:ne-ochi:20181125203312p:image
Time:30min
Size:300×250
Tool:Photoshop

10月末に模写したバナーがでてきたので、今回はデザインの考察をします。
(お蔵入りでもよかったのですが、好きなデザインなので紹介させて下さい)

今回のバナーのポイント

  • 横分割でメリハリのあるレイアウト
  • 主役にフォーカスした写真
  • ゴルフボールをアイコンに使っている
  • 流れるような視線誘導
赤と緑のコントラストが効いていて、さわやかでメリハリが効いたデザインです。ゴルフボールをアイコンとして使う発想も素敵です。見やすくて伝わりやすい、好みのデザインでした。以下、各ポイントの詳細を簡単に書いていきます。

横分割でメリハリのあるレイアウト

赤と緑のコントラストが効いた横分割で、文字と写真のメリハリがついています。赤はバックの写真と松山選手のユニフォームに合わせて高彩度の赤を使用しています。白い文字は装飾無しでもはっきりとよく見えるので、シンプルでメインコピーが伝わりやすいです。

主役にフォーカスした写真

写真には色鮮やかな緑色の背景と松山選手が写っています。主役の松山選手にフォーカスすることで、もしも松山選手を知らない人が見たとしても「この人だ」と理解しやすいです。背景は鮮やかなグリーンで爽やかさや開放感、空間的な広がりを感じさせます。

ゴルフボールをアイコンに使っている

「5組20名様」のアイコンがゴルフボールになっています。丸い形を利用した面白い使い方だと思いました。このひと工夫でゴルフに関連するバナーであることも伝やすくなります。

流れるような視線誘導

視線が上から下に流れるように、インパクトのある赤背景ゾーンから下の方にかけて文字が少しずつ小さくなっていきます。情報の優先順位がはっきりしていてスラスラ読めます。

学んだこと

今まで写真を使った横割りレイアウトをする場合、なんとなく空間の広がりを演出するために3方裁ち落としで写真が上、文字スペースが下というように配置していました。今回、上に目立つ赤の文字スペースを作ることでより目に留まりやすくなり、赤と緑でコントラストがついているため、ロゴの部分がシンプルな白なら2方裁ち落としでも圧迫感がなく、空間的な広がりが出せることがわかりました。

最後に

今回模写したバナーは赤と緑のコントラストが効いてメリハリあるレイアウトでした。今まで苦手意識があった写真の2方裁ち落としレイアウトでしたが、配色の工夫によって空間的広がりが出せたりもすることを学びました。配色って奥深いです。レイアウトや配色についてもっと勉強したいと思いました。
独学×デザインの本を発売中!
「独学の流れ」と「デザインの独学方法」について
まとめた薄い本を作りました!現在販売中です!

本の販売ページはコチラ