ドロップシャドウ
|
| |
最近のPhotoshopはプルダウン一発でドロップシャドウがつけられますが、いちいちすべての写真に適用するのは面倒だしファイルサイズも増えてしまいます。おまけにhtmlの背景色を変えたくなったら、またすべての写真を作り直し……こんな問題も、テーブルと組み合わせれば解決。写真の上下左右に、htmlの背景色になじんだシャドウだけを貼り付けるだけでいいのです。
１）Photoshopで写真より大きめの新規書類を作成
２）背景レイヤーの色をhtmlの背景色でぬりつぶす
３）ダミーとして、実際に貼り付ける写真を1枚コピーしてペースト
４）その写真レイヤーに対してドロップシャドウを適用
５）ガイドラインを引き、シャドウ部分を切り出す（額縁の作成と手順は同じ）
ここでのポイントは２つ。まず「ドロップシャドウをhtmlの背景色となじませる」こと。
テーブルに貼ったときに違和感が出ないように合わせておきます。そしてもうひとつが「シャドウを少し大きめに切り出す」こと。ぱっと見ると分からないのですが意外にシャドウ部分は広いので、ズームツールを使って拡大表示しシャドウ部分が切り落とされないよう気をつけます。ほんの少し切り落とされているだけでも、htmlに貼り付けるととても目立ちます。人間の目はいい加減なんだか細かいんだかよく分かりませんね。
あとはテーブルを含んだhtmlをコピーして量産し、写真を貼り替えるだけでドロップシャドウのついた写真ができあがります。
完成サンプルはこちら>>
シャドウ部分は独立した画像なのですが、違和感がありません。やっぱり人間の目はいい加減です。
|
| 【Point】 |
125：写真の額縁やドロップシャドウは、テーブルと画像パーツを使って表現せよ！ |
|
|
|
