Photoshopのモックアップが流行ってるっぽい今日この頃ですが、
ラフをIllustratorで作るデザイナーは多いと思います。印刷から移った人などは特に。
イラレで作られたラフの何がウザいかって、やたらとボカシのかかるあの無駄なアンチエイリアスじゃありませんか?
そのままスライスすればサイズが変わり、1pxで済むはずのラインがアンチエイリアスで2pxになったりと、それが嫌でわざわざPhotoshopで作り直した覚えのある人はきっと多いはず…。

ある設定をすればこのイラレ特有のアンチエイリアスを一掃することが出来ます!
メールで送りつけるもよし、メッセンジャーで送りつけるもよし、Twitterで(ry
ピクセルベース化する設定方法をテキストでまとめてみたので、アンチエイリアスかかりまくったラフを作るデザに教えてあげましょうw

IllustratorをWebデザイン向けの設定にする手順

  1. 編集メニュー最下部にある【環境設定】を選択して、『一般』タブを開く
  2. 『一般』内にある「プレビュー境界を使用」にチェックを入れる
  3. 『単位・表示パフォーマンス』タブへ移り、一般のセレクトメニューを「ピクセル」に変更
  4. 表示メニュー上部にある【ピクセルプレビュー】にチェックを入れる。ショートカットはAlt+Ctrl+Y
  5. 表示メニュー下部にある【ピクセルにスナップ】にチェックを入れる。ショートカットはShift+Ctrl+”
  6. 表示メニューにある【定規を表示】にチェックを入れ、アートボードの左上に原点を変更する

※ピクセルプレビューのチェックは新規作成する度に必要。

アートボードの原点変更手順
上記のステップ5まで終了していると想定します。
初期設定の原点は左下ですが、左上に変更すれば座標がWebと同環境になります。

  1. カーソルを【選択ツール】に変更
  2. ドキュメント左上にあるルーラーY軸とX軸が交差する□をクリック
  3. クリックして十字キーになった状態のまま、アートボード左上までドラッグ

アートボード基準点変更