【Photoshop】年賀状に使えるようなかすれたハンコを作ってみた。

大急ぎで年賀状を作成したのですが、賀正!という感じのハンコを押したような要素を入れたいと思いPhotoshopで作成した。ウインドウズのPhotoshop CS5で作成です。

ハンコがかすれた感じになるやりかたはこのサイトを参考にさせて頂きました。
かすれたようなフォントの作り方(Photoshop) – Design Tips

まずはハンコのふちの部分を作成します。

まずは楕円形ツールで適当な円を描く。

パスコンポーネント選択ツールで円を選択して右クリック、選択範囲を作成する。

さらに「選択範囲>選択範囲を変更>縮小」を選ぶ。

選択範囲の縮小量を入力する。ここでは適当に20pxにした。
入力したらOKをクリック。

そうするとこんな感じの選択範囲ができる。

こんどは真ん中を塗りつぶしていく。
塗りつぶしツールにして塗りたい描画色を選んで、選択範囲の部分をクリックする。
するとシェイプをラスタライズするか聞かれるのでOKをクリック。

ラスタライズされたレイヤーに塗りつぶしをするとこんな感じになる。

次はテキストで任意の文字を入力。今回はDF勘亭流stdというフォントを使用。

テキストをラスタライズするために「レイヤー>ラスタライズ>テキスト」を実行する。

あとは適当に消しゴムをかけていくだけ。
消しゴムツールを選択して、画像を参考にMブラシのなかのドライブラシ1を使用する。

あとは適当にポチポチと消しゴムを各レイヤーにかけていけば完成。
消しゴムはほどほどにしておいたほうがいいかもです。

【Photoshop】草が生えてるみたいなテキストエフェクトのチュートリアル

Create a Spectacular Grass Text Effect in Photoshop

このチュートリアルをやってみました。
うん、実にめんどくさそう。

環境はWindows、Photoshop CS5

Photoshopで新規ドキュメントを作成する。今回は1920×1200で作成。

グラデーションツール(G)で円形グラデーションをキャンバスいっぱいに実行。
色は#328a26から#adbf41を参考に。

少し質感を出すためにここから紙のテクスチャをダウンロード。
ダウンロードした画像を配置したらCtrl + Shiftキー+Uで彩度を落とす。
キャンバスに合わせて大きさを調整させる。

テクスチャのレイヤーでブレンドモードをオーバーレイ選択。
透明度を70%に設定すると緑のグラデーションと混ざっていい感じ。

テクスチャのレイヤーをコピーしたら180度回転させて透明度を20%に設定する。
もっとこなれた紙の質感を出すために同様のコピーを何度か繰り返す。
さっきのサイトから別のテクスチャを持ってきて、かすかなオーバーレイをかけて重ねる。
ちょっとめんどくさいけどテクスチャが粗いとシャープに見えないので、 余分なテクスチャーを組み合わせることでよりシャープな背景を作ることができるらしい。
けど、やっぱりめんどくさいのでここではテクスチャレイヤーを1回重ねただけ。
(参考サイトは6回重ねてる。)

背景のグラデーションを複製して、一番上に置く。不透明度40%に設定。

一番上に新しいレイヤーを作成し、大きな柔らかい黒のブラシを使用して、端に暗さを追加する。 透明度30%とオーバーレイをして色を整える。

今のレイヤーを複製し、「フィルター>ぼかし>ぼかし(ガウス)」で200pxのガウスぼかしを実行。
(参考サイトでは32pxのガウスぼかしとあるが、ブラシのエッジによって調整)
これでエッジが柔らかくなり、立体感が出てクールな背景が出来上がり。

次は草の画像を利用してテキストを作っていく。 こちらから草の画像をダウンロードして配置。

適当にテキストをタイピングする。フォントはご自由に。
参考サイトのフォントはswissの924BTとのこと。今回はImpactを使った。
テキストの色を白にして不透明度50%、レイヤーのブレンドモードはオーバーレイ設定。

このレイヤーは、最終的にいらないんだけどパスを作るときのガイドに利用する。

草のボーボー感を出すために少し手間をかける。
さっきタイピングしたテキストをガイドにしてラフなトレースを行う。 言っておくけど超めんどくさい。
ここのコツは画像の草が突き出してるところに合わせて尖ったトレースをすること。 草のボーボー感がうまくでる。

ここで作ったパスは保存しておくといい。
パスパレットに切り替え、パレット右上の矢印をクリックで、パスを保存を選択できる。
後でまたパスが必要な場合は保存したパスを使えばいい。

作ったパスで選択範囲を作成する。
草の画像に戻ってパスで右クリック、選択範囲を作成。
あとで他の文字も切抜きするので、草のレイヤーを複製して非表示しておく。

選択範囲をCtrl + Shiftキー+ Iで反転させてから、テキスト部分以外の草を削除する。
下のスクリーンショットのようにうまく切り抜けたらOK。

これから草の側面を表現したり影を付けたりする。
まずは切り抜いた草のレイヤースタイルを以下のようにセットする。

このレイヤーをひとつコピーして透明度を51%に。
スタイルクリアして新たなスタイルを設定。

次は影を追加する。

草レイヤをCtrlキーを押しながらクリックして草レイヤーの下にもうひとつレイヤーを作る。
それを黒で塗りつぶしていく。
下の画像のようになるまで、塗りつぶしを繰り返して右下にずらして配置。
ここでは15pxほど右下にずらしてる。

黒いレイヤーに「フィルタ>ぼかし>ブラー(移動)」を45度の角度と約30pxの距離で実行する。
その後、50%の不透明度を設定する。下のスクリーンショットのようになってるはず。
だいぶ影っぽくなってる。

この影のレイヤーを3回ほど重ねて、そのたびに少し外側を消しゴムをする。
すると影がテキストにちかづくほど暗くなって立体感が出てくる。ブレンドモードは乗算を設定。
ここの工程はめんどくさかったので今回は1回しかレイヤー重ねてない。

さらにテキストに深みを出すためにテキストをばらばらにしたパーツを用意する。
これはテキストのレイヤーを複製して消しゴムかけたりして作るといい。

これを重なり合わせるとなんかいい感じになる。
焼き込みツール(O)を使ってパーツの暗さを出すと、影に草が隠れてる感が出てさらにいい感じになる。

ここまでやった工程を他の文字でも繰り返してみる。

例は雑になったけど、丁寧にやればもっとリアルになると思う。
フォントも画像より細い感じのほうが良いかも。

本家チュートリアルはこの後、ハイライトあてたり、蝶々やてんとう虫を加えたりしてるけどそこは割愛。

お疲れ様でした。

【Photoshop】簡単に3Dの旗が作れるチュートリアル

フォトショップで上の写真のような立体感のある旗を作ります。

使用ソフト:Photoshop CS5

元記事はこちら。やってみたらとても簡単だった。 >>>One minute 3D flag

まず、このような布のイメージをPSDファイルとして保管する。
探すのが面倒なひとはこちらからダウンロードできる。

まずは加工したい旗の画像を開く。
今回はこちらの画像をもとにすすめていきます。

ツールバーより フィルター>変形>置き換え を選択する。

出てくるダイアログを上のように設定。
OKを押したらファイル選択のウィンドウが開くので使用する布の画像を選択。(今回はfabric.psdを使用)

fabric.psdを選択すると実行内容が反映されて、風になびいたような旗の画像になる。
しかしこれではまだ、奥行きが出ていない。

次にfabric.psdを開く。
先ほど作成した旗の画像の上に新たなレイヤーを作成し、fabric.psdの内容をコピペ。
2つの画像の大きさが異なる場合は、同じくなるように調整してください。

fabric.psdをコピーしてきたほうのレイヤーのブレンドモードで「オーバーレイ」を選択。

これだけで簡単に奥行きのある旗の画像ができました。

お疲れ様でした。

【Photoshop】木の板にペイントしたようなテキスト画像チュートリアル

フォトショップでこんな感じの木板にペイントしたようなテキストを作ります。

海外サイトなので備忘録として簡単な手順を記録。
画像は元ネタのサイトから拝借してます。

まずはこちらの背景画像をダウンロード

ステップ1.ダウンロードした画像を開いてテキストツールで適当にテキスト入力し非表示にしておく。

ステップ2.ここで一度ファイルをpsd形式で保存。このファイルは後で使う。

ステップ3.背景レイヤーを選択してレイヤーを複製する。<<<ショートカットはCtrl+J

ステップ4.【イメージ>色調補正>2階調化】を選んでしきい値を70にする。

ステップ5.【選択範囲>色域指定】で許容量を200に設定。黒くなってる部分をクリックすると選択範囲が切り替わる。

ステップ6.Ctrl+Shift+I を押しながらテキストレイヤーをクリックして、ベクトルマスクを追加する。

ステップ7.テキストレイヤーを表示させ、白黒になった背景レイヤーは非表示にしておく。

ステップ8.【フィルター>ぼかし>ぼかし(ガウス)】で数値を0.4pxに設定する。

ステップ9.テキストレイヤーで右クリックしてテキストをラスタライズを。

ステップ10.次にマスクの上で右クリックしてレイヤーマスクを適用を選択。

ステップ11.【フィルター>変形>置き換え】で水平比率と垂直比率をそれぞれ2に設定してOKをクリック。ウインドウが現れるので序盤に保存したpsdファイルを開く。

ステップ12.テキストレイヤーの透明度を80%に設定して馴染ませる。

ステップ13.新しいレイヤーを一番上に作り、楕円形選択ツール(ぼかしは75px)でテキストの周りに円を描く。

ステップ14.Ctrl+Shift+I で選択範囲をあべこべにして、塗りつぶしツールで黒くぬる。描画モードをソフトライトに変える。

ステップ15.テキストレイヤーの上に新たにレイヤーを作って、先ほどと同じ手順で楕円形の選択範囲を指定してその中をオレンジ色(#FF9B0Bなど)で塗る。

ステップ16.描画モードをソフトライトにして透明度は50%にする。

ステップ17.【塗りつぶし又は調整レイヤーを新規作成】ボタンをクリックしてグラデーションマップを選択。逆方向をチェックしてOKをクリック。透明度20%に。

これで完成!

元ネタのサイトはこちら>>> Creat realistic type on wood

【Photoshop】はちみつがトロっと垂れるようなテキストエフェクトチュートリアル

テカテカ光ったはちみつがトロリと滴り落ちるようなテキストエフェクトを作ります。 元ネタはこちら>>>Honey leaking effect on the delicious pancake. 今回はテキストエフェクトを完成させる部分までをご紹介します。 出来あがりはこちら。
ステップ1.Photoshopを起動して新規ドキュメントを縦横900pxくらいで作成してパンケーキのイメージを配置します。パンケーキイメージは元ネタサイトよりダウンロードができます。
ステップ2.好きなテキストをタイプしましょう。今回のフォントはBrush Script stdを使用しています。
ステップ3.テキストの形を加工します。「レイヤーサムネイルで右クリック>テキストのラスタライズ」、またはメニューの「レイヤー>ラスタライズ>テキスト」でテキストをラスタライズします。 次にメニュー「編集>変形>ワープ」でテキストの形を好きなように変形させます。
ステップ4.丸ブラシを使ってテキストの角を丸くしたり、液体が垂れているような表現をつけます。
ステップ5.作ってきたテキストレイヤーの複製を4つ作ります。最初に作ったテキストレイヤーを含めてテキストレイヤーが5つになります。レイヤーパネルで全てのテキストレイヤーの「塗り」を0%にします。
ステップ6.下から2番目のテキストレイヤーに以下のレイヤー効果を適用してください。
ステップ7.下から3番目のテキストレイヤーに以下のレイヤー効果を適用してください。
ステップ8.下から4番目のテキストレイヤーに以下のレイヤー効果を適用してください。
ステップ8.一番上のテキストレイヤーに以下のレイヤー効果を適用してください。
ステップ9.今まで作ってきたテキストに影をつけます。一番下のテキストレイヤーの「塗り」を100%に戻し、フィルターの「ぼかし(ガウス)」を適用してください。ぼかしの半径は好みですが今回は5pxにしました。 ぼかしをかけたテキストを少しだけ左下へずらします。レイヤーパネルで他のテキストサムネイルをCtrlキーを押しながらクリックします。表示された選択範囲の部分をカットすると影の部分だけが残ります。 以上で完成です。