スポンサー


    ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

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

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テクニック

Homeフォトショップ講座 > Photoshopで3Dのクリスタルアイコンを作る方法

Photoshopで3Dのクリスタルアイコンを作る方法

投稿日:2009年02月27日   レベル:初心者    ソフトウェア:PhotoShop
このチュートリアルでは、Photoshopで3Dのクリスタルアイコンを作ってみたいと思います。


Step1:はじめに

750ピクセル×550ピクセルのドキュメントを作成します。

カスタムシェイプツールカスタムシェイプツールのプリセットから「オスマーク」を選択します。

次の図のようにパスを描きます。

カスタムシェイプのオスマークからパスを描く

新規レイヤーを作成して「上面」と名前を入れます。

パスパネルで、作成したばかりの作業用パスを選択します。

レイヤーパネルに戻り、「上面」の選択範囲を「#497923」で塗ります。

新規レイヤーで上面を作成


Step2:本体レイヤーを作成する

「上面」レイヤーを隠し、次のように新規レイヤーを作成して「本体」と名前を入れます。

上面を作った操作を繰り返しますが、今回は選択範囲を「#4AC1FF」で塗ります。
本体の不透明度を50%に設定します。

新規レイヤーを作成して不透明度を50%に

ここが難しいところです。
「本体」レイヤーを選択して「Ctrl」+「A」キーを押してレイヤーを全部選択します。

移動ツールを選択してから「Ctrl」+「Alt」+「T」キーを押します。
下矢印キーを1度押して(1ピクセルだけ下に動かします)Enterキーを押します。

「Ctrl」+「Alt」+「Shift」+「T」キーを押して移動の操作を繰り返します。
希望する本体の厚みができるまで操作を繰り返します。

希望の厚みになるまで位置をずらして複製する

「上面」レイヤーを再表示させてブレンドモードを「オーバーレイ」に変更して不透明度を50%にします。

レイヤーを右クリックしてレイヤー効果を選択します。
「光彩(外側)」を選択して、描画モードを「比較(明)」、色を「#FFFFFF」、不透明度を100%、サイズを5ピクセル、その他についてはデフォルトの設定にします。

ブレンドモードをオーバーレイにし不透明度を50%に


Step3:底面レイヤーを作成する

新規レイヤーを作成して「底面」と名前を入れます。
このレイヤーを「上面」レイヤーと「本体」レイヤーの下に入れます。

上面を作った操作を繰り返して選択範囲を「#00F5FF」で塗ります。
底面の位置を調整して次の画像のようにします。

上面のレイヤーを作成する操作を繰り返し底面を作成

「底面」レイヤーを複製して「影」と名前を変えます。
「影」レイヤーを「底面」レイヤーの下に配置します。

「影」レイヤーで、「フィルタ」−「ぼかし」−「ぼかし(ガウス)」を選択します。
半径を10ピクセルに設定します。

ぼかし(ガウス)を適用し半径を10ピクセルに


Step4:光沢や反射を追加する

新規レイヤーを作成したら他のレイヤーの上に配置して「光沢」と名前を入れます。

楕円形選択ツール楕円形選択ツールで大きい円形の選択範囲を作ります。
ブラシツールブラシツールで300ピクセルのソフトエアブラシを選択します。
円形の選択範囲の下の部分のわずかに外側を塗ります。

このレイヤーの不透明度を60%に設定します。

楕円形選択ツールで選択した箇所の外側を塗る

同じ操作をオスマークの矢印部分に対して行います。

同じ操作を矢印部分にも

新規レイヤーを作成して「反射」と名前を入れます。

次のように2つの白い帯を描きます。
本体の外側の帯を消します。

このレイヤーの不透明度を30%にします。

2つの白い帯を描き外側の帯を消す

同じ操作を本体の内側に対しても行います。

同じ操作を本体の内側にも


Step5:完成

最後に

これでいい感じに光る3Dクリスタルアイコンができました。
さらに青の背景と輝きを追加してデザインに磨きをかけてみます。

完成

このセッションがお役に立つことを願っています。
ありがとう!


引用:Web Design Library 著者:10steps.sg  翻訳:菊池



スポンサードリンク

コメント

ランダム記事5件

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