影付け(ドロップシャドウ)


文字に斜め上方から光が当たっている様に影を付けてみます。
非常に簡単な手法のわりに平面であるはずの画面に「奥行き」を作り出すことができ、効果的に使えます。



この文字に影を付けましょう。
右下に影を入れますので、文字は画面一杯にせず、
移動ツールで左上に移動させてスペースを空けておきます。


文字の入っているレイヤーをコピーします。パレットの[レイヤー1」をドラッグして部分にドロップします。
これは縁取りでやりましたので簡単に出来るでしょう。
下の「レイヤー1」をクリックして加工するレイヤーを変更します。
ブラシマークは「レイヤー1」に付きましたね?ここまではまったく縁取りの時と同じです。

このコピーを使って影になる部分を作りますので、レイヤー1の文字を黒に変更しましょう。
[イメージ] -[色調補正] - [色相・彩度]を選択します。
ダイアログボックスが開いたら明度のスライダを一番左にずらします。サンプル色が黒くなったら[OK]を押します。

レイヤーパレットの [透明部分の保護]がチェックされていないことを確認したら
[フィルター] - [ぼかし] - [ぼかし(ガウス)] を選択します。
[透明部分の保護]がチェックされているとぼかしが働きませんので注意して下さい。
ぼかす大きさは光が当たる文字と影が出来る面との架空の高さや光の強さ、背景色などに関係してきます。
1回ではうまくいかないかもしれません。何度かやってみて感じをつかんで下さい。
それではスライダを左右に振ってみて適当と思われる量に決めましょう。
普通のサイズでしたら影が濃過ぎると思いますが、影の濃さは後で修正できますので
ここではぼかしの量のことだけを考えて下さい。今回は5.0ピクセルぼかしました。

では光源の方向を考えて影をずらしましょう。をクリックして移動ツールに持ち替え、
ドラッグ&ドロップで影のレイヤーをずらします。
影のレイヤーだけでなく、画面全体のバランスを考えて文字のレイヤーも移動して調整します。
両方のレイヤーを何度か移動してみる事で画像全体のバランスを取ります。

文字と影の位置(架空の高さ)や、架空の光源の位置によっては影が濃すぎるでしょう。
次に影の濃さを調整します。影のレイヤーに移り、レイヤーパレットの「不透明度」スライダを調整します。
数字が小さくなるほど影は薄くなって行きます。
文字と影の当たる面の架空の高さや柔らかい光を当てた感じにしたい場合は影を薄くします。
この例では75%に設定してみました。
最後にページの背景を画像の背景として入れて不自然さを目立たなくします。

#この部分は HTMLとの兼ね合いもありますので、背景は透明色にしてみたりとご自分のHPに合わせてみて下さい。

まず、背景用にレイヤーを作っておきます。レイヤーパレットの下の方にある 「紙のマーク」 部分をクリックします。
背景用レイヤーを作ったらそれが一番下になる様にドラッグ&ドロップで移動します。
ここで壁紙に使っているファイルを開きます。[範囲選択] -[全てを選択] して、[編集] -[パターン定義] をしたら
ファイルを閉じ、加工中のファイルに戻ります。この時、スワップしても [メモリをクリア] は絶対にしないで下さい。
では背景の画像を入れます。[編集] -[塗りつぶし] を選択し、
「内容」は「パターン」を使用、「不透明度」は100%、「描画モード」は「通常」で実行します。
背景画像で塗りつぶされたら、文字との不自然さが無いかを確認して、これで出来上がりです。



戻る