スポンサー


    ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

    ウェブプログラミング講座

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テクニック

Homeフォトショップ講座 > Photoshopでグレーの背景に雨を降らせる方法

Photoshopでグレーの背景に雨を降らせる方法

投稿日:2012年11月9日   レベル:初心者    ソフトウェア:Photoshop

このチュートリアルではPhotoshopとImagereadyでグレーの背景に雨を降らせる方法について紹介します。



Step1:はじめに

新規ドキュメントを開いて次のように設定します。
(設定は自由ですが、今回はこの方法で作業します)

ps_20580_01.jpg

Step2:長方形の描画

気に入った画像を開いてもいいですし、今回のようにキャンバスを黒く塗ってもいいでしょう。
次に、5つの新規レイヤーを作成します。それぞれを黒く塗ります。

ps_20580_02.jpg





Step3:ノイズの設定

ノイズフィルター(「フィルター」−「ノイズ」−「ノイズを加える」)を次のように設定します。

ps_20580_03.jpg

すると次のようになります。

ps_20580_04.jpg

すべてのレイヤーを同様に設定します。
それぞれのレイヤーに「ぼかし(移動)」
(「フィルター」−「ぼかし」−「ぼかし(移動)」)を次のように設定します。
レイヤー2

ps_20580_05.jpg

レイヤー3

ps_20580_06.jpg

レイヤー4

ps_20580_07.jpg

レイヤー5

ps_20580_08.jpg


Step4:アニメーションの設定

それぞれのレイヤーをソフトライトにしてレイヤー1を除いてすべて非表示にします。
「イメージレディで編集」アイコンをクリックします(あるいは「レイヤーからフレームを作成」を選択)

アニメーションウィンドウが開き、5つのフレームが作成されます。
最初のフレームではレイヤー1を除いてすべて非表示にします。
2番目のフレームではレイヤー2を除いてすべて非表示にします。
3番目のフレームではレイヤー3を除いてすべて非表示にします。
4番目のフレームではレイヤー4を除いてすべて非表示にします。
5番目のフレームではレイヤー5を除いてすべて非表示にします。
すると次のようになります。

ps_20580_09.jpg


Step5:完成

「ファイル」−「Web用に保存」を選択して、GIF形式で保存します。
すると次のようになります。

ps_20580_10.gif


引用:Web Design Library 著者:Aviva Directory 翻訳:菊池



スポンサードリンク

コメント

ランダム記事5件

2016年5月の人気記事ランキング