webデザイン

ちょっとした裏技!?Photoshopで文字を切り抜いて影を付けるレイヤーマスクの活用方法

前面に紙や壁があることを想定し、文字の形に切り抜いて影を付けたい場合には、Photoshopのレイヤーマスクを上手く活用することで、ほぼイメージ通りの表現が可能になります。

ここでは、デザインの現場でかなり役立つレイヤーマスクの活用方法を解説します。(※選択したレイヤーそのものではなく、別のレイヤーにマスクを追加するのがポイントです。この方法は一度覚えてしまえば活用範囲がグンっと広がります)

Photoshopで文字を切り抜いて影を付ける方法

任意のテキストを入力します

drop-shadow14-5

切り抜きたいテキストレイヤーをShiftを押しながらすべて選択し、メニューバーのレイヤー 》レイヤーを総合します。

drop-shadow15

① 新規レイヤー作成ボタンをクリック
② 白でべた塗りする

drop-shadow160

統合したテキストレイヤーの“サムネイル部分”をCtrlキーを押しながらクリックすると、輪郭が選択された状態になります。

drop-shadow17

icon-bullhorn 今選択したレイヤーではなく、新規で“白のベタ塗りをしたレイヤー”を選択した状態でレイヤーマスクボタンをクリック

drop-shadow180

すると、テキストの輪郭どおりのレイヤーマスクが追加されました(ここでテキストレイヤーはお役御免なので削除するか、目のマークを外して非表示にしておきます。)

現状は、白い部分が表示されていて、黒い部分がくり抜かれて背景画像が見えている状態なので、レイヤーマスクをダブルクリックしてウィンドウを立ち上げ反転させます

drop-shadow190

これで、背景の画像の前面に紙や壁があり文字の形に切り抜かれたような状態になったので、ドロップシャドウを適用します

drop-shadow20

レイヤーマスクに真っ黒なブラシグランジ系icon-download)で塗れば、その部分がどんどん切り抜かれていきます。

drop-shadow21

さまざまな形状のブラシで試してみると面白いですよ!

文字を切り抜いて影が付きました

drop-shadow3

スリームデザインの無料メールマガジン

ピックアップ記事

  1. 見ているだけで「Photoshopの実践的な使い方が学べる」日本語解説付き動画の…
  2. 「ブロガーがこんなの読んだら反則レベルでしょっ、、」と思うくらい文章力が上がりそ…
  3. フリーランスや起業家になる前にこれだけは理解しておきたい5つのマトリックス&チャ…
  4. 柔軟な思考を大切にしたいクリエイター必読の5冊。私の頭をグニャングニャンに柔らか…
  5. 必読!安易に起業ブームに乗っかる前に…絶対に読んでおきたい【おすすめのビジネス書…

関連記事

  1. webデザイン

    photoshopで普通のノイズを加えるだけじゃ満足できない人にはNoise Texture Gen…

    通常、画像にザラっとしたノイズを加える場合には ↓ のようにフィルター…

  2. webデザイン

    ブクマ必須!見ているだけでPhotoshopスキルが磨かれる感性豊かなテクニック動画のまとめ

    テクニックとは、単なる技術のことを指すのではありません。頭の中…

  3. フォトショップ

    「あれっ?色味が違う・・」フォトショップで印刷データを作る際に絶対に覚えておくべき3つのこと。

    フォトショップ初心者の方や趣味でデザインをやっている方の中には、印刷し…

Wordpress日本語テーマのまとめ
photoshop日本語チュートリアル

よく読まれている人気の記事

最近の記事

  1. 「いつも締め切りに追われてしまう」そんな人がミッションを成し…
  2. Photoshop CCのメニュー文字やツールバーが異常に小…
  3. 思わずクリックしてしまう画像でアクセスアップ!2番目に簡単な…

思考系のおもろい記事

ブログラ
  1. 3分の話

    フリーランスや起業家になる前にこれだけは理解しておきたい5つのマトリックス&チャ…
  2. キュレーション

    WordPress日本語有料テーマの決定版っ!TCDシリーズのまとめ
  3. キュレーション

    必読!安易に起業ブームに乗っかる前に…絶対に読んでおきたい【おすすめのビジネス書…
  4. コピーライティング

    「ブロガーがこんなの読んだら反則レベルでしょっ、、」と思うくらい文章力が上がりそ…
  5. SEO

    WordPressの使い方に迷ったらまずこの記事をチェック!すごく参考になる秀逸…
PAGE TOP