色鮮やかなグラデーションの画像加工 | デザインってオモシロイ -MdN Design Interactive-
【サイトリニューアル!】新サイトはこちらMdNについて
いまのあなたに必要なチカラと技を身につけよう

デザイン上達の秘訣とルール


実践ですぐに役立つ彩りのデザインアイデア

シルエット画像を配置してWebページを飾る色鮮やかなグラデーションの画像加工

完成作品

制作・文 中野貴志(SMEAR GRAPH)
url http://www.smear-graph.com
使用ソフト Photoshop CS2


この画像のつくり方

1最初に、Photoshopで新規ファイルを作成したら、背景をベージュのグラデーションで塗った。続いて、用意しておいた葉の画像を作業ファイル上に配置。レイヤーパレットの[レイヤーマスクを追加]ボタンをクリックして、レイヤーマスクを追加した。さらにそのまま、ブラシツールを使って黒く塗っていく ことで、葉の画像の不要な部分を隠しておく1-1

1-1
1-1


2新規レイヤーを追加し、ブラシツールを選択したら、[ソフト円ブラシ]などのぼけ足のあるブラシを用いて、ピンクやブルーなどでランダムに塗りつぶしていった2-1。続いてそのまま、レイヤーパレットメニュー→“クリッピングマスクを作成”を適用。さらに、塗りつぶしたレイヤーを[描画モード:リニアライト]に変更した2-2

2-1
2-1

2-2
2-2


3右上にも同様の手順で作成したものを配置3-1。塗りつぶす色味を少し変更するとアクセントになるだろう。続いて、木の枝の画像を開き、枝の部分だけ切り抜いて配置した3-2

3-1
3-1

3-2
3-2


4工程3で作成した技の画像を選択し、イメージメニュー→“色調補正”→“色調・彩度...”で、[色彩の統一]にチェックを入れて調整し、白いシルエットになるようにした4-1。画像の重なりで見える印象も変わるので、レイヤーの前後を入れ替えて調節しよう。

4-1
4-1

>>「ざらついた質感のアナログ風フレーム」を見る


『MdN』2009年2月号表紙

本記事は『MdN』2009年2月号(vol.178)からの転載です。
特集のすべての記事は誌面でお読みになれます。

月刊『MdN』掲載記事号の情報はこちら
楽天ブックスで買う
amazon.co.jpで買う

twitter facebook このエントリーをはてなブックマークに追加 RSS
【サイトリニューアル!】新サイトはこちらMdNについて

この連載のすべての記事

アクセスランキング

8.30-9.5

MdN BOOKS|デザインの本

Pick upコンテンツ

現在