読者です 読者をやめる 読者になる 読者になる

Two hats

Design + technologies

llustratorでUIデザイン:相対座標書出しスクリプト

illustrator JavaScript UIデザイン Webデザイン ExtendScript

寸法っていちいち手作業で測って指示書作るのって一苦労なんですよね。

Web系は指示書を自動化するツールがでてきているみたいですが、組み込み系のソフトウェアは使っている言語が違うのでそうもいきません。

そこで汎用的に使えるillustratorで寸法指示するときに便利なスクリプトを作ってみました。

相対座標.jsx


スクリプトをダウンロードして、イラストレーターのスクリプトフォルダに保存して下さい。
私のWindows7では以下のフォルダに入れています。
C:¥Program Files¥Adobe¥Adobe Illustrator CS6 (64 Bit)¥Presets¥ja_JP¥スクリプト

illutratorを起動して、「ファイル>スクリプト>相対座標」を選択すると実行します。


2つのオブジェクトを選択して実行すると、2つのオブジェクトの相対座標を描いてくれます。

オブジェクトが重なっていない時は、その間隔を描きます。

f:id:two-hats:20140830054303g:plain


このときCtrl or Commandキーを押しながらだと寸法線をアートボードの外に描きます。

f:id:two-hats:20140902221320g:plain

オブジェクトが重なっているときは、台座となるものの左上からの相対座標を描きます。

f:id:two-hats:20140830054420g:plain

同じくCtrl or Commandキーで寸法線を外側に描きます。

f:id:two-hats:20140902221409g:plain

オブジェクトを1つ選んだときは原点からの絶対座標を描きます。

f:id:two-hats:20140830054514g:plain

こちらもCtrl or Commandで外側に描けます。

f:id:two-hats:20140902221443g:plain

iilustrator上で原点を動かすとそこからの距離を測ってくれるので、ポップアップなど左上の位置を適宜調整してください。

※このスクリプトでは1px以内の誤差がでるときがあります!
illustrator上では座標が1pxなど整数で表示されていても、スクリプト上では1.2468571628…と小数点まで表示されています。

数値の丸めこみが単純に四捨五入ではないようなので、どのタイミングでどのように丸める処理をしているのかがまだ把握できていません。

現在調査中ですが、今のところ1px以内の誤差が起こりうることを理解した上で使って下さい。

ご要望などありましたらコメント下さい。