こんにちは。
今回は、ポリゴンのパターンをIllustratorで作成する方法を紹介します。
繋ぎ目のない、シームレスなパターンの作成方法です。
WEBデザインでもよく見かけますよね。
作成手順
まずはじめに、300×300のアートボードを作成します。
![ポリゴン作成方法](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon1-1.jpg)
上のような感じでペンツールで三角を描いて敷き詰めていきます。
コツは、アートボードの三つの隅に三角の角が来るようにします。三角は大きいものや小さいものバラバラに書いていきます。上の画像のようにL字型に。
![ポリゴン作成方法、ダイレクト選択ツール](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon2.jpg)
ダイレクト選択ツールに切り替えて、
![ポリゴン作成方法、角を選択](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon3.jpg)
アートボードの角にあるアンカーポイントをまとめて選択します。
![ポリゴン作成方法、アートボードに整列](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon4.jpg)
整列パネルの「アートボードに整列」を使って、端になるように整列させます。
これを三つの角に施します。
![ポリゴン作成方法、着色する](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon5_.jpg)
そしたら適当にグレーの色を付けていきます。好き勝手着色して下さい。
選択ツールで全ての三角を選択して、ツールバーの「オブジェクト」→「変形」→「移動」を開きます。
![ポリゴン作成方法、水平方向に移動](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon6.jpg)
アートボードの長さを水平方向にマイナスしてコピーします。
![ポリゴン作成方法、三角を選択](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon7.jpg)
そして、再度元の三角の塊を選択します。
![ポリゴン作成方法、垂直方向に移動](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon8.jpg)
次は垂直方向にコピーします。
![ポリゴン作成方法、コピー後](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon9.jpg)
アートボードに入っていない不要な三角は消してもOKです。
![ポリゴン作成方法、不要な三角を削除](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon10.jpg)
そしたら、ペンツールを使って隙間を埋めていきます。
![ポリゴン作成方法、線を非表示](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon11.jpg)
三角の線もいらないので非表示にします。
![ポリゴン作成方法、パターン化](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon12.jpg)
選択ツールで全て選択して、「オブジェクト」→「パターン」→「作成」を選択。
![ポリゴン作成方法、パターン範囲調整](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon13.jpg)
出てきたパネルの左上をクリックするとパターンにする範囲を調整できます。
![ポリゴン作成方法](http://code-r-dev.com/wp/wp-content/uploads/2017/08/polygon14.jpg)
アートボードの範囲をパターン化します。
これで、パターンが追加されました。慣れれば結構簡単にできます。
また、画像として書き出しておけばPhotoshopでも利用できますね。