カテゴリ:イラストレーター > クリッピングマスク

このエントリーをはてなブックマークに追加 Share on Tumblr Clip to Evernote 編集




◆ スクリプト300本超が使い放題!マガジンをおすすめします。
有料スクリプトはnoteからご購入ください(要ログイン)。
ノート(単品)かマガジン(1000円)が選べますが、すべてのスクリプトが手に入るマガジンをおすすめしています。
GOROLIB DESIGNスクリプト一覧と一括ダウンロード


◆ はじめての方はこちらから
新しいスクリプトはわかったわ。じゃあどうしたらいいの?という方へ


◆ 仕事がなくなっちゃう(笑)スクリプトはオーダーメイドが最強です
いつもいつも苦労しているアノ作業。一瞬で終わると人生観かわります(ホントです^ ^)




■問題はスクリプトよりも下準備にあったんです!無料プレゼントもありますよ^ ^   
(クリックで拡大します) 
おつかれさまです。@gorolibです。

唐突ではありますが、ずーっと気になっておりましたDTPにおける画像配置のワークフローにつきまして。

スクリプトを通じて何やらその「真理らしきもの」がぼんやりと見えてきましたので、報告いたします。

─────

今年の最高傑作と自負しております(自分で^ ^)「イラストレーターでたくさんの画像を全自動リンク配置するスクリプト4」は、もはやインフラ、なくてはならないスクリプトとなりました。


このスクリプトを使うと、ホントに作業時間が20分の1くらいになります。つまり20分が1分でおわる。今年の最高傑作の所以です。

しかし作業工程だけを洗い出しても(かなりのショートカットではありますが)とても20分の1になんかなるはずがない。

はぁ〜なんだろなぁ〜(稲川風)

と悩んでいたのですが、急にわかりました。結論から申し上げると、作業のやりなおしがゼロになったのです。

※これは私個人の例ですので「おバカでしたねぇ(笑)」と笑ってくださいませ。


■まちがいだらけの「いきなり配置」


このスクリプトの使い方は、
(1)オブジェクトを選択する
(2)スクリプト起動
(3)画像を選ぶ(オブジェクトが長方形のクリッピングマスクになる)
というたった3工程しかありません。

しかしスクリプトを作ってわかったのは、下準備である(1)に該当する作業を今までやっていなかったということです。

具体的には画像配置が必要になったときは、ノープランでいきなり配置コマンドを実行していました。大きさや位置について何の目安もなくいきなり画像配置していたのです。

すると高確率でこうなります^ ^(図Bを参照)
(デカっ!クリックで拡大します)
そのあとBを拡大縮小したり、移動したり何かと比べたりして「その配置画像の大きさの妥当性」を探るわけですが、いきなり配置〜大きさの妥当性を探る作業は実は盛大なムダなのです。


■最初にAの枠を用意せよ


つまり「最初にAの枠を用意せよ」ということだったのです。スクリプトなしならば「Aに該当するような、大きさの目安を用意しておけ」ということです。

大きさの目安となるものを用意せよ

これが「画像配置のワークフローの根底からの見直し」でございます。このスクリプトはAさえ用意しておけば、ワンタッチでクリッピングマスクまでかけてくれるのですから、便利この上ない(自分で^ ^)

じゃあこのAをどうやって決めるのか?

これは「お手軽な道具論」にはおさまらず、デザインレイアウト論まで遡及してしまうので、私などが太刀打ちできる範囲ではありません(笑)

ありませんが、それでも納品までには一意に決めているわけで(当たり前ですが)、私の場合はラフスケッチがほぼ全てでございます。あくまで一例として参照くださいませ。


少なくとも「そもそも決めづらいAをスクリーン上で試行錯誤しながら決める」というのが完全なナンセンス、盛大なムダであることはわかっていただけると思います。


■ほぼ一発で!たまに微調整あり


念のため、このスクリプトの仕様を再記述しておきます。

<仕様>─────
(1)選択した画像(複数可)を、選択したオブジェクトのバウンディングボックス枠に配置します
  →注:選択したオブジェクトは枠に変換したあと、削除されますのでご注意を!
(2)拡張子はjpg、png、psd、eps、pdfが対象です
(3)配置先のワクに合わせて拡大縮小します(ワクが埋まるような倍率で)
(4)さらに位置も配置先のパスアイテムに合わせてくれます
(5)さらにさらに選択したワクでクリッピングマスクもかけてくれます
(6)ファイル名順に、配置先は左上から右下の順に配置します
(7)配置先のワクが足りなくても、画像が足りなくてもどちらでもOK!
(8)プレビュー境界にもクリッピングマスク枠にも対応します
─────

つまりポテチを食べながらでも一発で適正配置ができるのです。

あとは微調整。解像度が足りる範囲での拡大・縮小や上下左右の移動など、ほんのわずかな作業しかありません。



■解像度の検討は配置してから


さて、ここまでいっさい解像度の話が出てませんが、実は解像度は配置した後にチェックすればよいと考えています。

つまりAの大きさも決めていないのに解像度の話などナンセンスなのです。元々の解像度(Photoshop上で確認できる解像度)とは別で、Illustrator上で拡大縮小すれば、配置画像の解像度は変化します。

175dpiしかない画像でも、Illustrator上で50%縮小することで350dpiになるのですから。

もちろんAが決まったら計算で出してもいいんですが、酔狂が過ぎますよね?(笑)

実際にこのスクリプトで配置し、コントロールバーで確認すればいいんですから。
(ここ)
なので、このコントロールバーに表示される解像度をスクリプト取得する方法を探っているわけでございます。はい。



ここではじめて「解像度が不適切」な場合は、縮小するか写真を差し替えるかという議論に持っていけるわけです。一意に決めるための変数がたくさんあるのに、条件式が揃わないまま右往左往している数学のようなものですね(ちがうかな^ ^…)


また元画像のリサイズを行うのもこの後です。表現する大きさが決まらなければ解像度も決まらないのですから当然です。解像度が1000(!)になっちゃった場合とかですね。


■「写真そのものが意匠」である場合はまったく別です


さて、ここまでのお話は「写真そのものが意匠」である素材には当てはまりません。単純に数学パズルのようなはめ込みの話でございます。


「写真そのものが意匠」(絵画や大先生カメラマンの作品などトリミング不可の素材)である場合は、素材によって判型を決めることになるでしょう。素材中心にいろいろな要素が回ります。


クリッピングマスクではめ込むなんておこがましい。どうやったらその素材を活かせるか?という議論になりますので、ちょっと今回の議論からは外しておきましょう。


もっとも…そのような高尚な素材は扱ったことがないのですけどね(笑)


■というわけでプレゼントです!


はい、クリスマスなのでプレゼントがあります。


は有料スクリプトですが、ぜひともこの「全自動の快感」を味わっていただきたく、
ひとつの画像だけを全自動リンク配置するスクリプト
を無料提供いたしますので、どうぞご利用ください! タイトルなし
<スクリプト名>

※たぶんmacOSのみ対応ですが、Windowsでもできた!という方はコメント欄にて報告いただければ幸いです(拡張子フィルタが違うんですよね…)

<使い方>
(1)オブジェクトをひとつだけ選択する
(2)スクリプトを起動
(3)画像をひとつだけ選ぶ
─────

なお、たくさんの画像をいっぺんに配置したい!という方はこちらからどうぞ。


本日のテーマについて「そんなん当たり前やん!」という方は、どうぞ大目に見てくださいませ…。

お役に立てれば幸いです!ではでは出羽の海。


(追記161222)
肝心のワークフローそのものの記載を失念しておりました…(それな!笑)

■あたらしい画像配置ワークフロー

(1)目安のオブジェクトを選択する(*1)
(2)全自動配置スクリプトを起動する
(3)画像を選ぶ(*2)
(4)ダイレクト選択もしくはグループ選択ツールにて、拡大縮小・移動などで微調整する
(5)解像度が明らかに不足している場合はクライアントに相談する

(*1)…目安のオブジェクトはクリッピングマスクの枠となります。このオブジェクトの種類は問いませんが、すべてバウンディングボックス形状(長方形)に変換します。なお目安のオブジェクトを画像(クリッピングマスク画像でもOK)にすれば、一瞬で画像の入れ替えが可能です。

(*2)…対象画像はあらかじめPhotoshopなどでトリミングしておいたほうがベターです。Illustrator上で調整するのでバチッと決めなくても大丈夫ですが、あきらかに不要な部分は切り落としたほうがやりやすいです。料理で言えば下処理のようなものですね。

─────


お役に立ちましたらツイートお願いします!




このサイトで配布しているイラストレーターのアクションやスクリプトファイルを無断で転載・配布・販売することを固く禁じます。ご紹介いただける際は必ずURLリンクにてお願いいたします。 このサイトで配布しているイラストレーターのアクションやスクリプトファイルの使用で、ファイルの破損やアプリケーションに不具合が発生した場合でも、責任は負いかねますのでご承知おきくださいませ。自己責任での使用をお願いいたします。

© 2017 GOROLIB DESIGN
Released under the MIT license.





このエントリーをはてなブックマークに追加 Share on Tumblr Clip to Evernote 編集




◆ スクリプト300本超が使い放題!マガジンをおすすめします。
有料スクリプトはnoteからご購入ください(要ログイン)。
ノート(単品)かマガジン(1000円)が選べますが、すべてのスクリプトが手に入るマガジンをおすすめしています。
GOROLIB DESIGNスクリプト一覧と一括ダウンロード


◆ はじめての方はこちらから
新しいスクリプトはわかったわ。じゃあどうしたらいいの?という方へ


◆ 仕事がなくなっちゃう(笑)スクリプトはオーダーメイドが最強です
いつもいつも苦労しているアノ作業。一瞬で終わると人生観かわります(ホントです^ ^)




■できそうでできなかった!イラレ上での画像分割を可能にしました   

(クリックで動きます)
おつかれさまです。@gorolibです。

先だって公開しております、
について。

確かに良きところにガイドを引いて分割するのもいいてすが、等分割には向いていません。ちょうど半分のところにガイドを引くために、アンカーポイントなどで目安をつけておかないといけないですから。

─────

初心者の頃は、なんでイラレ上で画像分割できないのか悩みました。なんかできそうでしょう?

まあパスアイテムじゃないのでできないのは当たり前なんですけどね(もしできた場合のことを考えるとカオスなことがわかります)。

分割の方法としては画像をコピーして、それぞれを「分割されたように見えるように」クリッピングマスクで分けるしかないのです。

ガイドで分割のスクリプトにも書きましたが、これは非常にセンシティブで面倒。
─────
(1)分割したい位置に目安のガイドを引く
(2)クリッピングマスクを解除する
(3)元画像をコピーし最背面に貼り付ける(この時点で画像は2枚重なります)
(4)2枚の画像ともにロックをかけておく
(5)クリッピングマスク枠を選択する
(6)段組設定で2分割する
(7)スマートガイドをオンにする
(8)分割した境目の線をダイレクト選択してドラッグしガイド上で離す
(9)2枚の画像のロックを解除する
(10)1つめのクリッピングマスク用の枠と画像を「ひとつづつ」選択する
(11)クリッピングマスクをかける
(12)2つめのクリッピングマスク用の枠と画像を「ひとつづつ」選択する
(13)クリッピングマスクをかける
─────
そこで今回はガイドなしでも等分割ができるようなスクリプトを作りました。


■分割数を入力してタテヨコに割ります


今回のスクリプトが前回と違うのは
・ガイドなしでも分割ができる
・複数画像を同時に処理できる
・そして等分割にできる
ことです。


分割数の初期値は2ですが(半分にする)、数字を変更すればその数だけ等分割にできます。
ただしタテヨコは同時にできないので、例えばタテヨコ4分割にする場合はまずはタテに、次にヨコに分割してください。


■今回のスクリプト情報

(クリックで動きます)

<スクリプトファイル名>
G230_DevideHalfTate.jsx…タテに分割
G231_DevideHalfYoko.jsx…ヨコに分割

<使い方>
(1)分割したい画像を選択します
(2)このスクリプトを起動します
(3)分割数を入力します
<仕様>
(1)配置画像およびクリッピングマスク画像が対象です
(2)埋め込み画像には反応しません
(3)複数画像に対応しています

※タテかヨコか迷ったら「ナイフを入れる方向」と考えてください。タテに分割するスクリプトはタテ方向にナイフを入れると考えるとわかりやすいです。


お役に立てれば幸いです!ではでは出羽の海。


■ダウンロードはこちらから


https://note.mu/notes/n6002b779b7af



お役に立ちましたらツイートお願いします!




このサイトで配布しているイラストレーターのアクションやスクリプトファイルを無断で転載・配布・販売することを固く禁じます。ご紹介いただける際は必ずURLリンクにてお願いいたします。 このサイトで配布しているイラストレーターのアクションやスクリプトファイルの使用で、ファイルの破損やアプリケーションに不具合が発生した場合でも、責任は負いかねますのでご承知おきくださいませ。自己責任での使用をお願いいたします。

© 2017 GOROLIB DESIGN
Released under the MIT license.





このエントリーをはてなブックマークに追加 Share on Tumblr Clip to Evernote 編集




◆ スクリプト300本超が使い放題!マガジンをおすすめします。
有料スクリプトはnoteからご購入ください(要ログイン)。
ノート(単品)かマガジン(1000円)が選べますが、すべてのスクリプトが手に入るマガジンをおすすめしています。
GOROLIB DESIGNスクリプト一覧と一括ダウンロード


◆ はじめての方はこちらから
新しいスクリプトはわかったわ。じゃあどうしたらいいの?という方へ


◆ 仕事がなくなっちゃう(笑)スクリプトはオーダーメイドが最強です
いつもいつも苦労しているアノ作業。一瞬で終わると人生観かわります(ホントです^ ^)




■マイブーム到来!ガイド基準でオブジェクト変形します   

(クリックで動きます。ガイドは赤くしています)
おつかれさまです。@gorolibです。
先般の記事にておわかりかと存じますが、このところガイドを使ったオブジェクトの変形にハマっております。




そう、ガイドを使ったスクリプトがマイブームなのです!

さて今回のスクリプトは、Illustrator上の配置画像をガイドで分割するものです。これも超面倒オペレーションな問題児でした…。

(こんなやつ)

■超ウルトラスーパー面倒くさい!


そう、配置画像は分割できないので画像を複製し、2つのパスアイテムをつくり、それぞれでクリッピングマスクをかけるしかありません。このオペレーションが超ウルトラスーパー面倒なんです。

すでにクリッピングマスクがかかっている画像(もっとも面倒!)を例にオペレーションを書きます。

(1)分割したい位置に目安のガイドを引く
(2)クリッピングマスクを解除する
(3)元画像をコピーし最背面に貼り付ける(この時点で画像は2枚重なります)
(4)2枚の画像ともにロックをかけておく
(5)クリッピングマスク枠を選択する
(6)段組設定で2分割する
(7)スマートガイドをオンにする
(8)分割した境目の線をダイレクト選択してドラッグしガイド上で離す
(9)2枚の画像のロックを解除する
(10)1つめのクリッピングマスク用の枠と画像を「ひとつづつ」選択する
(11)クリッピングマスクをかける
(12)2つめのクリッピングマスク用の枠と画像を「ひとつづつ」選択する
(13)クリッピングマスクをかける

ぐ、ぐはぁ〜(北斗琉拳カイオウの初登場シーンのような息で)

書くだけでつかれますねぇ、なんと13オペレーション。もうビール飲みたい!

まあやり方はいろいろあります。段組設定使わずに長方形を描いてもいいですし、画像ロックも別にかけなくてもいいんです。

ただこれくらい周到に準備しないと失敗しちゃうセンシティブで面倒な作業なのです。


■psd画像(背景)を塗り分けるための分割


さて、この画像分割についてはサンプルのような単純な分割はもちろんのこと、ロゴのラフ案などのpsd画像を、Illustrator上で塗り分ける際にも役立ちます。 40
(分割しないと塗り分けできないですからね)


tiff画像でおなじみのIllustrator上での着色、psd画像のままでもできるんです!

Photoshopを開き、
・グレースケールに
・レイヤーを背景に
してください。

レイヤーが背景じゃなくて「レイヤー0」などになっている場合、透明グレースケールの扱いになりますので、Illustrator上で着色できません。小一時間悩みますのでご留意を…^ ^;;)

レイヤーから背景に変更する処理は
Photoshop>レイヤー>新規>レイヤーから背景へ
です。
(前はレイヤーパネルオプションにもあった気がしますが、これも見つからないと小一時間悩みます…)


■ガイドを引くオペレーションは好き


このブログをご愛顧いただいている方にはおなじみですが、私はマウスポインタを使ったセンシティブなオペレーションを心からイヤがっております(笑)

センシティブなオペレーションとは「ものすごく気を使わないと成功しない操作」のことであり、例えばエリア文字のフレームをダイレクト選択して広げるとか、クリッピングマスクの枠だけを選択するとかそういうやつです。

ガイドを引くのもマウス操作なのでカテゴリー的には苦手な作業に入るはずなのですが、そうでもない\(^o^)/

むしろガイドを引く作業は直感(このくらいかな…)をPCに伝えるのには体感にマッチしたオペレーションのような気がします。結構好きなんですね。

で、そのガイドを基準にオブジェクト操作ができるスクリプトにハマっているというわけです。

───────────────
■今回のスクリプト情報

(クリックで動きます。ガイドは赤くしています)

<スクリプトファイル名>
G225_DevideByGuideTate.jsx…タテに分割
G226_DevideByGuideYoko.jsx…ヨコに分割

<使い方>
(1)分割したい画像の上にガイドを1本だけ引きます
(2)分割したい画像を選択します
(3)このスクリプトを起動します


<仕様>…タテに分割で説明します
(1)配置画像およびクリッピングマスク画像が対象です
(2)埋め込み画像には反応しません
(3)画像の選択はひとつだけです(複数選択の場合は反応しません)
(4)表示されているガイドのうち垂直ガイドのみ基準にします
(5)画像上に垂直ガイドが2本以上ある場合は反応しません
(6)なので1回に2分割までです。


<注意>
今回、かなり仕様に制限がありますが(かなりムズかった…)ふつうに使う分には問題ありません。
本当はタテヨコいっぺんに、何分割でもいきたいところではありますが、今の私のアタマではこれが限界でございます。いっぺんに複数画像を複数分割なんてことはあまりないでしょうから、ご了承くださいませ^ ^;;

4分割する場合は、タテ1回(2分割)、ヨコ2回(それぞれを2分割)でお願いいたします。
実際に業務でお使いになる場合タテとヨコどっちだっけ?と混乱するときがあります(私自身がそうでした…)ので、

ナイフを入れる方向

と覚えてくださいませ。例えばタテは「タテにナイフが入る」と認識しておくと使いやすいです。


お役に立てれば幸いです!
ではでは出羽の海。


■ダウンロードはこちらから


お役に立ちましたらツイートお願いします!




このサイトで配布しているイラストレーターのアクションやスクリプトファイルを無断で転載・配布・販売することを固く禁じます。ご紹介いただける際は必ずURLリンクにてお願いいたします。 このサイトで配布しているイラストレーターのアクションやスクリプトファイルの使用で、ファイルの破損やアプリケーションに不具合が発生した場合でも、責任は負いかねますのでご承知おきくださいませ。自己責任での使用をお願いいたします。

© 2017 GOROLIB DESIGN
Released under the MIT license.





↑このページのトップヘ