Webデザイナーに写真スキルが必須なのは前記事で説明しました。。魅力的な写真を使用することで、ユーザーの関心を引き、デザイン全体の品質を高めることができます。
この記事では、覚えておいた方がいい写真スキルを5ステップで簡単に紹介します。
写真撮影のスキルを持つウェブデザイナーはまだ少ないのが現状なので覚えて市場価値を高めましょう!
STEP1: カメラの基本操作を覚える
まずは写真を撮る際に意識する基本設定について解説します。
シャッタースピード
シャッタースピードは、被写体の動きをどのように捉えるかを決定します。速いシャッタースピードは動きを止め、遅いシャッタースピードは動きをぼかすことができます。ウェブデザイナーにとっては、どの動きを強調するかが重要です。
ではシャッタースピードは、どんなシチュエーションでどのように変化する(してしまう)のでしょうか。基本的には、以下のような考え方が出来ればシャッタースピードについての理解を深められるでしょう。
シャッタースピードを早くする(できる)場合
①被写体が明るいとき
十分な明るさが被写体にある場合は早いシャッタースピードでも明るく写せます。白い砂浜や日中の雲などを被写体にすると、かなり早いシャッタースピードになります。このような物を遅いシャッタースピードで撮影すると、真っ白に「白飛び」した写真になってしまいます。
②物の動きを止めて写したいとき
具体的には、以下のようなシーンで速くします。
- スポーツなどで動く人の写真を撮りたいとき
- 新幹線や電車など、速く動く被写体を撮りたいとき
- 滝や川など、水が流れる景色の水しぶきまで撮影したいとき
特に動きのある被写体を撮影をするときは、シャッタースピードが遅いと確実に被写体ブレを起こしてしまいます。写真がブレてしまうと修正できないため、できる限りシャッタースピードを速くしてブレを防止するのがおすすめです。
▼シャッタースピードを早くして表現している写真
シャッタースピードを遅くする(できる)場合
①被写体が暗い場合
十分な量の明るさが被写体に無い場合は、シャッタースピードを遅くすると明るく写せます。
ISOを上げることでも明るくできますが、あまり上げるとノイズが目立つようになってしまいますのでシャッタースピードを遅くして対応します。
②物の動きを表現したいとき
露光時間中は、映し出されている物の動きがすべて記録されます。三脚で撮影して物の動きを記録したり、被写体のみをレンズで追い背景の動きを表現する流し撮りをすることなどで物の動きを表現できます。
露光時間:光をセンサーに焼き付け描写する時間
▼シャッタースピードを遅くして表現している写真


どちらも見たことがある写真だと思います。滝や波などの水の動きを滑らかに表現したり、車のライトの動きを線上で表すことで写真に動きを表現したりできます。
絞り(アパーチャ)
絞りは写真のボケ感や被写界深度に影響を与えます。背景をぼかして被写体を際立たせるか、または全体をシャープに撮影するかを決定する重要な要素です。



ISO感度
ISOは、カメラがどれだけ光に敏感かを示します。低いISOはノイズの少ないクリアな画像を提供し、高いISOは暗い場所での撮影に適しています。
夜景を撮影するには、わずかな光を取り込む必要があるためISO感度が高い方が有利です。ISO感度が低いと暗い写真になったり、光を取り込むためにシャッターを少し長めに開く必要があり、シャッター速度を長くするとそれだけブレのリスクも高まります。
また、ISO感度が高ければ、少ない光でもより明るく写すため、シャッター速度が短いスポーツの撮影や、暗い場所でフラッシュなしでの撮影ができるなどのメリットがあります。
一方、ISO感度をあげすぎると、ノイズが多くなり、ざらついた印象の写真になってしまいます。そのため、暗い場所などで感度が必要な場合に設定を上げて、それ以外の通常時は400以下にするのがおすすめです。
ただ、これはカメラの性能により異なるため、高性能なカメラではISO感度を上げてもノイズが少ないこともあり、そういった心配もありません。
ホワイトバランス
ホワイトバランス(略してWB)は、別名「色温度」ともいいます。青く冷たい色は寒色系、赤く暖かい色は暖色系と言いますよね。写真が自然な色に見えるようにするには、ホワイトバランスを調節します。
最近のカメラではオートホワイトバランスが優秀なためAutoで設定すればいい場合が多いです。
ホワイトバランスの単位は、K(ケルビン)といいます。
晴天時 5200K
曇天時 6000~7000K
蛍光灯 4000K
白熱電球 3000K
数値が高いほど青く、低いほど赤くなります。
曇天時が一番青く映ると覚えておけばOKです。
STEP2: 構図の基本を覚える
三分割法
画面を9つのエリアに分割し、重要な要素を交点に配置することでバランスの取れた写真を撮影できます。ウェブデザインにおいても、視線を誘導する効果が得られます。
リーディングライン
視線を導くための線を利用することで、写真に動きや方向性を持たせることができます。これにより、ユーザーの視線を自然に誘導することが可能です。
フレーミング
自然のフレーム(ドア、窓など)を使って被写体を引き立てるテクニックは、ウェブページ内での要素の配置にも応用できます。
対称性とバランス
対称的な構図やバランスの取れた構図を作成することで、調和の取れた写真を撮影できます。ウェブデザインでは、ページ全体のバランスも重要です。
背景の選択
被写体を引き立てる背景を選ぶことで、写真全体の印象を大きく左右することができます。背景と被写体のコントラストを考慮し、適切な配置を心がけましょう。
STEP3: ライティングの基礎を覚える
自然光
太陽光の使い方、時間帯による光の違いを理解することは、写真撮影の基礎です。特に、朝夕の「ゴールデンアワー」は温かみのある写真を撮るのに最適、曇りの日の方が撮影にむいている場合があるなどなんとなくでもいいので押さえておきましょう。
照明
スタジオライト、LEDライト、フラッシュの使用方法を学ぶことで、特定の雰囲気やムードを演出することができます。人工照明を使うことで、より写真に深みをもたせることができます。
光の方向
順光、逆光、側光の効果を理解し、被写体の立体感や陰影を強調することができます。適切な光の方向を選ぶことで、写真の印象が大きく変わります。
光の硬さ
ハードライトとソフトライトの違いを理解し、用途に応じて使い分けることが重要です。ソフトライトは柔らかい印象を、ハードライトはシャープな印象を与えます。
反射板とディフューザー
光を反射させたり拡散させたりして、照明を調整する方法を学びましょう。これにより、光の強さや方向を柔軟にコントロールできます。
STEP4: ポートレート撮影を覚える
ポージング
被写体の自然なポーズを引き出す方法を学びます。自然なポージングは、人物の魅力を最大限に引き出すために重要です。
フォーカス
目にフォーカスを合わせる技術を習得することで、被写体の印象を強く残すことができます。目のフォーカスは、ポートレートの中で最も重要な要素の一つです。
背景のぼかし
被写体を際立たせるために背景をぼかす方法(浅い被写界深度)を学びます。これにより、被写体の存在感が際立ちます。
表情
被写体の自然な表情を引き出すコミュニケーション技術も重要です。リラックスした雰囲気を作り出し、被写体に自信を持たせることで、より良い写真が撮れます。
ライティング
ポートレート撮影に適した照明技術(レムブラントライティング、バタフライライティングなど)を学びましょう。適切なライティングが、被写体の顔立ちや雰囲気を一層引き立てます。
ステップ 5: 編集と補正
ここからはウェブデザイナーが必ず覚えておかないといけない工程です。撮られた写真の修整はデザイナーの仕事です。Adobeのphotoshopやlightroomなどのツールを利用してそれを行います。
基本編集
露出、コントラスト、彩度、シャープネスの調整を行い、写真をベースラインで最適化します。これにより、写真の見栄えが劇的に向上します。そのままでも十分つかえる写真も、ウェブサイトやバナーの色味や他の写真の雰囲気に合わせて修正することが多くあります。
色補正
カラーグレーディングとホワイトバランスの微調整を行い、写真の色味を統一し、デザイン全体に調和を持たせます。ウェブデザインにおいても、統一感のあるビジュアルが求められます。
トリミング
構図の最適化のためにトリミング技術を使用し、無駄な部分を排除して視覚的なインパクトを強化します。トリミングにより、焦点を絞った力強い写真が作れます。
レタッチ
肌の修正や不要なオブジェクトの除去など、詳細なレタッチを施してプロフェッショナルな仕上がりに。特に、ポートレートではレタッチ技術が重要です。
フィルターとエフェクト
特定のスタイルやムードを演出するためのフィルターとエフェクトの使用も重要です。
フィルターの適用は、写真に一貫したスタイルを持たせるための手段として使ったり、例えばバナー作成の場合に上に文字を置きたい場合み見えにくかったりするのでその際に使われることがあります。
まとめ: 撮影スキルでデザインの幅を広げよう
写真撮影のスキルは、ウェブデザインにおいて強力な武器となります。
上記の5つのステップを習得することで、より魅力的でインパクトのあるビジュアルを作成し、デザイン全体の質を向上させることができます。また写真撮影に立ち会うケースも多いので知っておくとかなり役に立ちます。
紹介した基本的な要素を押さえて実務の役に立てましょう。