AdobeXDでの調整と配布

Adobe XDで多くのオブジェクトの作成を開始したら、それらのオブジェクトの位置と、それらが互いにどのように関連しているかを考慮する必要があります。デザインのノイズを減らすために、アイコンとテキストをきれいに配置して分散させておく必要があります。グリッドの使用やガイドの使用など、いくつかの方法で配置を確認できます。

グリッドをオンにする

次の手順に従って、自分だけが表示できるグリッドをオンにできます。

レイヤーパネルでアートボードをクリックするか、作業領域のアートボードの上にあるアートボード名をクリックして、アートボードを選択します。

プロパティパネルの下部にあるグリッドのチェックボックスをオンにします。AdobeXDでの調整と配布

アートボードのグリッド機能をオンにします。

グリッドに別の色を使用する場合は、グリッドチェックボックスの右側にある正方形を選択し、カラーピッカーから色を選択します。[透明度]スライダーを使用して、不透明度のレベルを変更することもできます。

必要に応じて、チェックボックスの右側にある[グリッドサイズ]テキストボックスに値を入力して、グリッドのサイズを変更します。

ガイドについて賢くする

デフォルトでは、XDは必要に応じてオンになるガイドを提供します。これらはスマートガイドと呼ばれ、他のアドビ製品を使用する場合はおなじみのはずです。

スマートガイドを使用するには、作業中に表示される線と影付きの領域に注意を払うだけです。下の画像では、1つのひし形をドラッグすると、左側のひし形と位置合わせされていることを示すガイドが表示されることに注意してください。

AdobeXDでの調整と配布

スマートガイドを使用してオブジェクトを整列させることができます。

スマートガイドは配布にも役立ちます

オブジェクトの分布とは、最初のオブジェクトと最後のオブジェクトによって作成された境界ボックスの間のスペースを指します。ここでは、左側にいくつかのダイヤモンドの不均一な分布が見られ、右側に同じオブジェクトの分布さえ見られます。この例では、間隔は水平方向に均等に分散されています。

AdobeXDでの調整と配布

左側の不均一な分布とライド側の均一な分布。

オブジェクトを配置すると、オブジェクト間のスペースが等しいことを示す影付きの領域が表示されます。このシェーディングヒントは、Alt / Optionでドラッグしてオブジェクトのクローンを作成したときにも表示されます。

AdobeXDでの調整と配布

スマートガイドは、オブジェクト間にスペースがある場合のヒントを提供します。

整列および配布機能の使用

[オブジェクト]メニューと[プロパティ]パネルで使用できる整列および配布機能を使用すると、アイテムを一列に並べて夕方に間隔を空けることができます。

2つのアイテムを選択すると、配置機能を利用できます。3つ以上のオブジェクトを選択した場合は、配布機能を使用することもできます。

水平対垂直を決定する秘訣を覚えておいてください。地平線は水平です。ページ上で左から右に移動するものはすべて、水平方向に分散する必要があります。上から下に向かうオブジェクトはすべて垂直に配置する必要があります。

Leave a Comment

PDFファイルのセクションをスクリーンショットする

PDFファイルのセクションをスクリーンショットする

Adobe Acrobat CS5のスナップショットツールを使用して、テキストと画像の両方を選択し、PDFファイル内の特定の領域の画像を作成できます。結果は通常、PDFファイル内のセクションのスクリーングラブと呼ばれます。結果は画像であり、あなたのテキストはありません[…]

Photoshop CCでのピクセルの測定、カウント、分析

Photoshop CCでのピクセルの測定、カウント、分析

研究者や科学者向けに設計されたPhotoshopCCの測定機能は非常に強力です。おそらく顕微鏡や望遠鏡から、ほぼすべてを測定し、技術的な画像に含まれるものの数を数えることができます。画像内の要素の正確なサイズがわかっている場合は、ほぼすべてのものを見つけることができます[…]

Adobe CS5Illustratorの液化ツール

Adobe CS5Illustratorの液化ツール

Adobe Creative Suite 5(Adobe CS5)IllustratorのLiquifyツールを使用すると、単純な歪みから複雑な歪みを作成することで、オブジェクトを曲げたり、波打ったり、ねばねばしたり、とがったりさせることができます。Liquifyツールは、オブジェクトに対してあらゆる種類の創造的または奇抜な(見方によって)歪みを実現できます。君は […]

AdobeXDでテキストのプロパティを調整する方法

AdobeXDでテキストのプロパティを調整する方法

Adobe XDプロジェクトにテキストがある場合は、テキストのプロパティの変更を開始できます。これらのプロパティには、フォントファミリ、フォントサイズ、フォントの太さ、配置、文字間隔(カーニングとトラッキング)、行間隔(先頭)、塗りつぶし、境界線(ストローク)、シャドウ(ドロップシャドウ)、および背景のぼかしが含まれます。それでは、これらのプロパティがどのように適用されるかを確認しましょう。読みやすさとフォントについて[…]

InDesignCCでQRコードを作成する方法

InDesignCCでQRコードを作成する方法

InDesignを使用して、QRコードグラフィックを作成および変更できます。QRコードは、単語、数字、URL、その他の形式のデータなどの情報を保存できるバーコードの形式です。ユーザーはスマートフォンなどのデバイスでカメラとソフトウェアを使用してQRコードをスキャンし、ソフトウェアはそれを利用します[…]

PhotoshopCCでアートボードを操作する

PhotoshopCCでアートボードを操作する

Adobe Illustratorと同様に、Photoshopアートボードは、1つのドキュメント内に個別のページまたは画面を作成する機能を提供します。これは、モバイルアプリケーションや小さなパンフレットの画面を作成する場合に特に役立ちます。アートボードは、レイヤーパネルを使用して作成された特別なタイプのレイヤーグループと考えることができます。これは […]

Adobe IllustratorCCでテキストを折り返す

Adobe IllustratorCCでテキストを折り返す

Adobe Illustrator CCでテキストを折り返すことは、プレゼントを折り返すこととまったく同じではありません。簡単です。この図に示すように、テキストの折り返しは、テキストをグラフィックの周りに強制的に折り返します。この機能は、どんな作品にも少し創造性を加えることができます。グラフィックは、テキストを強制的に折り返しています。まず、[…]を作成します

Illustratorで図形のサイズを変更する方法

Illustratorで図形のサイズを変更する方法

Adobe Illustrator CCでデザインする場合、正確なサイズ(たとえば、2 x 3インチ)の形状が必要になることがよくあります。シェイプを作成した後、正確な測定値にサイズ変更する最良の方法は、この図に示すように、[変換]パネルを使用することです。オブジェクトを選択してから、[ウィンドウ]→[変換]を選択します[…]

SVGに透明度を適用する方法

SVGに透明度を適用する方法

IllustratorでSVGグラフィックに透明度を適用する方法を学びます。背景が透明なSVGを出力し、透明効果を適用する方法を探ります。

AdobeXDでの画像の操作

AdobeXDでの画像の操作

画像をAdobeXDにインポートした後は、編集の制御はそれほど多くありませんが、他の形状と同じように画像のサイズを変更したり回転したりできます。コーナーウィジェットを使用して、インポートした画像のコーナーを簡単に丸めることもできます。閉じた形状を定義して画像をマスキングする[…]