2015年11月19日木曜日

Ai_端が切れないパターン状の柄を作る

パターン状の柄がオブジェクトに合わせて半端に切れない方法です。


1月13日追記
高橋さんが後からオブジェクトをシンボルに変換するスクリプトを配布してくださいました。

1アクションでシンボルに変換できるのでおすすめです。
Illustratorのオブジェクトをシンボルに置き換えるスクリプトを作りました(CS5以降対応)
Illustratorのグループを一気にシンボルへ変換するスクリプトを作りました(CS5以降対応)
いつも素敵なスクリプトを配布してらっしゃるので、他のページもぜひご覧ください。



パターンを適用するとオブジェクトの端で半端にパターンが切れてしまいます。
あれがどうにかならないかなあと思ってシンボルに置き換える方法を考えてみました。
着物や帯の絞り柄のようなものを表現したい時や、ロゴ作成などにおすすめです。

ご報告と謝意

今回の記事は鈴木メモさんの記事、複数のオブジェクトを後からシンボルに変換するを基に考え、s.h’s pageさんの下記のスクリプトを使用させていただきました。

素晴らしい記事を公開していただいている鈴木メモさんと素敵なスクリプトを配布してくださっているs.h’s pageさんに大感謝!
いつも本当にお世話になっています。

ご案内

前回CC2015を導入した、と書きましたが、今回だけはCS5で作成します。CS6以降では変更された機能を使用するためです。

CS6以降でも再現できないというわけではありませんが、多少手間はかかります。

簡単な概要

今回は少しだけややこしいので先に簡単な概要を記します。

おおまかには3段階です。

オブジェクトにスタンダードなパターンを適用し、画像化。
 ↓
画像をパス化し、同時に半端部分を一括削除。
 ↓
残ったオブジェクトを〈後からシンボル化〉で完成。

ポイントは画像化したオブジェクトをパス化する行程です。行ったり来たりのような行程ですが、ここがないと半端部分を削除できません。

初めに準備

今回は、s.h’s pageさん作の下記の二つのスクリプトを使用します。
先にダウンロードし、使用可能にしておきます。
選択アンカーの位置に複製(選択アンカーの位置に複製.jsx)

スクリプトフォルダへのコピー方法

ダウンロードしたスクリプトを[Macintosh HD]→[アプリケーション]→[Adobe Illustrator CS5.1]→[プリセット]→[ja_JP]→[スクリプト]内にドロップしてコピー。
イラストレーターを一度再起動しておきます。
今回はCS5で書いていますが、CCでもフォルダ名が英字表記などの違いはあっても同じ場所にあります。

パターン状の柄が半端に切れない方法

1.オブジェクトにシンプルなドットパターン(※1)を適用し、ラスタライズ化(※2)。


ドットパターンを適用(※1)。

パターンをオブジェクトに合わせて縮小しておく。
拡大縮小はオブジェクトを選択した状態でツールパレットの[拡大・縮小ツール]をダブルクリック。ダイアログが表示されるので、オプションのパターンのみにチェックを入れて実行する。
(たまに縮小されない時がありますが、アピアランスパネル上で該当の塗りをクリックしてもう一度試してみてください。大体は解決します。)
ドットの一つ一つが仕上がり時にはシンボルに置き換わるので、仕上がりをイメージしつつパターンのサイズを決めてください。(※2)



※1 このパターンの並びが最終仕上がりの並びになります。お好みの並びのシンプルなパターンを用意してください。
私はスウォッチライブラリ内の[パターン]>[ベーシック]>[ベーシック_点]の中の、やや点が大きめのものをよく使います。
※2 ラスタライズ前のオブジェクトが小さすぎると、この後の行程で支障があります。適用したパターンが最低でも直径10px程度あるほうが無難です。

画像化する。

画像を選択した状態で[オブジェクト]>[ラスタライズ]>ダイアログで[高解像度]を選択してOK。
オブジェクトが画像化されます。
ラスタライズに時間がかかるようなら適宜解像度を下げて調節してください。



カラーモードはRGBでもグレースケールでも構いません。


画像化されました。


2.画像をライブトレースして調整する。

ここで使用する、[トレースオプション]の内容がCS6以降変更され、今回の肝である[最小エリア(CS6以降は[ノイズ])]で設定できる数値が大幅に狭まっています。(最大値が3000pxから100pxへ減少)そのため、今回はCS5を使用しています。
CS6以降で試す方はオブジェクトを一時的に大きくするなどで対応してみてください。


画像を選択し、コントロールバーの[ライブトレース]ボタン横にあるドロップダウンリスト(もしくは[オブジェクト]>[ライブトレース])から[トレースオプション]を選択。

(CCの場合:コントロールバーの[画像トレース]ボタン横のドロップダウンリストから[白黒ロゴ]を選択。ダイアログが出るのでダイアログ中腹にある、[詳細]をクリックして展開すれば同様のメニューがある。)


ダイアログが開くので、[カラーモード]を[白黒]、[ホワイトを無視]にチェックを入れる。[ぼかし]と[誤差の許容値]は [0]もしくは[0〜2]程度。
ここが大切で、[最小エリア]で半端部分を排除します。
[最小エリア]の値はプレビューを見ながら半端なオブジェクトが無くなるまで調整する。
(CCの場合:[最小エリア]= [ノイズ])


多少は欠けていても問題無いですが、最後に置き換えられるシンボルは全て同じ大きさになるので不要なものを残すと仕上がりが全体が乱れます。
↓半端なオブジェクトが消えました。


画像をパス化させる。

コントロールバー(もしくは[オブジェクト]>[ライブトレース])から[拡張]を適用。


↓パス化されました。



3.残りのオブジェクトをシンボルに置き換える。

ライブトレース後のオブジェクトはグループ化されているため、[オブジェクト]>[グループ解除]しておく。

以下、鈴木メモさんのページを参考に進めます。(引用許可はいただいています。)
画像はこちらで作り変えました。
●取り替えたいオブジェクトをまとめて選択し、スクリプトから、「オブジェクトの中心をつなぐパスを作成」を実行。ハート同士が線で一気につながれます。
●選択状態になっているハートオブジェクトを削除。

今回は[ハート]=[パターンのドット]ですが、進め方は同じ。

先ほどグループ解除 したオブジェクトを全て選択し、[ファイル]→[スクリプト]→[connect_centers_nearest(オブジェクトの中心をつなぐパスを作成)]を実行。


オブジェクトの中心を繋ぐ線が描画され、オブジェクトは選択状態になるのでそのまま削除。


●同じファイル上の隅っこで、新しくシンボルにしたいオブジェクトを1個作り、シンボルパネルにドラッグして新規シンボル化して用意します。
(※シンボルオプションの種類と基準点はどこでもいい。デフォルトでok。)
(※シンボルは後から気軽に内容を編集できるのでとりあえず適当な丸とか四角とかでもok。)

花柄をシンボルに変換。

置き換え用のオブジェクトをドットに近い大きさに調整し(大切)、シンボルパレットにドロップ。ダイアログが出ますが、そのままOK。



シンボル化してからサイズを調整するよりも、シンボル化する前のオブジェクトサイズをドットに近い大きさに調整しておいたほうが後々使い勝手が良いのでおすすめです。


●シンボルを1つパネルからドロップして配置し、先程出来た直線と一緒に選択。
●スクリプトから、「選択アンカーの位置に複製」を実行。シンボルが直線のアンカーポイントの位置に一気に配置されます。
●つないだ直線を削除。できあがり。

シンボルを配置していきます。

シンボルが前面にある状態で、先に作成された直線オブジェクトと一緒に選択し、[ファイル]→[スクリプト]→[選択アンカーの位置に複製]を実行。


直線のアンカーポイントの位置にシンボルインスタンスが一気に配置されるので、直線を削除して完成。


全てがシンボルインスタンスに置き換えられ、半端がないパターン状の柄になりました。

これで完成。



シンボルなので一括編集できる。

シンボルを使うメリットは、一度に編集が可能なことです。
シンボルを編集することでドキュメント上に配置されているシンボルインスタンスを一括で変更できます。
また、シンボルインスタンスを選択した状態で、コントロールバーの[置換]から他のシンボルに置き換えることができます。


ハートになりました。

よくあるドットでできた地図も色んな柄で作れます。




ドットでできた地図は、おそらく画像から[オブジェクト]→[モザイクオブジェクトを作成]→[効果]→[形状を変換]の行程で作る方が多いんじゃないかと思いますが、並びは変えられません。
今回の方法であれば最初に使用するパターンを変えたり、回転させることによって並びの位置まで好みに調整できるのでそこが利点かなと思います。

小ネタ

同じ並びで違う柄のパターンの量産

鈴木メモさんのページを基にもうひとつ。
この複数のオブジェクトを後からシンボルに変換するを利用することで、同じ並びで違う柄のパターンを簡単に量産できます。
CS5でももちろん、CCではパターン編集モード内でスクリプトが動くようなのでより素早く作ることができます。

シームレスでランダムなものが欲しければ、元々イラストレーターに入っている、スウォッチライブラリ内の[パターン]→[ベーシック]→[ベーシック_テクスチャ]内のパターンを利用するのもひとつの手です。


パターン編集モード内で置き換える時はシンボルを使うとうまくいかないようです。シンボル化していないオブジェクトを最前面においてスクリプトを実行してください。
(パターン内程度のオブジェクト量であればメリットもそんなにないです。一度パターン編集モードを抜けるとパターン内のシンボルは分割されてシンボルパレットとのリンクも解除されてしまいます。)

追記

トレースオプションの変更について

トレースオプションの内容がCS6から変更されていました。便利になっている部分もあるので改定、というべきなんでしょうけど、3000pxから100pxは減らしすぎでは?と感じました。
変更された当時は知らなかったので情報が得られてないんですけど、名称も[最小値]から[ノイズ]になっているので用途に応じて減らしたのかな。
面積を数値で調整できるのはこの機能だけで、私はけっこう好きだったので残念でした。
次回増やしてくれることを願ってここでひっそりお願いします!

イラストレーターでフォトショップの選択範囲が作りたい

今回の方法を考え始めた時、初めはシンボルへ置き換えるのではなく、フォトショップでの[選択範囲]が作れないかなあと考えていました。
選択範囲そのもの、が作れなくても[任意のオブジェクトに(見た目上)重なっているオブジェクトだけを選択]できるだけでずいぶん便利なので、そんなイメージでいろいろ試して結局方法は見つからず断念。
イラストレーターの選択ツール類では[なげなわツール]が矩形にとらわれなくて、一番近い働きをしているのでスクリプトなどで自動化できれば実現しそうな気もしてます。


ではでは、良かったらお試しください。
お読みいただいてありがとうございました。

0 件のコメント:

コメントを投稿

Related Posts Plugin for WordPress, Blogger...