WEB用のIllustratorの設定はこのようにするといいでしょう
>【環境設定】>【単位】ですべて『ピクセル』に設定
>【環境設定】>【一般】でキー入力を『1px』に設定
>【環境設定】>【ガイド・グリッド】でグリッドを『10px』分割数を『10』に設定
>【カラーモード】を「RGB」に設定
>【新規オブジェクトをピクセルグリッドに整合】のチェックを外す
>『変形パネル』内で、[ピクセルグリッドに整合]にチェックを入れる
>『アピアランスパネル』の設定の「新規アートに基本アピアランスを適用」のチェックを外す
>『線パネル』の設定の「線の位置」を「線を内側に揃える」に変更する
>『整列パネル』の設定の「プレビュー境界を使用」にチェックをつける
>【表示】>【ピクセルプレビュー】にチェックを入れる。(ドラッグした時にXY座標が必ず整数値になります)
>『変形パネル』の「ピクセルグリッドに整合」のチェックを外す
Illustratorからretinaディスプレイ用の画像をスライスするには
こちらからインストールします → 素早く画像書き出しできるillustrator向けスクリプト
画像を選択して
【ファイル】>【スクリプト】>【quick-exporter】を選択する
だけです、レイヤー名がファイル名になります。
とても簡単ですのでオススメです。
http://3fl.jp/nis006
おおまかな手順は以下のとおりです。
・レイヤー『//artboards』にアートボードサイズの矩形を複数配置
↓
・全ての矩形を選択して、スクリプト【Rebuild Artboards】を実行し、アートボードを一気に作成
↓
・スクリプト【Export Artboards by Dialog】で全アートボードの画像を書き出し
最近のイラストレーターではそのままCSSを吐き出す機能が備わっていますが
まだまだ実用に耐えるものではありません
こちらのスクリプトを利用すると良いでしょう。
■ Hot Door - MultiPage - Overview
https://www.hotdoor.com/multipage
は最新のIllustratorに対応していません。
そこでIllustratorのJavaScriptを利用して似たような機能(ページ切り替え)を
実現します。
「change_layer_down.jsx」「change_layer_up.jsx」をコピー
おすすめは
【コマンド】+【オプション】+【b】にchange_layer_down.jsx
【コマンド】+【オプション】+【n】にchange_layer_up.jsx
ロゴを制作するときなど、任意のテキストを全てのフォントで見てみたい時があります。 そんな時にこのIllustrator用JavaScriptが便利です
https://pgmemo.tokyo/data/filedir/788_2.zip
// fontsample.js Version 1.00
font_size = 30;
type_text = '';
type_text = prompt("テキストを入力してください。そのままリターンを押すと自動で設定されます。","");
// システムにインストールされているフォント全てを走査
for (i=0; i<app.textFonts.length; i++){
installed_font_name = app.textFonts[i].name;
txt = '';
if (type_text!=''){
txt = type_text;
}
else{
txt = installed_font_name;
}
textObj = activeDocument.textFrames.add();
textObj.contents = txt;
textObj.translate(0,i*font_size);
text_fonts_obj = app.textFonts.getByName(installed_font_name);
frames = app.activeDocument.textFrames;
j = frames.length-1;
frames[0].textRange.characterAttributes.textFont = text_fonts_obj;
frames[0].textRange.characterAttributes.size = font_size;
}
【アプリケーション】>【Adobe Illustrator CS4】>【プリセット】>【ja_JP】>【スクリプト】に「fontsample.jsx」
を置いて、イラストレーターを再起動します (Windowsも同様のフォルダに置きます)
メニューの
『ファイル』>『スクリプト』>『fontsample』
から起動します。 起動すると作成したい文字を聞かれますので入力します。 (そのままEnterを押すと、フォント名で作成されます。) 入力すると一覧が作成されます。
わざわざスクリプトを実行するのが面倒な方はこちら https://www.fontshare.com/
// 1. 現在選択されているテキストがあるかどうかを判別する
selectedObj = activeDocument.selection;
if( selectedObj.length == 0 ){
alert("選択されているテキストはありません");
}
// 2. 全てのテキストを走査し、textFontプロパティを表示する
frames = app.activeDocument.textFrames;
for(i=0; i < frames.length; i++){
family = frames[i].textRange.characterAttributes.textFont.family;
style = frames[i].textRange.characterAttributes.textFont.style;
f_name = frames[i].textRange.characterAttributes.textFont.name;
size = frames[i].textRange.characterAttributes.size;
typename = frames[i].textRange.characterAttributes.typename;
t_contents = frames[i].textRange.contents;
alert("textFontプロパティ\n"+"family : "+family+"\nstyle : "+style+"\nname : "+f_name+"\nsize : "+size+"pt\n"+"typename : "+typename+"\n----- contents -----\n"+t_contents);
}
function change_fillcolor(obj,r,g,b)
{
var my_color = new RGBColor();
my_color.red = r;
my_color.green = g;
my_color.blue = b;
obj.textRange.characterAttributes.fillColor = my_color; // 塗りの色を指定
}
function change_strokecolor(obj,r,g,b)
{
var my_color = new RGBColor();
my_color.red = r;
my_color.green = g;
my_color.blue = b;
obj.textRange.characterAttributes.strokeColor = my_color; // 線の色を指定
}
***■IllustratorのJavascriptでフォント(書体)を指定する http://www.openspc2.org/book/IllustratorCS/easy/039/index.html
***■【Illustrator】同フォント・同サイズのテキストオブジェクト選択 http://goo.gl/DQZew
***■ Adobe Illustrator CS5 Scripting Reference【CS 5 用リファレンスpdf】 http://goo.gl/doHXD
***■ Adobe Illustrator CS4 Scripting Reference【CS 4 用リファレンスpdf】 http://goo.gl/G7bRR
マニュアルや企画書などの書類を作成するときに非常に便利です。
http://www.org44.com/blog/2008/0815_1120_index.php
インストール方法は
アプリケーション>Adobe Illustrator CS3>プリセット>スクリプト
に .jsx ファイルを置くだけ
http://shspage.com/aijs/#arrow
http://www.pictrix.jp/ai/index.html
http://www.openspc2.org/book/IllustratorCS/
http://www.pictrix.jp/?page_id=28
インストール方法は
【アプリケーション】>【AdobeIllustrator】>【プリセット】>【スクリプト】
にファイルをコピーしてからIllustrator CS を再起動。
【ファイル】【スクリプト】に項目が表示されているので選択して使用します。