写真1

photoshopで3D素材を作る!簡単な作成方法とチュートリアル30選


目次

photoshopで3D素材を作る、簡単な作成方法

CS6から本格的な3Dオブジェクトの制作ができるようになったPhotoshop。
今回は簡単なテキストの3Dオブジェクトを制作してPhotoshopの3D機能を体験してみましょう。
制作チュートリアルの後には国内外の高度なチュートリアル制作30選も紹介しています。

まず簡単なテキストで3Dオブジェクトを作ります

新規にドキュメントを開きます。今回は下のような設定でドキュメントをつくりました。

本文写真1

白いボードに背景のグラデーションをかけます

このままでも3Dの制作はできますが、白だけの背景では見栄えがしないのでバックにグラデーションの背景をつくります。
グラデーションツールを選んで、上のコントロールパネルからグラデーションの設定を描画色から背景色(黒から白)に
します。

本文写真2

画面下でクリックしてそのまま上にドラッグして画面の上から2/3程のところまででグラデーションを設定します。

本文写真3

文字ツールでテキストを入力します

文字の大きさは適当でいいですが、フォントは表面積の大きなボールド系の文字が適当です。
ここではArial Boldを選び、サイズを150ptとしました。色も見栄えをよくするために濃い青の文字にしました。

本文写真4

テキストを入力し、位置を整えます。

そのまま中央部金に3D TEXTと入力します。

本文写真5

3Dパネルを表示します。

右上のワークスペース切り替えから3Dパネルを選んで切り替えます。

本文写真6

3Dパネルから3D押し出しのラジオボタンをクリックし作成をクリックします。

本文写真7

これだけの操作で2D文字の3Dオブジェクト化ができました。これで回転もライティングの変更も自在にできます。

本文写真8

3Dチュートリアル30選

つづいて内外のチュートリアル集から3D関連のチュートリアルを30種選びました。比較的簡単なものや
日本語で取り組みやすいものもあります。3Dがある程度理解できればこれらのチュートリアルに取り組めば
Photoshopの3D機能は必ずマスターできます。

3D Layers Text Effect in Photoshop CS6

写真1

http://planetphotoshop.com/3d-layers-text-effect-in-photoshop-cs6.html

CS6を使った3D文字。文字を使った3Dエフェクトの中でも手の込んだ作品。

Design a 3D Smart Car using Photoshop

写真3

画像出典「ALFORT」

手描きのスケッチから3Dのカーオブジェクトを作るチュートリアル。上級者向け。

Create a Microchip using Photoshop

 

写真4

画像出典「Photoshop Lady」

ICチップのアイコンを3Dで作るチュートリアル。解説がていねいで分かりやすい。

Featured tutorial – 3D Ice Cube

写真5

画像出典「3Data」

3Dでアイスキューブを作る方法。簡単ですがPhotoshop 3Dのメカニズムがよく分かります。

Wrapping Text in 3D With Photoshop

写真6

画像出典「phtoshopessentials.com」

3Dのテキストエフェクトですが、トリッキーで面白い作品です。比較的簡単に取り組めます。

写真7

画像出典「tuts+」

3Dで球体を作り、その上に世界地図をマッピングして3Dの地球をつくるチュートリアル。
いろんなところで応用が利く方法です。

写真8

画像出典「tuts+」

文字を素材につくる3Dテキストエフェクトは多いが、これほどリアルでスタイリッシュなのは珍しい。

写真9

画像出典「tuts+」

スポーツセンター 風の3Dデザイン。複雑ですが素材は不要で、文字だけでできます。

写真10

画像出典「tuts+」

Photoshop CS6の拡張機能を使った3Dテキストエフェクト。

写真11

画像出典「tuts+」

文字をゴムとガラス化してつくる3Dテキストエフェクト。超リアルで挑戦する甲斐のあるチュートリアルです。

写真12

画像出典「tuts+」

3Dオブジェクトの作り方を動画で紹介しているチュートリアル。

写真13

画像出典「tuts+」

Photoshopのレイヤースタイルを使ったレトロな3Dテキストエフェクトのチュートリアル。基礎的なもので分かりやすい。

写真14

画像出典「tuts+」

プラスチック風の3Dテキストエフェクトを使ったチュートリアル。基礎的で理解しやすい内容。

写真15

画像出典「tuts+」

チョコレートで作った火山の噴火。3Dエフェクトで作られている。素材は文字だけなのですぐに取り組めるチュートリアル。

写真16

画像出典「tuts+」

Photoshop 3Dツールを使ったシリアル食品のパッケージデザイン。テクスチャーとフィルターを多用しているチュートリアル。

写真17

画像出典「tuts+」

Photoshopでつくるリアルなカクテルグラスのチュートリアル。少し高度だが詳しく解説されている。

写真18

画像出典「tuts+」

レゴでつくる3Dテキストエフェクト。非常に細かく時間をかけたリアルな作品ができるチュートリアル。応用範囲は大きい。

写真19

画像出典「tuts+」

夏をイメージした3Dテキストエフェクト。3Dの他にトーンカーブを使ったレタッチや画像のコラージュなどのテクニックが学べるチュートリアル。

写真20

画像出典「tuts+」

レイヤースタイル、ブラシ、ドロップシャドウなど多くのテクニックを駆使したリアルなテキストエフェクト。

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

写真21

画像出典「THREE DESIGN」

photoshopで3Dの文字を作るチュートリアル。ごく初歩的な内容なので誰でも取り組める。日本語チュートリアル。

Photoshopで平面素材から3Dのリングをつくる

写真22

画像出典「Yossy」

2Dの素材から3Dのリングを作るチュートリアル。3D機能を使うのではなくワープを使っている。日本語で学べる。

Crumpled Paper Textured 3D Text Effect In Photoshop CS5

写真23

画像出典「TEXTUTS」

これも3Dテキストエフェクトですが、Photoshop CS5.5で作っています。古いバージョンでも3Dをやってみたい方に。

photoshopで周りの景色を反射させる3dテキストエフェクトのチュートリアル

写真24

画像出典「CREATIVETIPS」

3Dテキストエフェクトですが、日本語で内容も高度です。海外のチュートリアルを学びたいが英語はちょっとという方には
貴重なページです。

Photoshop Tutorial: Create a Robotic 3D Spider

写真25

画像出典「Pxleyes」

今流行のメカニックな写真を素材にして作る昆虫などのチュートリアル。このチュートリアルでは顕微鏡からクモを作っている。もちろん3D機能も使って。

3D Spiral Abstract

写真26

画像出典「N-sane Art」

比較的短時間でできるチュートリアル。3D風だが3D機能は使っていない。

写真27

画像出典「tuts+」

3Dの回転を使って制作する木製のカップ。内容的には複雑で高度だが上級のテクニックが随所で学べる。

写真28

画像出典「tuts+」

メタリックな3Dテキストエフェクト。基礎的な内容でわかりやすい。3Dはもちろんレイヤースタイルを多用している。

写真29

画像出典「tuts+」

継ぎ目のない3Dの幾何学パターンの作り方。Photoshopの3D機能は特に使わないで3D素材を作るテクニック。

Playing with 3D in Photoshop CS6

写真30

画像出典「abduzeedo」

初心者向けだがリアルでクールな3Dテキストエフェクトが学べるチュートリアルページ。

Photoshop CS6 3D Building City Tutorial

写真31

画像出典「photoshopcafe

最近流行のビル群の中に3Dテキストでビルを作るチュートリアル。一度は試してみたいテクニック。

おわりに

3Dは3Dプリンターの普及もあってこれからさらに進化する機能です。Photoshopだけでは3D専用のアプリケーションに比べると機能面ではまだ見劣りがしますが、Photoshopを使い慣れて3Dもやってみようという人にはPhotoshopの3D機能は入門用以上の働きをしてくれます。また3D画像を他のアプリケーションで作っても最後に他の素材と組み合わせて作品にするにはPhotoshopは不可欠となるので、Photoshopの3D機能はとても有用です。

本サイトが運営するWebデザインのオンラインスクールが公開中!
以下のリンクからお申込みで、特別料金の70%OFF!

未経験からプロのWebデザイナーになる! 400レッスン以上の完全マスターコース
こちらのコースは全くの未経験の方が、プロのWebデザイナーとして働けるレベルになることを目的としたコースです。
・全422レッスン & 42時間! 通学スクール80万円相当の内容
・授業×チャレンジ課題で実践的なスキルが身につく!
・過去1100名以上のスクール卒業生を輩出した、 Webサービス運営企業・デザイナー輩出企業だからこそ作れるプログラム

Webやアプリの最新デザインツール Sketch3 |100レッスンの完全マスターコース
Sketch3未経験からプロレベルを目指す、充実したコースです。
Sketch3の単なる機能説明をするような、つまらないコースではなく、アイコン制作、ボタン作成、メインビジュアル制作、Webページの制作など、実際の制作をしながら実践力を身につけます。
1000名以上の卒業生がいる実績ある日本のWebデザインスクールが提供しています。


NESTonlineBlog編集部

NESTonlineBlog編集部です。ご寄稿頂いた記事などを公開していきます。

Next Article【もうレイアウト崩れで悩まない】floatを解除する方法