Illustrator│ピクセルパーフェクトな素材を作るための環境設定

Illustratorで、1ピクセル内にぴったりとはまる素材を作るための作業環境の構築方法を紹介します。

解像度に対してドットバイドットで正確に配置するため、CC2017以降のバージョンを推奨します。

Illustrator 2017以降の設定

1. ドキュメントの設定

1. ファイル > 新規 を選択
2. Web タブを選択
3. 解像度を入力し、単位をピクセルに設定
4. カラーモードをRGBに設定

2. 表示の設定

1. 表示 > ピクセルプレビュー をオン
2. 表示 > グリッドを表示 をオン

3. 環境設定の変更

1. 編集 > 環境設定 を開く
2. ガイド・グリッド を選択
3. グリッドを8px、分割を1に設定（好みに応じて調整）

4. ピクセルスナップのオプション

1. 右上の磁石アイコンを押し、スナップオプションを確認
2. オブジェクト > ピクセルを最適化 でピクセルにぴったり合うよう調整

Illustrator 2014以前の設定

Illustrator 2014以前のバージョンでは、新規オブジェクトをピクセルグリッドに整合 という機能がありました。

しかし、この機能はパスと描画がずれる問題があったため、慎重に使用する必要があります。

まとめ

IllustratorでUI素材を作成する際、ピクセル単位で正確に配置しないと、書き出した画像のアンチエイリアスが崩れることがあります。

CC2017以降ではピクセル単位の作業環境が大幅に改善され、より快適にデザインできるようになりました。

Illustratorを活用し、精密なピクセルパーフェクトの素材を作成しましょう！