webデザイン

photoshopで3Dの文字を作りたいけど使い方がわからない初心者のためのチュートリアル【CS6】

photoshopは常に進化し続けて最近のものでは3D機能これがもーハンパないっ!ほんの数年前まで立体を表現するためには、自力でそれらしく見えるよう四苦八苦しながらえらく時間をかけていた記憶があります。

しかし、photoshop【CS6】の3D機能を用いれば超簡単&短時間!ここでは思わず手に取れそうな立体的文字の作り方を解説しますので基本をここでしっかり覚えちゃいましょう!

photoshop【CS6】で3Dの立体文字を作るチュートリアル

3D機能を使うには解像度を高めに設定しておきます、ここでは画面サイズを幅:2000px 高さ:1333px 解像度:350px/inchで設定します。

新規ウィンドウ

背景用の画像をドラッグして入れます。

ミーティング画像

テーブルと同じような色でテキストを入力。

文字入力

今入力したテキストレイヤーに3D機能をかけます。3D 》選択したレイヤーから新規3D押し出しを作成

立体

すると以下のように見事に立体になりました。

3D

ここから調整していきます。まず右下、3D内一番上の【環境】を指定し、上の属性の【左のアイコン】を指定します。プレビュー画面左下の【緑矢印】を上下左右に調整してテーブルの平面にうまく合わせます。(慣れるまではちょっとコツがいるかも)

水平を調整

今度は右下、3D内のテキスト(ここではMEETING)を指定し、上の属性の【Tアイコン】を指定し、下のシェイププリセットのベベル(輪郭あり)を指定。

ベベル

続いて、属性アイコンを2つ右の(扇に矢印が付いてるようなヤツ)を指定して、ベベルの幅を15%に、輪郭を線形(斜めにまっすぐ)に変更します。

調整

次は、テーブルに立体文字が反射しているような描写を付ける作業。さっきと同様にまず右下、3D内一番上の【環境】を指定し、上の属性の【左のアイコン】を指定します。グリッドの反射の不透明度を40%に調整します。

その、すぐ下の立体マークのようなアイコンでレンダリングをかける。

レンダリングは終了するまで時間がかかるので、私の場合は全体に2~3回かかってある程度キレイになったところで止めて次の作業に進めてしまいます。(レンダリング中でも画面のどこかでクリックすると止まります)

レンダリング"

レンダリングすると画像が鮮明になり、テーブルの写り込みが ↓ 画像のように見えるようになるはずです。そしたら作成した3Dレイヤーを右クリックしてラスタライズします。

ラスタライズ

最後にラスタライズしたレイヤーの写り込み部分を選択ツールでぼかし60pxで切り抜く。

ぼかし切り取り

このように完成したと思いますがいかがでしたでしょうか?

photoshopで3D完成

今回は、photoshop【cs6】で3Dの文字を作る方法を紹介しましたが、3D機能の使い方としては基本なのでこれをしっかりとマスターしちゃいましょう!

そうすればいろいろなケースで応用が利き作業効率の向上だけでなく、どんどんとクオリティの高い作品作りが可能になること間違い無しです!

3Dの立体文字をアレンジしてみました。

3Dアレンジデザイン

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

ピックアップ記事

  1. WordPressの使い方に迷ったらまずこの記事をチェック!すごく参考になる秀逸…
  2. 必読!安易に起業ブームに乗っかる前に…絶対に読んでおきたい【おすすめのビジネス書…
  3. フリーランスや起業家になる前にこれだけは理解しておきたい5つのマトリックス&チャ…
  4. 「特訓Photoshopプロのテクニック教えます!」という本のWEB版を『無料』…
  5. 「ブロガーがこんなの読んだら反則レベルでしょっ、、」と思うくらい文章力が上がりそ…

関連記事

  1. webデザイン

    【デザイナー必見】パクリと言われないために類似画像検索で確認しておこう

    作品を創り出す際、クライアント用のデザインや自身のアートに限らず、その…

  2. webデザイン

    意外と知らないっ、、Photoshopで文字の輪郭(境界線)だけに影を付ける方法

    Photoshopで文字の輪郭(境界線)に影を付けようと思っても、「外…

  3. webデザイン

    フォトショップでアメコミ風に加工する所要時間たった3分のフィルター活用テクニック。

    フォトショップのフィルターを活用すると、画像を印象をガラっと変えること…

  4. webデザイン

    Photoshopユーザー必見!無料になったNik Collectionのヤバすぎる使い方

    Photoshopでクオリティの高い加工が可能なプラグインのNik C…

  5. webデザイン

    フォトショップ初心者でもできる!プロ並みの画像合成で自然になじませる方法を解説。

    フォトショップを使用して合成画像を作りたいと思っても、自然になじませる…

  6. フォトショップ

    photoshopで顔を明るく立体的な印象を付ける方法。

    photoshopで顔を明るくするにはトーンカーブやレベル補正などで簡…

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

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

最近の記事

  1. 「特訓Photoshopプロのテクニック教えます!」という本…
  2. 「いつも締め切りに追われてしまう」そんな人がミッションを成し…
  3. Photoshop CCのメニュー文字やツールバーが異常に小…

思考系のおもろい記事

ブログラ
  1. フォトショップ

    見ているだけで「Photoshopの実践的な使い方が学べる」日本語解説付き動画の…
  2. 3分の話

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

    柔軟な思考を大切にしたいクリエイター必読の5冊。私の頭をグニャングニャンに柔らか…
  4. キュレーション

    必読!安易に起業ブームに乗っかる前に…絶対に読んでおきたい【おすすめのビジネス書…
  5. webデザイン

    photoshopで仕事をしたい人が身につけておきたい技術や使い方のまとめ。日本…
PAGE TOP