こんにちは、つしまです。今週はDMハガキやチラシの作成を行いました。入社当初に「デザインがのっぺりしてる」とフィードバックをもらったことがありましたが、当時はその意味をきちんと理解できていなかったように思います。
最近は「奥行き」がなかったんだときちんと解釈することができて、デザインを行う際は気をつけるようにしているので、デザインの「奥行き」についてまとめようと思います。
要素を重ねてレイヤー感を出す
タイトルや写真などの入れ込む要素をすべて見せようとして他とできるだけ被らないようにキレイに並べてしまうと、奥行きのないのっぺりとした印象になってしまいます。
メインビジュアルなどを思い切って他の要素と重ねてダイナミックなレイアウトにすると、インパクトも出てよくなりました。イベントの開催期間や住所など確実に伝えたい情報は被せない方がいいですが、商品名やタイトルなどを大きく配置した上で、画像と少し被せるくらいであれば問題ないと思います。
平面である紙媒体やWEB上に奥行きを持たせることで、デザインの質が上がりました。
ピンぼけした素材を上から重ねる
手前にピンぼけした素材を置くことで、パーツとの間に距離を感じさせています。
平面的な画面に奥行きを与えたいときや、写真の隅に写っているものを隠したいとき等に便利なテクニックだと思いました。
大小差をつけてメリハリを出す
要素を全て一緒のサイズにするより、大小差をつけることで動きが出て、楽しくポップな印象が強まったレイアウトになりました。真ん中の素材を核としてど真ん中に配置し、その周りにサブを配置していくことで無駄な余白もなくなり、うまくまとまりました。
グラデーションを足してみる
背景やイラストを同系色でまとめたら、全体的にボテっとした印象になってしまいました。
それぞれの素材にグラデーションをかけることで、ベタ塗りの時よりも立体感が生まれ、クオリティが上がって見えます。背景にグラデーションを加えたことによって、色が薄い部分と濃い部分のコントラストが生まれ、画面に奥行きがでました。
テクスチャを足してみる
背景にグラデーションをもってきても、物足りなさを感じてしまう場合があります。そんなときはテクスチャを入れることで改善しました。
左の例では背景に描画モード>オーバーレイでストライプのモチーフを入れてみました。デザインに空気感が出て、深みが増したように感じます。
また、ドロップシャドウで距離を遠くすることでより奥行き感が出ました。
さいごに
背景に単色を使用しても、シンプルで情報を伝えやすい・テキストの可読性を高く保てる、といったメリットがあります。奥行きのあるデザインが必ずしもいいとは限りませんが、デザインの手法の1つであることは間違いないです。
デザインによっては合うもの合わないものがあるとは思いますが、デザインがのっぺりとしてしまったときや、物足りなさを感じたときは、画面に奥行きを出すことでブラッシュアップしてみたいと思います。