【Illustrator】パターンブラシを作る

2018-01-29

お久しぶりです。今回はIllustratorでオリジナルパターンブラシの作り方について書いていこうと思います。
使用ソフトはIllustratorCCです。

全体図をイメージする

こんな感じのパターンブラシがあればなーなものの全体図？全体的イメージを出しといてください。
絵に描き起こすと楽かもしれないです。今回は巷で噂のひと狩り行くゲームがやりたい願望が抑えられず、コントローラーのパターンブラシを作っていこうと思います。ざっくりそれっぽいラフ描きます。

スティックないじゃないか！とか〇〇付いてない！というのは置いといてください。割愛です。

オブジェクト作成

パターンブラシは、「外コーナー」「中間」「内コーナー」「始点」「終点」それぞれのオブジェクトでできています。

この５つのオブジェクトを作成していきます。
コーナーオブジェクトの作成は難しいので今の所スルーしてください。

「始点」「中間」「終点」は簡単なので作っていきましょう！
全体図を思い浮かべて、または、書き起こした全体図を「始まり」「中間」「終わり」に分けてみましょう。
こんな感じになります。

「コントローラー」が「始点」、「伸びたコード」が「中間」、「刺し口」が「終点」で分けました。コントローラーと刺し口は反対でもいけます。

オブジェクトを実際作っていきます。このとき色は[R:0 G:0 B:0]にしてください。（サンプルは灰色使ってしまってます…使っても問題はないです。）
こんな感じになりました。

スウォッチに登録

「始点」「中間」「終点」の３つをスウォッチに登録します。
スクショで説明が難しいので動画で（多分音量出てないはず）
まずは始点になるオブジェクトを選択し、スウォッチパネルにドラッグアンドドロップします。そうするとスウォッチに登録されます。
残りの「中間」「終点」の２つも同じように登録します。

スウォッチに全部で３つ登録してあれば大丈夫です。

パターンブラシの作成

ブラシパネルを開きます。表示されていなかったら【メニューバー＞ウインドウ＞ブラシ】で開きます。

次にブラシメニューボタンからから【新規ブラシ＞パターンブラシ＞OK】で「パターンブラシオプション」を開きます。

ここでさっき登録したスウォッチの出番です。
左から「コーナー」「中間」「コーナー」「始点」「終点」です。
なので画像で言う「②」「④」「⑤」だけを登録すればOKです！

サムネイル横の記号を押して登録したスウォッチを選びます。
「なし」の場合はその部分が空白になります。ぽんぽん当てはめます。
ここでやらかしたことに気づきます。このスウォッチの登録だとパターンになりません。上向きに配置されたものがずらっと並んでしまいます。

※オブジェクトは横向きで作りましょう！！！※
一応パターンオプション内でオブジェクトの左右上下反転できますが、反転ではなく回転しないと繋がらないってことになります。（反転でつながりそうなら大丈夫です）繋がらなかったらオブジェクトを横向きに置き換えて、またスウォッチ登録しなおします。
急いで向きを傾けました。

これで改めてパターンブラシ化していきます。

実際登録するとオプション画面内でプレビューされていると思うので確認しながらやると失敗することは少ないと思います。
始点にコントローラー、中間にコード、終点に刺し口で登録しました。
コーナーは自動生成されたものを設定しました。
コーナー部分はうまく繋がらないとパターンが不自然になってしまいます。
（それも味があって良しという場合ならいいです）
Illustratorがコーナーを自動生成して出ししてくれるので、自動生成された中で違和感のないものがあれば登録してしまっても大丈夫です。微妙なら、なしを選んでおけば大丈夫です。

彩色の方式を「なし」から「色相のソフト」を選びます。
あとはOK押せばブラシ登録設定おしまいです！

ブラシパネルをみるとさっき登録したブラシが表示されているはずです。

登録したブラシ設定の変更がしたい場合はブラシパネルのメニューの【ブラシオプション】で変更できます。（※このブラシを使ったパスは全て新しく設定されたブラシ設定が適用されます。）ブラシオプションを開いたあと左下のプレビューにチェックを入れておくと設定し直したもので表示されるのでわかりやすいと思います。

登録したブラシを使ってみる

ブラシツールを選択し、ブラシパネルから先ほど登録したブラシを選択します。

適当にぐりぐり〜っと書くと…こんな感じに！ブラシが適応されています！！

ブラシの色を変えたい場合はアピアランスから変更可能です。
アピアランスが表示されていなかったらメニューバーから【ウィンドウ＞アピアランス】で表示されます。

アピアランスパネルから「線」の色を変えればブラシの色も変わります。
アピアランスでは色だけではなくブラシの種類も変えることができます。
線だけではなくもっと細かく色変えしたい人は「パスをアウトライン化」して色を変更する方法もあります。（やりやすい方ででいいと思います。）

まとめ

やってみると簡単に作れる、アイディア次第ですごいものが作れるパターンブラシいかがでしょうか！
コントローラー描いて、別で線（コード）引いてやればいいじゃんとあとで気づく私です。コントローラはシンボル登録、コードをパターン化すればいいのかも？？？使い方は人それぞれなので！なんとも言えませんが！いちいち書くのが面倒くさそうなものはパターンブラシ化したほうが早いと思います。

例えば、円に沿って手をつないだ人達がいる絵とか形は一緒だけど表情が違う人の顔とかだったらパターンブラシで作ったほうが早そう。

おまけ

跳ねてる（？）うさぎとコードのみパターンブラシです。
コードパターンブラシが使いやすい！束ねた感じとか、丸まってるコードの雰囲気をいい感じに表せます！コードで文字も書ける！良き！

【追記】開始と終わりのオブジェクトが歪んでしまう…！

こんな感じに開始と終わりがぐにゃとなってしまう場合はアンカーポイントのハンドルの向きを調整すると比較的綺麗になります。

ダイレクト選択ツールを選択後、開始のアンカーポイとを選択しハンドルを出します。
ハンドルを掴み調整していきます。綺麗に見える位置までハンドルを動かして完成です！
実際直していく動画です。