Tシャツのグラフィック等にも良く使われるアメリカの道路標識。
特に「ルート66」はその代表です。
今回はAdobe Illustratorを使ってルート66の標識の描き方を画像付きで解説致します。
イラレでの描き方に加えて、Adobe Captureを使ったFONTの便利な検索方法も解説しますので、
最後まで読んで頂けるとうれしいです。
| ・フチ取りをアウトラインする方法 ・画像から色をとる方法 ・フォントの検索方法 |
標識の形をトレースする
まずは標識の形をトレースします。
google等の検索エンジンで「ルート66 標識」などのキーワードで画像検索をします。
色々でてきますが、今回は実際の標識同様の赤×青の物を選びました。
選んだ画像をブラウザーから直接イラレのアートボードにドラッグすればイラレ上に画像が表示されます。
表示された画像を⌘2でロックします。ロックする事でベースの画像を誤って動かしてしまうことなく
トレース出来ます。
ペンツールで内側のラインをトレースしていきますが、分かりやすいように
塗り＝透明、線＝水色のパスで作業を進めます。
このような左右対称な図形は右か左の半分だけをトレースします。
左右の中心からスタートして、左右の中心で終わるようにトレースします。
左半分がトレースが出来たら、
スタート地点と終了地点のアンカーポイントをダイレクト選択ツールで選択して、
「整列」→「オブジェクトの整列」→「水平方向右に整列」をクリック。
この作業をする事で完成時の中心が上下で揃います。
「リフレクトの軸」→「垂直」を選んで「コピー」をクリック。
反転された物がコピーされるので中心が重なるように「Shift」を押しながらドラッグします。
この時に「表示」の「スマートガイド」に✓を入れていると、中心が重なったときに「交差」と
ガイドが表示されるので分かりやすく便利です。
中心がきれいに重なったら、「パスファインダー」ウインドを開き、
右と左のオブジェクトを選択して、「形状モード」の「合体」をクリック。
これで左右のオブジェクトが合体し、1つのオブジェクトになります。
外枠の作成
基本の形が出来上がったら、次に外枠を作ります。
まずは先ほど合体させたオブジェクトを塗り＝赤、線＝透明で色づけします。
色づけが出来たら⌘C＋⌘B（コピー＋背面にペースト）→塗り＝白、線＝白（12pt）で設定します。
更に同じ作業を繰り返し（⌘C＋⌘B）→塗り＝黒、線＝黒（16pt）で設定します。
図６の右側のように3つのオブジェクトが重なってる状態になります。
次に一番上の赤いオブジェクトを⌘3（隠す）で見えない状態にし、
白いオブジェクトを選択し、「オブジェクト」→「パス」→「パスのアウトライン」を選びます。
この作業で線の内側と外側がオブジェクトに変換され、3つのオブジェクトに分かれます。
この3つのオブジェクトが選択された状態で「パスファインダー」の「合体」で合体し、
1つのオブジェクトに戻します。
加工前と違うのは線の外側がセグメント（パスをつないだ線）になっています。
同じ作業を一番下の黒のオブジェクトにも行います。
色を付ける
合体後に⌘+shift+3(すべてを表示）を押し、全てのオブジェクトを表示します。
次に上下の仕切りの線を作ります。
トレースしたベースの画像をshiftをおしながら右にドラッグし、ベース画像の白い線の幅で
2本の直線をペンツールでかきます。この時、赤いオブジェクトの幅より広く描いてきてください。
この2本線と赤いオブジェクトを選択し、「パスファインダー」→「分割」で
赤いオブジェクトを切断します。
これでそれぞれのパーツに別の色を付けられるようになりました。
次に色を付けたい部分をダイレクト選択ツールで選択した状態で、
スポイドツールでベースの画像の色を抜きたい部分をクリックすると、その部分の色が拾えます。
このやり方で上部の赤、下部の青の色を拾って、真ん中の白は外枠に合わせます。
このやり方は画像データから色を抜く時に使えるので覚えておくと便利です。
Adobe CaptureでFONTを検索する
「ROUTE」と「66」の部分を作ります。
あまり複雑なFONTではないので、適当に合わせても良いのですが、
せっかくなのでベース画像に極力合わせてみたいと思います。
ここからは一旦、スマホを開いてAdobeが無料で公開しているアプリ、Adobe Captureを開きます。
インストールされていない方は無料なのでこの機会にインストールしてみてください。
スマホでAdobe Captureを開き、画面右下のカメラのアイコンをタップします。
カメラが起動されるので、パソコン画面のベース画像にレンズを合わせると、
文字の部分が自動で認識されるので、「ROUTE」の部分をタップして、
下の決定ボタンをタップすると、似ているFONTがAdobe Fontの中から検出されます。
後はこのFONTを使って、「ROUTE」と「66」を打ち込んで配置すると完成です。
（FONTが入っていない場合はアクティベートの必要があります。）
モノトーンにして、かすれ感を加えるとそのままTシャツのグラフィックに
使えそうな雰囲気になります。
コメント