デザイン制作で画像がないときは撮影しよう!イラストにも使える構図のコツ

WEBデザインをしていて、思った通りの画像がないときって、たまにありますよね。有料素材を使うことができれば、かなり選択肢は拡がるんですが、お金がかけられないときもあります。そんな時は、思い切って、自分で撮影してみてはどうでしょうか?私は大学時代に写真の授業を1年だけ受講したことがありますが、そんなことも忘れたくらいカメラは素人です。そんな私が、「とりあえず」やってる方法をご紹介させていただきますね!

WEBデザインで画像がないときは撮影しよう!イラストにも使える構図のコツ

デザイン画像に使う写真は、文字を入れる前提の構図をイメージする

WEBデザイン用に画像を使用する場合、写真そのままを掲載するというよりは、メインバナーや装飾として使うことが多いです。なので「キャッチコピー/文字を重ねる」ことを前提とした、撮影のコツをまとめてみようと思います。これは写真だけでなく、イラストにキャッチコピーやタイトルをプラスする構図にも使えますね。

今回は自分で撮影してみました。しかも家にあるもの限定です。どうなることやら・・・。

人物やアイテムなどを撮るときは、とりあえず3分割交点構図で撮る。

写真の世界では「3分割交点構図」は基本中の基本のようです。カメラの画面で縦横に3分割し、交差する点にメインを持ってくる構図です。ここに配置するだけで、ぐっとバランスが良くなりますね。交差ポイントの一つにメイン被写体を持ってくると、その他の部分は余白ができますので、その部分にキャッチコピーを置けばいいわけですね。

WEBデザインで画像がないときは撮影しよう!イラストにも使える構図のコツ
家のおもちゃを集めてみました。

その他にも、「フィボナッチらせん」の中心にメイン被写体を持ってくるのもコツのようです。これは確か大学の講義でも教わった覚えがあります。なお、この比率は黄金比(比率:1:1.618)で成り立っており、この渦の中心が最も「視線」の行く場所だそうです。メイン画像内に文字やボタンを配置する場合は、この中心に画像(切り抜きなど)やボタンを配置するのも良いですね!

WEBデザインで画像がないときは撮影しよう!イラストにも使える構図のコツ
この曲線が「フィボナッチらせん」です。

視線誘導したいときは、対角線・曲線の構図で。

対角線上に斜めに走る線を作る構図と、C字やS字などカーブを使って遠近感を持たせる構図です。この動きのある構図の写真は、視線誘導をしたいときに効果的だそうです。実際に動く物を撮るのではなく、構図で動きをつけるのですね。何を撮ればいいのか迷う時は、逆に、街路樹など並んでいるものや、曲線を描いているものを探せばいいですね!この構図の写真には、視線の動く場所に、読んでほしい文字を配置するといいですね。

WEBデザインで画像がないときは撮影しよう!イラストにも使える構図のコツ
メイン被写体と照明の位置を対角線にしてみました。

建物系はとりあえず真正面の構図で。

対象物を真正面や俯瞰(ふかん/真上からの構図)で撮るとかっこいい、美しい写真が撮れます。しかし実は、正確に真正面に合わせて撮影するのは、かなり技術がいるんですよね。なので「ずれ」がわかりやすい「物」ではなく、風景を撮影する時に使うといいですね。例えば、樹木や建物、ちょっと古い窓やドアなど、自然な雰囲気を組み合わせれば、正確なシンメトリーでなくてもかっこいい写真が撮れます。この真正面の構図の写真の上に、中心あわせで文字を乗せれば、しゃれた感じになりますね。

WEBデザインで画像がないときは撮影しよう!イラストにも使える構図のコツ
被写体を置くと、なんとなく物語性が生まれます。やはり、きっちり真正面は難しいですね。

子供やペットを撮るときは、とりあえずローアングルで。

子供やペットの写真は便利ですよね。写真画像だけでかわいさが演出できます。そんな子供やペットを撮影するときは、腰を下ろして低い姿勢で撮ると、いつも見ているのとは違う写真が撮れます。子供やペットが身近に感じれるような写真や、動きがあれば迫力のある写真になります。あと、日用品などの商品でもやや低いアングルで撮ると、ぐっと存在感がでますね。

WEBデザインで画像がないときは撮影しよう!イラストにも使える構図のコツ
我が家の愛犬です。いつもと違う迫力です。

とりあえず壁を撮る。そこに植物やアイテムを添える。

ネタがないときは、良い雰囲気の壁を撮影して背景画像にしちゃいます。そこにメイン被写体を入れたり植物を入れると、おしゃれな雰囲気になります。壁なので、高さのある物を撮るときに効果的ですね。その他、フェンスや窓があってもいいですね。もし壁に映る影が、面白い形をしていたら、シャッターチャンスです!

WEBデザインで画像がないときは撮影しよう!イラストにも使える構図のコツ
困った時は白い壁を背景に。自前のヴァイオリンです。

その他、いつも気をつけているポイントは、

・人物写真は、とりあえず屋外か窓際で撮る→屋内での光の調整が難しいから
・一眼レフのデジカメを使う→絞り優先で被写体にピントを合わせるだけで、奥(もしくは手前)がぼけていい感じになるから
・露光はやや暗め~普通くらいで、何枚か撮っておく→あとでPhoshopで加工しやすいため
・ホワイトバランスはとりえず「オート」で→設定が難しい時は、カメラの性能にまかせる

こんな感じです。なんだか適当な感じですが(笑)意外と上手く撮れるんですよね!

在宅仕事での撮影なら、家にあるものを最大限に利用する

在宅でフリーランスのWEBデザインをするなら、家で観葉植物を育てておくことをオススメします。こういう時に本当に便利なんです。卓上の小さいものでもいいですね。おしゃれなインテリア小物だけでなく、意外に100円均一にも、写真に添えるいい感じのアイテムがけっこうあったりしますよ!

私は、いままでの職場ではずっと一眼レフのデジタルカメラを使用していました。そのため、家でもずっと一眼レフのデジタルカメラを使っています。キヤノンのEOS Kiss X7です。今はスマホでも十分良い写真が撮れるそうですが、私はどうもデジカメを使いたくなります。性能の良いデジカメの一眼レフが安く手に入るようになりましたしね!

この写真の構図のコツはイラストの構図としても使えますね。特に人物のイラストや、背景イラストを制作するときは、こういった構図を使うといい感じになりそうです。私も、早速やってみようと思います!というこことで「とりあえず」こう撮影すればいい感じの写真が撮れる方法のご紹介でした!ぜひ、ご参考にしてみてくださいね。

あなたもフリーランスはじめませんか?

フリーランスのデザインのお仕事探しのお手伝いをしてくれるサイトです。専門のエージェントも!登録は無料なので、まずは気軽に登録してみてくださいね。
※デザインのお仕事を見てみる⇒レバテッククリエイター

この記事が参考になったら応援よろしくお願いします!

次におすすめな関連記事はこちら

コメントを残す

メールアドレスが公開されることはありません。