コンテンツのトップページへ プロが教える
写真レタッチ講座
第23回 素敵な壁紙を作ろう <1>
〜 2枚の背景画像の合成 〜 2004/04/14
 
新ドメインオープン記念の大(?)プレゼント!
まずは素材をダウンロード
ふたつの写真をひとつにまとめる
ふたつの写真の重なる位置を決める
ビル群と海の境目を作る
ビル群の色調を海にあわせる
   
  素材&壁紙ダウンロードページ
 < メルマガ読者専用 >

写真レタッチの
テクニックを磨くなら
プロが教える写真レタッチ講座
フォトショップの
小技を覚えるなら
Photoshop Tips & Manual
Clickで拡大
 
  ■新ドメインオープン記念の大(?)プレゼント ひとつ前のページに戻るこのページのトップへ  

●壁紙いかがですか?

  澤口留美のプロフィール 薮田織也のプロフィール
  澤口留美 薮田織也

スタグラ読者の皆さん!お久しぶりです。
ところで皆さん、気がつきました?スタグラのドメインが新しくなってるんですよ!

新サーバーへの移行に伴って、新しいドメインを取得したんですよねぇ〜。だから、スタグラのアドレスが変更になったんです。 新しいURLは……、
http://aska-sg.net/  で〜す。 ブックマークの変更、よろしくね!

いやぁ、大変だった。ほんと。旧サーバーから新サーバーへ、ただ移行するんじゃつまんないから、大きくリニューアルしたんだよね。だもんで通常更新が1週間ずれちゃった。

なによ大きくって、見た目には大して変わってないじゃない。

見えないところやわかりにくいところをリニューアルしたんだよ!結構使いやすくなってるはずだよ。それに、全ページに「用語検索」をつけたんだ。ちょっと重たいけど便利だよ。

まったく、どうせやるならもっと目立つリニューアルにしないと他人にわかってもらえないわよ。神崎さんのことだから、「大して変わってないじゃん」なんて言ってるかもしれないわ。

う〜ん。確かに。

さぁ、今日の本題に入りましょ。まずはメルマガ読者へのプレゼントでしょ。

●メルマガ読者に寺崎佑紀&フェラーリ 360 モデナ壁紙プレゼント

寺崎佑紀&
フェラーリ360モデナ壁紙
メルマガ読者専用素材置場へ


メルマガ登録はこちら
メルマガ登録
メルマガに登録(無料)すると、
即時返信されるメールで、
IDとパスワードが入手できます

今回から数回に分けてお送りする「素敵な壁紙を作ろう」の完成作品を壁紙にしました!
左の写真をクリックすると、スタグラのメルマガ読者だけがダウンロードできる専用ページが表示されます。そのページにプレゼント壁紙が置いてあるので、後はそれを保存してください。あっ、ID とパスワードの入力ダイアログが表示されるので、メールでお送りした ID とパスワードを入力してくださいね。まだメルマガに登録していない人は、右のアイコンで今すぐ登録してください。ID とパスワードが記載されたメールがすぐに返信されますよ。メルマガ登録はもちろん無料です。

私、メルマガに登録してるけど ID とパスワードなんてもらってないわよ。

ID とパスワードは、事務局の担当者が全員に送ってるはずなんだけど、万が一届いてないなら、左上の「ご意見メール」ボタンで事務局にメールを送ってね。

あれ?届いてたわ。ごめ〜ん。今、ダウンロードしてみるからね。

………。そんなもんだよね。留美さんってさ。
たまにはメールボックスの整理しなよね。

●壁紙が大きすぎるという方に

画像のリサイズ ( Clickで拡大 )
Clickで拡大

うん、ちゃんとダウンロードできたわ。……。
ちょっとちょっとぉ、この壁紙、画像のサイズが大きすぎるんじゃな〜い?

1600 × 1200 で作ってあるんだ。他のサイズへは Photoshop で開いてリサイズしてくれればいいんだよ。画像サイズの変更は画像のリサイズを参考にしてくれればいいよ。

不親切ねぇ…。他のサイズも用意しておけばいいのに…。ブツブツ。

失礼だなぁ、画像のリサイズの方法まで書いてるんだから、これでも親切な方なんだよ!

ところで、このフェラーリ、誰の?

ん? お、俺のさ……。嘘だけど。いいよねぇ 360 モデナ。ピッコロとは言っても日本人にとってはビッグサイズだけどねぇ。まぁ誰のでもいいじゃん。それにしても、やっぱりフェラーリには女の子だねぇ。そして海。ビル。あ〜もうパーフェクトだねぇ。

何を一人で悦に入ってるのよ。早く今回の本題に入りなさいよ。

そういうわけで、今回からはこの壁紙を作ってみましょう。んで、今回からは例題で使っている写真をダウンロード(メルマガ読者のみ)できるようにしておきましたので、手順に沿ってご自分でもレタッチしてみてください。

 

  ■まずは素材をダウンロード ひとつ前のページに戻るこのページのトップへ  

●取り扱いに注意してね!

メルマガ読者専用素材置場へ
▲素材1 寺崎佑紀&
フェラーリ360モデナ

メルマガ読者専用素材置場へ
▲素材2 ビル群

メルマガ読者専用素材置場へ
▲素材3

今回使う写真は右の3枚ね。あっ、素材をダウンロードする前に「ここ」を読んでおいてくださいね。

いずれも一切レタッチしていない写真だよ。この3枚を使って、この壁紙を作るわけだ。

左の写真をクリックすると「素材置場」のページに行くわけね。そこで素材をダウンロードすればいいのね。

今回の壁紙は Photoshop 7.0J 以前でも作れるようにしているんだけど、Photoshop CS の機能も一部使ってるんだ。

●Photoshop CS使ってますか?

ここの読者で CS 使ってる人ってどの位いるのかしら? ちなみに私はまだ Photoshop 7.0J からアップグレードしていないわ。

う〜ん。CS は便利なんだけどねぇ。まだ発売されたばかりだし、やっぱり Photoshop は価格が高いからねぇ。それに、Photoshop は 5.5J で十分だって言う人もいるよね。

Photoshop CS って何が便利なのよ。

ここを読んでよ。とにかく、写真のレタッチに関しては従来バージョンよりも圧倒的に便利になったんだよね。[ 16ビット / チャンネル ] でもほとんどの編集機能が使えるのが便利。

でも最新のパソコンじゃないと辛いんでしょ?

いや、そんなことはないよ。俺だって 4 年前のマシンで Photoshop CS 使ってるからね。でもデュアル CPU でメモリ 1GB は積んでるけどね。[ 16ビット / チャンネル ] で編集するなら、メモリは多いに越したことはないね。

何言ってるのかさっぱりわからないけど、要はメモリを増やせってことね。

間違いない。

  ■ふたつの写真をひとつにまとめる ひとつ前のページに戻るこのページのトップへ  

●片方の写真にもう片方を重ねる

Clickで拡大
画面
1-1
2枚の背景画像を合成する
Clickで拡大

Clickで拡大
画面
1-2
カンバスサイズで高さだけを変更する
Clickで拡大

Clickで拡大
画面
1-3
海の写真にビル群の写真をコピーする
Clickで拡大

Clickで拡大
画面
1-4
コピーした写真を移動する
Clickで拡大

私も佑紀ちゃんの壁紙作ってみるから優しく教えてね。

ををををを!初めてやる気になったねぇ…。 感慨深いなぁ…。もしかしたら天変地異が…迫っているのかも。

ムカつくこと言わないでよ。優しく教えてって言ってるでしょ。

はいはい。じゃぁ、背景になるふたつの素材を Photoshop で開いてみて。「ビル群の写真」と「海の写真」だよ。俺は Photoshop CS で開くけど、留美さんは Photoshop 7.0J で構わないよ。やり方は一緒だから。

●[カンバスサイズ]を大きくする

二つのファイルを開いたわ。

このうち、海の写真の [ カンバスサイズ ] を上方向に 3000 pixel まで拡大するのだ。

なによ [ カンバスサイズ ] って。

そのまんま、額面通りに考えてよ。
[ カンバスサイズ ] ってのは、Photoshop が画像編集する上で使う [ 作業用エリア ] のサイズのことさ。絵を描くときに使うカンバスと同じ。Photoshop の [ カンバスサイズ ] は、今そこに表示されている写真のサイズを変えるのではなくて、 [ 作業エリア ] のサイズを変更する機能だよ。なんでこんなことするのかって言うと、もうひとつの写真を置くスペースを作ろうってわけさ。

[ カンバス ] が大きくなったわ。
で、次は何をすればいいの?

●ドラッグアンドドロップでコピー

余白のスペースができた「海の写真」の上に、「ビル群の写真」をドラッグアンドドロップでコピーしてごらん。「ビル群の写真」をアクティブにしたら、[ レイヤーパレット ] にあるコピーしたい [ レイヤー ] をドラッグアンドドロップするんだよ。

へぇ、なんだか面白いわね。こんな簡単なことでコピーできるんだ。

ドラッグアンドドロップした [ レイヤー ] は、コピー先に新規 [ レイヤー ] としてコピーされるんだよね。ただ、コピー直後は画像の位置が変なところにあるから、 [ 移動ツール ] で移動してあげないといけない。

 

  ■ふたつの写真の重なる位置を決める ひとつ前のページに戻るこのページのトップへ  

●上の [ レイヤー ] を半透明にすると楽

Clickで拡大
画面
2-1
[ レイヤー ] の [ 不透明度 ] を使って合成する位置を決める
Clickで拡大

Clickで拡大
画面
2-2
余分な空白をなくすためにトリミングする
Clickで拡大

Clickで拡大
画面
2-3
トリミング完了
Clickで拡大

次は、ふたつの写真の重なる位置を決めるわけだけど、このときに、上の [ レイヤー ] の [ 不透明度 ] を 「 50% 」 程度に下げてやると便利だよ。

この辺がデジタルの便利なところよねぇ。実際の写真なら、一時的に半透明になんてできないものね。 ところで私、[ 不透明度 ] って言葉、どうも馴染まないわ。なんで透明度じゃいけないのよ?頭に「不」なんてのがついてると、なんか嫌だわ。

そりゃ、写真はもともと「不透明」なものでしょ?「不透明」なものを「透明」にしていくってことじゃなくて、「不透明」なものの [ 不透明度 ] を 「 100% 」 から下げていくっていう考え方なんだよね。

なんか納得いかないなぁ…。

● [ 切り抜きツール ] でトリミング

あら、写真を移動したら空白ができちゃったわよ。これどうすんの?

[ 切り抜きツール ] で写真だけを切り抜くんだよ。いわゆる「トリミング」だね。

あら、なんで薮田さんは [ 切り抜きツール ] を下から上へドラッグするの?普通の感覚なら上から下でしょ。

この写真の場合、下は [ カンバス ] にぴったりで、上に余白があるでしょ。ってことは、下部を基点にした方がやりやすいんだよ。Photoshop の [ 切り抜きツール ] や [ 範囲選択ツール ] ってさ、この画面のようにウィンドウサイズを [ カンバス ] のサイズよりも大きく表示させておいたときに、グレーの部分からドラッグすると、自動的に [ カンバス ] の一番端から選択できるんだ。理屈よりも実際にやってみるとわかるけど、逆に上の余白と写真の境界を基点にして [ 切り抜きツール ] を使ってごらんよ。ほら、基点が決めにくいでしょ?

本当ね。たまには薮田さんもまともなこと言うんだね。

いつもまともなことしか言ってないよ!

 

  ■ビル群と海の境目を作る ひとつ前のページに戻るこのページのトップへ  

●ぼかしのある [ 選択範囲 ] で削除

Clickで拡大
画面
3-1
ビル群と海の境目を作る
Clickで拡大

Clickで拡大
画面
3-2
選択範囲の境界線をぼかす
Clickで拡大

Clickで拡大
画面
3-3
Del キー で削除
Clickで拡大

さて、これからどんどん面白くなってくよ。
今度は重ねた写真の、上の写真の一部を削除して、ビル群と海の境目を作ろう。このとき、境目がくっきりしすぎないように、ぼかしを使って自然な境目になるようにしよう。

さっきが [ 切り抜きツール ] でしょ、今度は別のツールを使うのね。

そう。今度は [ 範囲選択ツール ] を使って余分な部分を削除するんだ。[ 切り抜きツール ] は範囲選択した部分を残して、後を切り捨てるツールだったけど、今後は [ 範囲選択ツール ] で選択した範囲を Del キー を使って削除するんだ。

あら、私がやると海とビルとの境界がくっきりしすぎて不自然だわ。

範囲選択してそのまま削除するとそういうことになるよ。削除する前に [ 選択範囲 ] の境界線をぼかしておかなければダメなんだ。

へぇ〜。境界線をぼかすってのが今ひとつ理解できないんだけど、こうすると境界線がぼけて、上下の写真が自然に合成できたって感じになるわね。

これまでの講座の中で、何度か出てきたけど、[ 選択範囲 ] の境界線をぼかすテクは、Photoshop を使う上で大変重要なテクニックだから、絶対に覚えてね。

 

  ■ビル群の色調を海にあわせる ひとつ前のページに戻るこのページのトップへ  

● [ トーンカーブ ] の [ 調整レイヤー ] を使う

Clickで拡大
画面
4-1
ビル群の色味を [ トーンカーブ ] の [ 調整レイヤー ] で海の写真に合わせる
Clickで拡大

Clickで拡大
画面
4-2
[ トーンカーブ ] を調整する
Clickで拡大

Clickで拡大
画面
4-3
一枚の写真のように調整された
Clickで拡大

じゃぁ、もっと自然な合成写真に仕上げよう。

え?十分自然だと思うんだけどなぁ。

留美さんさ、Photoshop が上手になりたけりゃ、ある程度のこだわりは必要だよ。そして、上手な合成写真のコツは、色調の統一にあると言っても過言じゃないんだ。もちろん、まったく同じ色にしろって言ってるんじゃないよ。あくまでも自然に見えるように…。

ふ〜ん。そんなものなのかしらねぇ。

むっ。じゃぁとにかく画面4の手順で色調補正をやってごらんよ。

はいはい。あら、Ctrl キー を押しながら [ レイヤー ] をクリックすると、その [ レイヤー ] に入っている画像の範囲選択が簡単にできるのね。

小さな Tips だけど覚えてね。便利だから。で、海の色がかなり青味がかってるけど、これはこのままにしておきたいんだ。なぜって、これからこの背景に乗せるメインの画像が、赤がメインカラーだからさ。フェラーリね。この赤を際立てたいから、海は青のまんまでいいんだ。

なるほど、だからビル群の色味調整では「ブルー」の [ チャンネル ] を強くしているのね。

あんまり強くしすぎないでね。ほら、どう? 色調補正する前と後で全然雰囲気が違うでしょ?

あら、本当ね。ふ〜ん。少しはこだわれか…。

●今回も長くなりそう…。

ねぇねぇ早く次ぎ行きましょうよ。

いや、今回はこれで終わり。

え゛〜〜〜〜〜〜〜〜〜。だって、まだまだ続くでしょう?

ああ、まだ続くよ。今回は4回じゃ済まないかもしれない。5回は確実だな。

前回、クライアントの要望に応えて短くするって言ったじゃない。

クライアントより作品!こだわりですよこだわり。

怒られても知らないからね。

 

<< というわけで、今回も長そうな予感がしつつ次回へ >>

 
初出:2004/04/14
  このページのトップへ
 
space space space
space
space
space space space

     
 
 

     
リンクについて
著作権について
プライバシーポリシー