OWIEです。webのデザインをイラストレーターやXDで作成した際に問題になるのがオブジェクトサイズの端数。書き出しの際の素材がモヤる原因を取り除いて時短をしてみてはいかがでしょうか？

イラストレーターの場合

環境設定の設定

1. ガイド・グリッドの項を表示
2. グリッド設定を「グリッド：72px／分割数10」に設定

表示欄の設定

1. 「グリッドにスナップ」をチェック

これでやってみると…

おお、ストレスフリー！イラストレーターはオブジェクトを感覚で配置できるのが利点ですが、コーディング時は流石にそうは行かないので、最初に設定を行うとデザイン〜コーディング間のやり取りがスムースになると思います。

XDの場合

「Remove Decimal Numbers」というプラグインを導入します。オブジェクトを配置やリサイズ後に実行を行うと、サイズの小数点以下を切り捨ててくれます。

プラグインをインストールする

1. 「プラグインを見つける」を開く
2. 「Remove Decimal Numbers」を検索
3. インストールを行う

画面上で実際に実行する

対象オブジェクトを選択した状態でプラグインを実行すれば整数にしてくれます。
これで画面上でもモヤが解消されて気持ち的にもスッキリですね。

• シェア
• Tweet