Blog スタッフブログ

デザイン

【デザイン】奥行き感がスゴイ!ぼかしを活かした画像加工レシピ

こんにちは、Webデザイナーのそいです。ここ最近で食べ物や飲み物のプロモーション用のビジュアルで、奥行き感のある表現をよく見かけるようになりました。商品がより魅力的に見える+モチーフがいっぱいでボリューム感がアップする+オシャレに見えるというメリット満載な一方で、作り方が難しい印象もありますよね。

今回はそんな奥行き感のある表現方法の簡単な手順を紹介していきたいと思います。

STEP1.画像と参考イメージを用意する

今回はメインモチーフをパフェにします。遠近感を出すために必要なサブモチーフ、背景画像も時短のために用意すると良いでしょう。サブモチーフはその商品に使われている材料、今回であればチョコレートやウエハース、ベリー系のフルーツを用意しました。

画像は背景が透過しているものを用意すると使いやすいです。

また、バランスを見るための参考サイトもチェックしておくと作りやすくなります。

参考例:ゴンチャ(Gong chaあふれる巨峰

STEP2.キャンバスにメインモチーフを配置する

編集ソフトはPhotoshopを使っています。制作工程を画像で説明していきます。

まずは画像をキャンバスの下側・中央あたりに配置します。

STEP3.影をつける

メインモチーフに影をつけます。後で色を変えるのですが一旦黒で影をつけていきます。

STEP4.サブモチーフを配置する

バランスを見ながら配置していくことがコツです。大きなもの・小さいものと2つに分けて配置していきます。

まずは大きめのモチーフを配置していきます。対角線上に配置をしてバランスをとりました。

奥行をつけるために右側のチョコのモチーフはパフェの後ろにくるようにしています。

次に小さいモチーフを配置していきます。隙間やバランスの強弱を意識しながらバラバラと並べていきます。角度はあえて揃わないよう無造作に配置するとおさまりが良くなります。

元の素材の画質が少し荒いのですが、奥行きの強弱は後でつけていくのでサブモチーフも画質が良いものを選びましょう。

STEP5.背景をつける

背景を入れます。今回は苺を連想させるピンクの背景にしました。背景にも質感が出せるように中央が明るくなるように少し調整します。

パフェの影が黒すぎると馴染まないので、くすんだ暗めの赤を使って馴染ませていきます。

STEP6.モチーフに奥行きをつける

奥行きをつける工程は終盤になります。色・配置が決まったら一部のモチーフをぼかしていきます。

ぼかし方をゆるく・きつくと強弱をつけることでより立体感が増します。

STEP7.仕上げ

仕上げに明るさ調整を行います。上から光があたっているように光源をつけると背景・モチーフそれぞれが上手く馴染みます。

モチーフの暗い部分も明るくして完成です。

まとめ

いかがでしょうか。今回は奥行き感のあるキービジュアルの作り方を紹介しました。よく見かける表現でやってみたいけど難しいかも…という方にぜひ試してみてもらいたい手法です。最初のうちはバランス感が難しいかもしれませんが作れば作るほどに磨きがかかる&楽しく感じる手法です。

今回もご一読いただき、ありがとうございました。