スポンサー


    ウェブデザイン基礎講座

    フォトショップ講座

    HTML&CSS講座

    グラフィック講座

    Flash講座

    3D講座

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

    サイトメンテナンス講座

    サイト紹介

    スペシャルリンク

サイト内検索

 メールマガジン

テクニック

Homeフォトショップ講座 > Photoshopで作る、魅力的なタイポグラフィ肖像画

Photoshopで作る、魅力的なタイポグラフィ肖像画

投稿日:2016年02月12日   ソフトウェア:Photoshop

このチュートリアルではPhotoshopで魅力的なタイポグラフィ肖像画を作成する方法をご紹介します。

Step1:はじめに

このチュートリアルでは、Photoshopを使って、魅力的なタイポグラフィ肖像画を簡単に作る方法を学びます。置き換えフィルタや、いくつかの描画モードを使用します。全体のプロセスはとてもシンプルですが、テキストを追加するところで少し時間がかかってしまうかもしれません。

このチュートリアルを気に入っていただき、高く評価していただければ幸いです。ぜひ、ご意見もお聞かせください。

これから作るタイポグラフィ肖像画の最終版が次の画像です。

最終版

それでは、始めていきましょう。



Step2:女性の画像を準備

新しくファイルを作ります(Ctrl+N)。サイズは1000×1000にします。

新規ファイル作成
新規ファイル作成

まず、背景を黒(#000000)とします。次に、Photoshopに、きれいな女性の画像を追加します。

女性の画像
女性の画像

ラスタライズしたあと、消しゴムツールを選択し、女性のまわりにある不要な部分を消します。

不要な部分を削除
不要な部分を削除

次に、女性の画像を複製します(Ctrl+J)。そして、「イメージ」>「色調補正」>「サイド」を下げる、を適用します。

画像の補正
画像の補正





Step3:文字パネルを設定

「ファイル」>「名前を付けて保存」、を選択し、名前を付けて保存します。名前は何でもいいですが、ここでは『女性』という名前で保存します。次に、女性の画像のあるレイヤーを隠し、文字ツールを選択します。文字パネルを開いて、次のように設定します。

文字の設定
文字の設定

続いて、下の画像のようにして、いろいろなサイズのテキストを書いていきます。文字の色は白(#ffffff)とします。

文字入力
文字入力

テキストを書いたら、そのレイヤーを数回複製して、下の画像のように、下へ下へと配置していきます。

複製した文字
複製した文字

ここでは、文字ツール上で右クリックし、縦書き文字ツールを選択します。そして、白い文字(#ffffff)でテキストを書きます。

文字の入力
文字の入力

縦書きの文字を書いたレイヤーを数回複製し、下の画像のように左に配置していきます。

文字レイヤーの複製
文字レイヤーの複製

横書き・縦書きの文字レイヤーをすべて選択して、結合します(Ctrl+E)。次に描画モードを選び、結合したテキストにドロップシャドウを適用します。

ドロップシャドウ
ドロップシャドウ

ドロップシャドウを適用した後は、次のようないい感じの結果になります。

良い感じの結果
良い感じの結果

テキストレイヤーを複製し、複製したテキストレイヤーにぼかしを適用します。

「フィルタ」>「ぼかし」>「ぼかし(ガウス)」を選択します。

ぼかし(ガウス)
ぼかし(ガウス)

ぼかしを適用した後は、複製したテキストレイヤーに次のような新しい効果が追加されます。

新しい結果
新しい結果



Step4:置き換えフィルタ

「フィルタ」>「変形」>「置き換え」、を選択し、水平比率と垂直比率をともに15にします。

置き換えフィルタ
置き換えフィルタ

OKボタンを押すとウィンドウが開きます。ここで、先ほど保存したPSDファイル『女性』を選択します。

置き換えウィンドウ
置き換えウィンドウ

PSDファイルを開くと、次のような結果が得られます。

結果の取得
結果の取得



Step5:最終調整

元の女性画像を一番上のレイヤーに持ってきて表示します。そして、この画像レイヤーの描画モードをハードライトに変更します。

描画モードをハードライトに設定
描画モードをハードライトに設定

「フィルタ」>「ノイズ」>「ダスト&スクラッチ」、を選択し、半径を7にします。

ダスト&スクラッチ
ダスト&スクラッチ

フィルタを適用した後は、次のような結果が得られます。

新しい結果
新しい結果



Step6:完成

全てのステップが終わると、下の最終形のようなタイポグラフィ肖像画が完成します。

最終形
最終形



引用:Web Design Library 著者:tutorialchip.com 翻訳:なかけん



スポンサードリンク

コメント

ランダム記事5件

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