Webデザイン

これは押さえておきたい!デザインちょい技【写真編】

これは押さえておきたい!デザインちょい技【写真編】

押さえておきたいちょい技、第二弾・写真編をご紹介したいと思います。

第一弾:これは押さえておきたい!7つのデザインちょい技【文字編】

多くのデザインにおいて、写真は最も重要な素材です。メイン素材となる写真に少し補正を加えるだけで、デザイン全体の品質がグッと上がります。

また、写真の利用には著作権など当たり前の話ではなく、編集過程でやってはいけないマナーがあります。
今回はちょい技だけでなく、意識して守りたいマナー的なものも紹介します。

ちょい技シリーズで紹介するのは、デザイナーが制作時に行っている実際の技、知恵ばかりです。簡単に編集するだけで見た目をぐっと上げることができる技ですので、ぜひやってみてください。

写真は反転させない方が良い

特に人物の写真は反転させない方がベターです。
人間の顔は左右非対称です。反転すれば違和感を感じることがほとんどです。
(左右反転させた方が可愛く見えるという意見もあったりしますが…)
人の写真を反転させた場合。反転前と反転後の比較

また、着物(着物の左前は縁起が悪い)やスーツ・シャツの合わせ方向(女性は左前・男性は右前)など、逆になってしまうと駄目な場合も多いです。
その他、反転するとNGな例がありますので例をあげてみます。
 ・車(ハンドルの位置)
 ・文字(看板や服のデザイン)
 ・料理(配膳や箸の置き方)
 ・信号機
車、文字、料理など反転させないほうがいい写真は多い

逆に、空や海など反転しても特に気にならないものもあります。
注意する箇所さえ押さえておけば問題なく使えますので、反転する場合は押さえるべきところは押さえて、上手に使いましょう!

写真補正でトーンカーブをS字にし、メリハリをつける

少しトーンカーブを調整するだけでメリハリが付き、写真のくすみがとれて素人感がなくなります。
今回はphotoshopの画面でご紹介します。

まずは何もトーンカーブを触っていない状態の写真です。
Photoshopのトーンカーブ_編集していない状態
トーンカーブを編集していない猫の写真。若干くすんで見える

トーンカーブをS字変更します。
Photoshopのトーンカーブ_S字に変更した状態
トーンカーブをS字に変更した猫の写真。くすみが取れてメリハリがある

写真のくすみがとれてくっきりしました。
トーンカーブを編集した写真、編集していない写真の比較

トーンカーブの中央から下半分を下げて、上半分を上げるとコントラストが高くなります。
やりすぎてしまうと色が飛んでしまうので注意が必要ですが、これをするだけで写真が一気に引き締まります。

人物画像は少し黄色っぽくする

人物画像の色補正も様々な方法があり、チュートリアルも多くネット上にありますが、
今回は人物写真の印象がさらっと良くなる方法をご紹介します。

色がかぶっている(色が特定の色に偏った状態)写真の場合は先に色被りをなくしてから補正を行ってください。

若干肌に黄色みを足してあげる(青色を抜く)と血色が良く見えるようになります。
人の写真の補正。黄味を足すことで血色がよく見える

色の補正の方法は色々ありますが、今回はトーンカーブを使いました。
トーンカーブのブルーの項目を少し下げます。
トーンカーブを使った人物写真の修正例

フィルターのCamera rawフィルターを使うと分かりやすいかもしれません。

Camera rawフィルターによる人物写真の修正

一概にすべての画像を血色良くするわけではないのですが、血色が良い方が自然なイメージに仕上がる印象です。
透明感を出したり、ビジネス感を出したいような画像は青みを足したりします。
場面によって使い分けをするのが良いでしょう。

デザインちょい技【写真編】まとめ

今回は写真を使ったデザインのマナーとちょい技を少しご紹介しました。

写真はデザインの重要な素材で、写真の補正一つで画像の見栄えがぐっと違ってきます。
マナーの部分は意識しておかないと気付かない場合もありますし、小さなマナー違反が大きな違和感、品質低下に繋がります。
よかったら参考にしてみてください。