ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

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

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テンプレートモンスター
ホームページテンプレート

Free Templates Online JP
無料ホームページテンプレート
Free Templates Online JP

株式会社ネットオン
採用Webマーケティング
indeed広告代理店

海外 SEO対策 トラッキングツール
海外 SEO対策
ランキングチェックツール

Rank Tracker

テクニック

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月の人気記事ランキング