Learning site for website creation

Adobe XD 画面構成

公開日:2021年01月30日
  1. メインメニュー
  2. アプリケーションツールバー
  3. ツールバー
  4. パネル
  5. プロパティインスペクタ
  6. ボード

1.メインメニュー

新しいファイルを作成したり、保存したり、XDファイル自体の操作を主に行うメニューです。

よく使うショートカットキー

  • 新規:「Ctrl」+「N」(New)
  • 保存:「Ctrl」+「S」(Save)

2.アプリケーションツールバー

アプリケーションツールバーでは主に確認用表示切替を行うことができます。

  • A.ホーム:起動時最初に表示される画面の呼び出し
  • B.デザイン:アートボードの作成やデザインを行うモード
  • C.プロトタイプ:アートボード同士をリンクして仮想リンクを作成するモード
  • D.共有:プロトタイプで作成したプレビューを共有するためのリンクの生成
  • E.ドキュメントに招待:共同編集を有効にすることで複数人で1つのXDドキュメントに同時アクセスして編集することができる
  • F.デバイスでプレビュー:USBを使用してたデバイスでプレビュー
  • G.プレビュー:プロトタイプで作成したプレビューを閲覧
  • H.ペーストボードの表示倍率

3.ツールバー

アートボードやペーストボードでデザインするために使用するツールを選択します。

4.パネル

  • ライブラリパネル(旧アセットパネル):よく使うカラー、文字スタイル、コンポーネントを登録して利用するパネル
    CCライブラリを使用すればPhotoshopやIllustratorなどの他アプリケーションとカラー、文字スタイル、コンポーネントを共有することができる
  • レイヤーパネル:アートボード一覧や選択したアートボード内のレイヤーを確認するパネル
  • プラグインパネル:新しいプラグインのインストールやインストールしたプラグインにアクセスする時に使用するパネル

5.プロパティインスペクタ

選択したオブジェクトの設定を確認、変更するためのパネルです。

基本

長方形・楕円ツール、多角形ツール

線ツール、ペンツール

テキストツール

アートボードツール

6.ボード

ペーストボードというグレーの背景部分にアートボードを配置して作業するエリアです。