ガンダムフィギュアを
CG風に仕上げる!6日目 

~マーキング~

はじめに

6日目!

前回の「シャドウ」で、かなりリアルな雰囲気に仕上がってきたね。

うん、もうおもちゃには見えないね

前回のところで終わりにしちゃう手もあるんだけれど、あと2日あるから、もうちょっと手を入れていこう。

今日は何をするの?

マーキング。

まーきんぐ?

そ。ガンプラとかには、組み立てた後に貼るコーションマークのシールがついているだろ?

うん、あれむずかしい。

それをPhotoshop上でつけちゃおう、ってことさ。

どゆこと?

ま、やってみようよ。
最初は文字の書き方の基本を練習するよ。
すでに文字の書き方は知ってる!という人は
ここをクリックしてね。

文字を書く

Photoshopには、文字を書くための「文字ツール」が用意されているんだ。

あ、この「T」のマークのツールだね
文字ツール

そう。文字ツールを選んだら、画面の中でクリックをしてみよう

どこでもいいの?

キャンバスの中なら、どこでもいいけれど、ガンダムの上に書いちゃうと、文字がよく見えないだろうから、背景の黒い部分でやってみよう。

クリックしたよ。あ、文字が打てるみたい

クリックした部分にアイビームが表示されたら文字を入力してみよう。この後、使うから「E.F.S.F」と入力してみよう。

とうちゃーん

ん?どうした?

文字が小さすぎて見えないよー

文字が小さすぎる

ふむ。文字サイズが小さすぎたみたいだね。それじゃ、文字のサイズを変えてみよう。

文字サイズを変更する

文字サイズの変更方法はおおまかに2通りあるんだ

へー

まず、画面右側にある「レイヤー」パネルを確認してみよう

あ、Tマークのレイヤーがある!
Tマークのレイヤーが追加されている

そう、それが文字レイヤー。今、入力した文字は、そのレイヤーに入ってるよ。

打った文字がレイヤーの名前になってる!
打った文字がレイヤー名になる

どの文字レイヤーに何が入力されているのかわかって便利だね

うん

ところで、このままだと、黒い背景に黒い文字になって、文字のサイズを変えても見えづらいままになってしまうから、一度、文字レイヤー以外は非表示にしてしまおう。

こういうときは、文字レイヤーの目のアイコンをAltキー(Macはoptionキー)を押しながらクリックするんだったね
目玉アイコンをAlt+クリック

そう!よく覚えてたな。2日目に練習したね。
文字以外が非表示に

えへへ

さて、それじゃ、その文字レイヤーに表示されている「T」マークをダブルクリックしてごらん
Tマークをダブルクリック

うん。。あ、画面の中の文字が選択された?
文字が選択された

そうなんだ。この文字レイヤーの「T」マークをダブルクリックすると、その文字レイヤーに書かれている文字が全部選択されるんだ。

ふぅん

よし、ここでキーボードを使うぞ、Ctrlキー(Macはcommandキー)を押しながらTのキーを押してごらん。

ん?「文字」っていうパネルが出てきたよ
文字パネル

今の「Ctrl+T(Mac:command+T)」をキーボードで押すと、画面の中に文字パネルを呼び出すための命令になるんだ。こうやってキーボードのキーを組み合わせて命令をかけるのを「ショートカットキー」というんだ。
ショートカットキーは、ほかにもいろいろあるから、また少しずつ覚えていこう。

うん。

さて、今開いた文字パネルの中身を見てみよう

文字パネル

今回やりたい文字サイズの変更は、この部分だ。いろいろ数値を変えてごらん
文字サイズの変更

おー、大きくなった……けど…

ん?

一番大きな「72」っていう数字を選んでも、まだ大きさが足りないよ

そういう時は、自分で数値を入力しちゃうんだ。「100」とか「200」とか

あ、ほんとだ!ちゃんと大きくなる!

でも、まぁ、最初は、どのくらいの数値をいれればどのくらいのサイズになるかがつかみづらいだろうから、もう1つのサイズ変更の方法を教えてあげよう

うん

ツールパネルから「移動ツール」に持ち替えて
移動ツール

はい

そしたら、この状態で「Ctrl+T(Mac:command+T)」を押してごらん

え?それって、さっきやったやつじゃないの?

いいから。

あれ?今度は文字の周りに囲み線が出てきたよ?
文字の周りに囲み線

そう、実は、この「Ctrl+T(Mac:command+T)」のショートカットキーは、押すシチュエーションによって振る舞いが変わるんだ。文字の入力中に押すと、文字パネルの呼び出し。それ以外の時に押すと、選択しているレイヤーに含まれるパーツの自由変形が行えるようになるんだ。

これ、どうすればいいの?

囲み線の角に小さなツブがついてるだろ?このツブを「ハンドル」と呼ぶんだけど、そのハンドルをドラッグしてサイズの調整をするんだ。ドラッグするときに、キーボードのShiftキーを押しながらドラッグをすると、縦横の比率がおかしくならずにサイズ変更ができるぞ。
ハンドルをドラッグ

おー、カンタン!、ぼく、こっちのサイズ変更の方が好きだなー

サイズがある程度決まったら、囲み線の内側でダブルクリックしてみよう。

あ、囲み線が消えた!
囲み線が消えた

これで確定だよ。この確定作業をしないと、ほかの作業が行えないんだ。覚えておこう

うん。

その他の文字装飾

とーちゃん、他にも文字に何かするの?

そうだな、文字の扱いってのは、結構奥深いんだけど、今回はあまりディープな話題には触れないから、あとは文字の色の変え方と、フォントの指定だけやっておこう。

そういえば、文字の色ってどこで変えるの?

まずは、文字レイヤーの「T」マークをダブルクリックして、文字を選択してごらん

うん、やった

んで、そのあとは、カラーパネルを使うんだ
カラーパネル

あ、これ4日目のツインアイの色を決めたやつだ

おぉ、これもよく覚えてたな

えへへ

これで色を指定しよう。今回は白い文字にしたいから、パネルのここをクリックするんだ。
白を選択
色が変えられたら、非表示にしておいたレイヤーを表示しておこう。

うん

よし、次はフォントも変えよう

フォントは、文字パネルのここだね
フォントの変更

そう、いろいろ試してしっくりくるフォントを探そう

いいのが無かったら?

フォントは、インターネット上にフリーでたくさん公開されているから、そういったフォントをパソコンにインストールしてやるといい。
フォントをインストールした後は、Photoshopを立ち上げなおすと、使えるようになるよ。

今度さがしてみよっと

フォントの指定が終わったら、ツールパネルから移動ツールに持ち直しておこう
移動ツール

複数の文字を組み合わせる

今回、作りたいのは、シールドに貼るこんなマークなんだ
シールドに貼るマーク

え?でも、これっていろんなサイズの文字が混ざってるよ?どうやるの?

これはね、それぞれの文字サイズごとにレイヤーを分けるんだ

あ、そうか

すでに「E.F.S.F」は書いたから、次はこの部分を書いてみよう。
複数行にわたる文字

どうやればいいの?

文字ツールを持って、「E.F.S.F」から離れたところをクリックすると、新たに文字レイヤーが追加されて入力ができるようになるから、文字を入力して、サイズを調整して、移動ツールで位置を整えるんだ

あわわ…いっぺんにたくさん言われても…

ごめんごめん、ゆっくりでいいよ。
今回は、複数行の文章だから、Enterキー(MacはReturnキー)で改行しながら書いていこう。

うん……、んーー…、できた!
複数行の文字列

よし、よくがんばった!
だけど、行間がちょっと広いね

うん

こういう場合は、書いた文字を全部選択してから、Altキー(Macはoptionキー)を押しながらキーボードの「↑」「↓」キーを押してみよう。

あ、行間が変わる!
行間が指定できた

行間は「行送り」と言ったりもするよ。文字パネルのここで数値での指定もできるけれど、ロンが今やった方法のほうが、直感的にできるから作業しやすいと思うよ。
行送りの設定

袋文字を作る

よし、じゃ、次はこの部分の作成だね。
袋文字

この文字、中身がないね。どうやって書くの?

こういう文字を「袋文字」と呼ぶんだ。
袋文字のフォントがパソコンにインストールされていれば簡単だけれど…

僕のは入ってないよ?

そういうことなら、自分で作ってみよう。まずは今まで通り、文字ツールで文字を書いて、サイズを整えておこう。

できたよっ!だんだん慣れてきたー
文字を入力してサイズを調整

よしっ、そしたらレイヤーパネルから、今入力した「WB」のレイヤーで、レイヤー名の表示されていない このあたりをダブルクリックするんだ。
名前のないあたりをダブルクリック

なんかウインドウが出てきたよ

レイヤースタイルダイアログ
※クリックで拡大

これは「レイヤースタイル」というダイアログで、ダブルクリックしたレイヤーに対して特殊効果をかけられるウインドウなんだ。

へぇ

デジラマに役立つ機能が満載なんだけれど、今回は「境界線」というのを使ってみよう。

あ、カテゴリのところに「境界線」ってのがあるね。これにチェックを入れればいいの?
カテゴリに「境界線」

そう。この「境界線」の位置は、フォトショップのバージョンによって位置が微妙に違うので、一番下に見当たらない場合は、もうちょっと上の方にあるから、探してみて

チェックを入れたけど、何か起きてるの?

これで「WB」という文字に境界線がついているはずなんだけれど、今回の写真だとわかりづらいね。ちょっと微調整をしよう。
このチェックを入れた「境界線」というカテゴリ名をクリックしてごらん。チェックを外さないように気を付けて
カテゴリ名をクリック

あ、ウインドウの右側が変わった!

境界線の調整
※クリックで拡大

ここで境界線の調整を行うんだ。最終的には境界線を白にするんだけれど、文字の色が白いから、白い境界線をつけても見えないね。黒い境界線も背景が黒だから見えない。ここはわかりやすく境界線の色を赤にしておこう。この部分をクリックして色を指定しよう
境界線の色を指定

赤にしたよ
境界線の色を赤にした

画面を確認してごらん。WBの文字に境界線がついているのがわかるかい?

あ、ほんとだ!赤い線が出てるよ!
赤い境界線が出た

今回、線の太さは問題なさそうだけれど、太さを変更したい場合は、レイヤースタイルダイアログの「サイズ」という欄で調整をしてやればいい
境界線の太さを調整

よし、それじゃ、境界線が無事に調整できたので、境界線の色を白に変えておこう

うん、できたー
境界線を白に変える

ただ、これだと白い文字に白い境界線になってしまうから、なんとか文字部分を透明にする必要があるんだ。

あ!わかった!レイヤーの不透明度を使うんでしょ?
レイヤーの不透明度

お?そう思うか?ほんじゃ、やってごらん?

あ、あれれ?これだとせっかくつけた境界線も透けちゃう…
境界線も一緒に半透明に…

そうなんだ。不透明度はレイヤースタイルでかけた効果も一緒に透明にしてしまうんだ。

うぅ…じゃあ、どうするの?

レイヤーパネルで、そのすぐ下にある「塗り」という部分の数値を下げてみよう
塗りを調整

あ!今度は線は透明にならない!
文字の中だけが透けていく

そう。「塗り」はレイヤースタイルの効果には影響が出ないんだ。ここを「0%」にしてしまえば、袋文字の完成だね
袋文字の完成

文字レイヤーの結合

よし、それじゃ、これをまとめて扱えるように複数に分かれたレイヤーを結合するぞ

けつごうって何?

複数のレイヤーを1つにまとめることさ。今回は、この3種の文字で1つのマークだからね。

どうやるの?

レイヤーパネルで、今回結合するレイヤーを選択するんだ。複数のレイヤーを選択するときは、Shiftキーを押しながらクリックしていくと選択できるよ

うん、選べた
複数レイヤーの選択

そしたら、レイヤーパネル右上にある小さなアイコンを見つけて。このマークだね
レイヤーパネルメニュー

どこ?あ、あった

このマークは、パネルメニューと言って、クリックすると、パネル内容にあったメニューが表示されるんだ。

レイヤーパネルメニュー
※クリックで拡大

ふむふむ

その中に「レイヤーを結合」ってメニューがあるだろう?
レイヤーを結合

うん、似ているメニューがいくつかあるから気をつけなくちゃね

よし、それじゃ、それをクリックしてごらん

あ、選んでたレイヤーが1つになった!
レイヤーが結合された

そう、これが結合だよ。カンタンだろ。これでこのマークは1つのパーツとして扱える。ただ…

ただ?

結合をしてしまうと、文字情報を破棄して、「文字の形をした図形」に変換されてしまうので、もう打ち直しができなくなるんだ。だから、「これでカンペキ!もう打ち直す必要はなし!」と確信できたところで結合しよう

うん、わかった。最初から作り直すのは嫌だもんね

マークをなじませる

ねー、とうちゃん

ん?どうした?

ぼくの写真、ガンダムがナナメ向いてるから、マークをおいても、なんか変な感じになるよ
文字の角度が合わない

おー、そりゃそうだな。こういうときは、マークを変形させて、写真になじませるんだ

むずかしそう

慣れるまではね。こればっかりは、たくさん触って覚えるしかないな

んーー、やってみる

よし、それじゃツールパネルから移動ツールを持った状態で、マーキングのレイヤーを選択して「Ctrl+T(Macはcommand+T)」だ。
移動ツール

あ、これさっきやったね

そう、自由変形だね。マーキングの周りに枠が出てきたな?

うん、さっきは、これで大きさ変えた

今回もある程度、サイズを整えたら、キーボードのAltキー(Macはoptionキー)を押しながら、枠の角にあるハンドルをドラッグしてごらん
角のハンドルをAlt+ドラッグ

あ、形がおかしくなった
変形する

この方法なら、サイズ変更ではなくて、形をゆがめることができるんだ。四隅のハンドルを少しずつ調整して、シールドの角度に合うようにしてごらん

うーーーーっ、む・ず・か・し・い…
形状の変更

がんばれ

んーーーーーーー、で、できたっ!
形状の変更

どれどれ?おー、なかなかいいじゃないか

変形前後比較

ほんと?やった!

それじゃ、囲み線の内側をダブルクリックして確定しておこう。マーキングがはっきりしすぎる、と感じる場合は、レイヤーの不透明度を下げると、いい感じになじむよ

不透明度の調整

6日目完了

6日目完成

さぁ、どうだったかな?今日は、文字入力の方法を知ったね。今回は、1つしかマークを作ってないけれど、たくさん作って、いろんな場所にマーキングをすると、とっても楽しいぞ。

かっこよくなりそう!

このあたりは、好みの問題だから、好きなだけ作ればいいね

ねー、明日は何をするの?

明日は最終日!ウェザリングに挑戦だ!

今日の内容はどうでしたか?「おもしろい!」「役に立った!」「やってみたい!」と思っていただけたら、ぜひイイネ!やシェアしてください。僕たちのやる気がぐんぐんアップしちゃいます!
このエントリーをはてなブックマークに追加