投稿日：2011年10月25日　　　レベル：初心者　　　　ソフトウェア：

---

このチュートリアルではPhotoshopで温度計のアイコンを作る方法を紹介します。

• Step1 ： はじめに
• Step2 ： 温度計の形状を作る
• Step3 ： レイヤー効果を設定する
• Step4 ： 温度計の中身の作成
• Step5 ： ガラスの反射の作成
• Step6 ： 目盛りの作成
• Step7 ： 温度計の中身の調整
• Step8 ： 完成

今回は、Photoshopで温度計のアイコンを作ってみます。
下の図が完成予定図です。

600px×500pxの新規ドキュメントを作成します。

ツールパネルから楕円形ツールを選択し、色を白（#ffffff）にしてから円を描きます。

角丸長方形ツールを選択し、色を白（#ffffff）に、半径を40％に設定してから角丸長方形を描きます。

長方形のレイヤーと円のレイヤーを、「Ctrl」キーを押しながら選択します。
「Ctrl」＋「E」キーを押して結合します。

「レイヤー」−「レイヤースタイル」−「レイヤー効果」を選択し、以下のように設定します。

ドロップシャドウ

光彩(内側)

グラデーションオーバーレイ

境界線

レイヤー効果を適用すると下の画像のようになります。

再び楕円形ツールを選択し、色を白（#ffffff）にしてから円を描きます。

再び角丸長方形ツールを選択し、色を白（#ffffff）に、半径を40％に設定してから角丸長方形を描きます。

長方形と円のレイヤーを結合し、レイヤーに「Red base」と名前をつけます。
「レイヤー」−「レイヤースタイル」−「レイヤー効果」を選択し、以下のように設定します。

光彩(内側)

カラーオーバーレイ

境界線

レイヤー効果を適用するとこのようになります。

楕円形ツールをもう一度選択し、色を白（#ffffff）にしてから円を描きます。
レイヤーに「crystal」と名前をつけます。

「crystal」レイヤーを選び、「レイヤー」−「ラスタライズ」−「シェイプ」を選び、ラスタライズします。
ラスタライズしたら、ソフトブラシの消しゴムツールを使って次の画像のように消します。

「crystal」レイヤーの不透明度を60％に下げます。

楕円形ツールで色を白（#ffffff）にしてから、小さな円を描きます。

小さい円のレイヤーをラスタライズし、消しゴムツールを使って次の画像のようにします。

長方形ツールで次のように白い線を描きます。

線のレイヤーを4回複製して次のように配置します。

5番目の線は区切りの目盛りとなります。
複製した長方形を、「編集」−「変形」−「拡大・縮小」を選択して、他の線よりも少しだけ大きく作ります。

5本の線のレイヤーを「Ctrl」キーを押しながらすべて選択し、「Ctrl」＋「E」キーを押して結合します。
結合後のレイヤーに「lines」と名前をつけます。
「lines」レイヤーを5回複製し、次のように並べます。

すべての線のレイヤーを選択したら、「Ctrl」＋「E」キーを押して結合し、レイヤーに「upper lines」と名前をつけます。
レイヤーを複製し、「編集」−「変形」−「垂直方向に反転」を選んだ後、次のように配置します。

「Red base」レイヤーを選択し、「レイヤー」−「レイヤースタイル」−「カラーオーバーレイ」を選びます。
以下の画像のように設定します。

これで完成です。

引用:Web Design Library　著者:tutorialchip.comm　翻訳：菊池

スポンサードリンク