Photoshop入門その5:文字を編集しよう(前編)

サルでき.jp > 11.サルにもできるiPhoneアプリの作り方(旧アメブロ記事) > Photoshop入門その5:文字を編集しよう(前編)

2010/03/01 09:00 投稿先 11.サルにもできるiPhoneアプリの作り方(旧アメブロ記事) 投稿者 カワサキ タカシ

ォトレタッチソフトは文字もレタッチしてナンボ。

ということで、
Photoshop講座、今回は文字を編集してみましょうって内容でお届けします。
文字の前に画像をいじりましたので、まだ見てない人はこちらをどうぞ。
Photoshop入門その3:画像を編集しよう(前編)
Photoshop入門その4:画像を編集しよう(後編)

画像がいじれれば文字なんてチョチョイってなもんです。
大きな泥船に乗ったつもりで挑戦してみましょう。

ではでは、レッツトライ!

まずは毎度おなじみ、飛び出すワンのファイルを開けて下さい。
とりあえず何か書いてみましょう。
Photoshop入門その5:文字を編集しよう(前編)
ツールバーから文字アイコンを選択して、

飛び出せ!と。
Photoshop入門その5:文字を編集しよう(前編)
書けましたね。

なんとなくこのくらいの位置で問題なさそうな気がするのですが、
iPhoneの場合、実際に壁紙に設定するとこんな感じになります。
Photoshop入門その5:文字を編集しよう(前編)
カブってる。

そうなんです。
日付と時間を表示するバー(上から115px)
ロック解除用のスライダーを表示するバー(下から95px)

コイツらがかなりの部分を占領してしまうのです。

ですので、画面の真ん中くらいに描くように意識しておきましょう。
Photoshop入門その5:文字を編集しよう(前編)

おや?文字の感じが変わりましたね。
手書き風フォントにしてみました。

フォントひとつでグッと柔らかいイメージになったりするので、
フォントって結構大事なんですけど、これが買おうと思ったら高いんです。

まぁ日本語フォントなんて作ろうと思ったら
何文字作らにゃいかんのよって考えると仕方ない相場なのですが、
とりあえず勉強にそこまでのお金はかけられませんので。

こんなサイトをご紹介。
★Heart To Me★

メニューの中から★文字箱★ にお進み下さい。
手書き風フォントのさなフォンです。
ホームページでの一般的なご利用ならフリーで使っていいよって書いてくれてます。
いつもお世話になってます!ありがとうございます。

では、
せっかくなので書いた文字を少し加工してみましょう。

まずは文字のレイヤーを複製して、
Photoshop入門その5:文字を編集しよう(前編)

編集>自由変形 上のハンドルをつかんで。
Photoshop入門その5:文字を編集しよう(前編)
ぐぐーっと文字を垂直方向に反転させてみましょう。

で、今ひっくり返した文字レイヤーをレイヤーウインドウから選択して、
右クリック>レイヤーの効果 を選びます。
Photoshop入門その5:文字を編集しよう(前編)
こんな画面が出てきましたか?

左側に並んでいるメニューの中から、グラデーションオーバーレイを選びます。
Photoshop入門その5:文字を編集しよう(前編)
この画面は、文字の上にグラデーションをかけたい場合の設定画面です。

真ん中くらいにある、グラデーションバーをクリックしてみましょう。
グラデーションエディタが開きます。

ここでは、グラデーションの細かい設定をします。
Photoshop入門その5:文字を編集しよう(前編)
バーの上下に付いている四角い箱をクリックすると、それぞれの要素を変更できます。

今回の設定内容は、こんな感じ。
右から左まで、色は白
透明度は、左がゼロ、右が70%

ぼんやーりとした白いグラデーションを作ったわけです。

レイヤースタイル画面をよーく見ると「角度」なる円グラフみたいな部分があるのがわかりますか?
今90度って設定されています。

これがグラデーションの向きです。
角度が90度ですので、縦方向にグラデーションがかかる設定になっているわけですね。

で、元のレイヤースタイル画面に戻って、
Photoshop入門その5:文字を編集しよう(前編)
レイヤー効果のメニューから、塗りの不透明度をゼロにします。

元の文字に塗られていた色をゼロにしてね。という指定です。
これで、グラデーションのみ生きていて、元の白い文字色は表示されなくなりました。

では、結果を見てみましょう。

はい、ドン!
Photoshop入門その5:文字を編集しよう(前編)

鏡面反射ー。※ドラ◯もん風に

アップルさんお得意の鏡面反射文字版です。
こんな簡単にできちゃいます。

文字が真っ白で、背景が真っ黒なら透明度をいじる必要はないのですが、
背景色が変わっても対応できるように透明不透明で表現してみました。

簡単に応用できますので、ぜひ挑戦してみてくださいね!

さてさて。
文字の編集、いかがでしたか?

Photoshop講座、ズルズルと週をまたいでお届けしておりますが、
残りあと2回で一区切りする予定です。

次回も引き続き文字の編集(後編)を。
最終回はフィルタをいじります。

無事まとまりますように。>自分

関連する記事:


Advertisement