アートボード上に方眼グリッドを設定する方法と、方眼グリッドがコンテンツの整列とサイズ調整に役立つ理由について説明します。

必要な情報

このサンプルファイルは、このチュートリアルの学習内容の練習に使用できるAdobe Stock素材です。このチュートリアル以外でサンプルファイルを使用する場合には、Adobe Stockのライセンスを購入してください。このサンプルファイルの使用に適用される利用条件については、フォルダー内のReadMeファイルを参照してください。

学習した内容:アートボード上で方眼グリッドを適用および編集する方法

モバイルアプリをデザインしたり、アイコンなどのコンテンツを描画する際に、グリッド(縦と横の線があるグリッド)を使用すると、サイズ調整や整列をすばやく簡単におこなうことができます。

方眼グリッドの適用

  • 選択したアートボードに方眼グリッドを適用するのは簡単です。1つまたは複数のアートボードを選択し、プロパティインスペクターの「グリッド」セクションで、メニューから「方眼」を選択します。メニューの左側にあるオプションを選択してください。デフォルトの方眼グリッドが適用されます。

方眼グリッドの編集オプション

選択したアートボードに適用した方眼グリッドを編集するためのオプションがいくつかあります。

  • 方眼の大きさ:方眼グリッド内のグリッド線の間の距離です。数値が大きくなるほど、グリッドが大きくなります。デフォルト値の8を使用するとグリッドサイズが8 ptになります。これは、アプリのデザインで一般的に使用される値です。デザインに応じてサイズを調整できます。アートボードごとに異なる値に設定することが可能です。
  • カラー:プロパティインスペクターの「グリッド」セクションで「カラー」オプションをクリックすると、グリッドのカラーを変更できます。これにより、グリッドがデザインコンテンツ上に置かれたときの見やすさを調整できます。

カスタム方眼グリッドの保存と適用

  • 今後作成するアートボードに適用できるように、現在の方眼グリッドを新しいデフォルトとして保存するには、プロパティインスペクターの「グリッド」セクションで「初期設定にする」ボタンをクリックします。選択したアートボードの方眼グリッドオプションが、デフォルトの設定として保存されます。

プロパティインスペクターの「グリッド」セクションで「初期設定に戻す」ボタンをクリックすると、選択した(方眼グリッドを適用した)アートボードに新しいデフォルト設定を適用できます。

このページは役に立ちましたか。