前回の記事はこちら

この間自宅のMacでAdobeXDを操作したら普通にメニューが出てきてびっくりしました。
Windowsだとハンバーガーメニューに収納されているんですけど……。あとメニュー内容もだいぶ少ないような……？
基本としてWindowsは右クリックを使えってことなんでしょうか。

Adobe XDの選択ツール

使う頻度が一番高いツールです。

何のオブジェクトも選択していない場合は、左のレイヤーパネルはアートボード一覧が表示されます。いずれかのオブジェクトを選択すると、そのオブジェクトが属しているアートボードの内部オブジェクトの一覧に切り替わります。アートボードに属していない場合はペーストボード（アートボード外の灰色部分）の一覧が表示されます。

右のパネルは上から順に、「整列ツール」「リピートグリッド」「パスファインダ」「変形（サイズ変更）」「アピアランス」となるのが基本。

選択したオブジェクトがテキストオブジェクトだった場合

選択したオブジェクトがテキストオブジェクトだった場合は、右のパネルにフォントやフォントサイズ、フォントウェイト、トラッキング、行間、の変更ができるパネルが展開されます。最近テキストにアンダーラインがつけられるようになりました。（2017年12月15日現在）
また、アピアランスに塗りと線、シャドウと背景のぼかし/オブジェクトのぼかしの設定が加わります。
それぞれアピアランスの要素にチェックを入れると、編集可能箇所が展開します。境界線の幅位置や、シャドウの大きさ、背景のぼけ具合など、細かい設定がスライドバーで簡単に操作できます。

選択したオブジェクトがパスやシェイプオブジェクトだった場合

選択したオブジェクトがパスやシェイプオブジェクトだった場合は、アピアランスに角丸設定が表示されます。左が全指定、右が各々の角の設定で、右のアイコンをクリックすると数値記入欄が展開します。

カラー変更パネルは以下のようになります。一番下の列のプラスボタンを押すと、現在選択しているカラーがスウォッチに登録されます。べた塗部分をグラデーションに変更することで、グラデーションカラーにすることができます。
実際のアートボードパネル上にもラインがでますので、こちらでも編集可能です。色の変化させたい部分をクリックすることで、色を追加することができます。

選択したものがアートボードだった場合

選択したものがアートボードだった場合（アートボードの名前をクリック、もしくはペーストボード時に展開した左パネルの任意のアートボードを選択）は、スクロール、アピアランス、グリッドといったものが展開します。

スクロール設定

スクロールには「なし」と「垂直方向」があり、なしの場合はサンプルURLを出力して表示しても画面がスクロールしません。垂直方向に指定することで、スクロールが可能になります。その場合、アートボードのファーストビュー指定の終了部分に点線がつきます。
表示領域の高さもピクセルで指定が可能です。

レイアウト設定

レイアウトにチェックを入れると、画面に下図のようにガイドグリッドが表示されます。縦列の数、その列の幅と間幅を設定することができ、さらに下の設定では「両端のマージン」か「正方形のマージン」を設定することができます。

なお、選択できるレイアウトにはほかに「マス目」があり、方眼紙のようなガイドが現れます。

Adobe XDのシェイプツール（四角）

四角いシェイプを作ることができます。

Adobe XDのシェイプツール（円形）

丸いシェイプを作ることができます。

●Adobe XDのラインツール

ラインを描くことができます。

Adobe XDのペンツール

パスで自由にシェイプを作ることができます。操作的にはIllustratorに近いものがあります。
パスの切り替えはアンカーポイント上でダブルクリック。また、アンカーポイントのないセグメント上でクリックすると、そこにアンカーポイントを作ることができます。アンカーポイントを削除するにはdeleteで処理できます。

Adobe XDのテキストツール

フォントサイズ、フォントファミリー、フォントウェイトのほかに、左揃え、センター揃え、右揃え、また、テキストそのものに合わせるか、テキストボックスに合わせるかの選択が可能です。アンダーラインを設置することも。

Adobe XDのアートボードツール

ドラッグすることで任意のアートボードを生成できます。また、展開した左パネルにあるそれぞれの提携サイズを選択し、ペーストボード上でクリックすると、任意の場所に整列した形で提携サイズのアートボードが生成されます。

Adobe XDの拡大・縮小ツール

拡大と縮小を行います。

 

 

次回はリピートグリッドとシンボルについてです。