illustrator CC2017のピクセルグリッド機能

LINEで送る
[`evernote` not found]
Pocket

illustrator CC2017からピクセルグリッドの扱いが変更

今回はillustrator CC2017から変更になったピクセルグリッドの機能について解説していきます。今まで【変形パネル】の最下部にあったチェックボックス【ピクセルグリッドに整合】、または【変形パネル】の右上のメニューからアクセスできた【新規オブジェクトををピクセルグリッドに整合】などの機能が、今回アップデートされたCC2017からさらに使いやすくなり、今まで以上にカンタンにピクセルパーフェクトなデザインが可能になりました。
※本チュートリアルはCC2017を使用しています。

ピクセルパーフェクトなデザインをカンタンに

ピクセルグリッド整合の機能を使用するシーンは人によって様々かと思います。ウェブデザイン、アイコンデザイン、UI/UXデザイン等。今までのillustratorはピクセルパーフェクトなデザインをする上で少し面倒くさい設定や知識を必要としていましたが、このバージョンアップでピクセルを意識することなく、キレイなデザインができるかと思います。

ピクセルグリッドの整合の適用方法

基本的にillustrator CC2017では新規にドキュメントを作成した時点でピクセルグリッドに整合したデザインが可能となっていますが、旧バージョンファイルや個別にピクセル整合したいオブジェクトがある場合は以下の3つの方法でカンタンにピクセルグリッドに整合できます。

あらかじめピクセル整合したいオブジェクトを選択後、

  • illustrator画面の上部にある【コントロールパネル】の右端にある2つのアイコンの左側のアイコン。
  • illustratorメニューの【オブジェクト】→【ピクセルを最適化】
  • オブジェクトを選択した状態で、右クリックで【ピクセルを最適化】

以上でキレイにピクセルにスナップしたデザイン制作がカンタンにできます。

個人的にお勧めなのは(3)で、手数もマウスの移動も最小限で済みます。以前のピクセルグリッドの機能に比べてとても使いやすくなりましたね。

ピクセルグリッド整合の設定

ここからは、設定を変更する方法です。制作者によってはピクセルグリッドに対しての挙動の好みもあるかと思いますので、細かい設定をして自分の使いやすい設定に変更可能です。
ピクセルグリッド整合の設定は【コントロールパネル】右端にある2つのアイコンの右側の下矢印をクリックします。すると、以下のような3つの設定が可能なウインドウが表示されますので、好みの設定をしてください。

●描画時にピクセルにスナップ
新規にオブジェクトや線を描いたりする場合にすぐにピクセルにスナップしている状態です。基本的にはこれで問題ないかと思います。
●移動時にピクセルにスナップ
オブジェクトを移動した際にもピクセルにスナップしている状態です。ドラッグ&ドロップなどで任意の場所に移動してもキレイにスナップします。
●拡大・縮小時にピクセルにスナップ
オブジェクトを拡大・縮小した際にもピクセルにスナップしている状態です。

ただし、「拡大・縮小時にピクセルにスナップ」は単一オブジェクトではキレイにスナップしますが、複数オブジェクトがグループ化している状態での拡大・縮小をすると、ピクセルがにじみます。この場合の解決策として、にじんだオブジェクトを後から【ピクセルを最適化】すれば問題ないですが、意図しない変形をする場合があるので、調整が必要となります。

illustratorはピクセルが苦手だなんてもう言わせない!

長年言われ続けてきたillustratorのピクセル問題はほぼ解決したと言っていいでしょう。これからは積極的にillustratorでウェブやモバイルのデザインをしていきたいですね!

LINEで送る
[`evernote` not found]
Pocket

Leave a Reply

Your email address will not be published. Required fields are marked *

CAPTCHA