8
8

More than 5 years have passed since last update.

Adobe XDの基本の使い方

Last updated at Posted at 2019-03-30

AdobeXDの使い方メモ

Adobe XDをまずは無料版を入手してみる

チュートリアルを見ると、やることのイメージが湧く

プラットフォームを選択する

新しいページを追加する

  • 左のメニューから追加のアイコンを選択
  • プラットフォームは右のメニューで再度選択することができる
  • 真ん中のフィールドをクリックすると、自動的に追加される
  • スクリーンショット 2019-03-30 23.49.56.png

四角など図形を追加する

  • 左メニューから四角のアイコンを選択した時に追加できる
  • 図形内の◉で角を調整できる
  • スクリーンショット 2019-03-30 23.58.20.png
  • 同様に丸や直線も四角の下のメニューから作成できる

テキストを追加する

  • 左メニューからTアイコンを選択した時に追加できる
  • スクリーンショット 2019-03-31 0.06.47.png
  • 右のメニューのテキストで文字サイズやテキストボックス内の位置を変更できる
  • 右メニューのアピアランスの色で文字の色を変更できる

要素の位置を移動する

  • 左メニューの一番上のアイコンを選択した時に要素を移動したり、要素の操作したりできる
  • スクリーンショット 2019-03-31 0.32.35.png

ページ遷移の設定をする

  • プロトタイプタブを選択
  • 何らかのトリガーでページ遷移する設定を指定することができる
  • スクリーンショット 2019-03-31 0.35.53.png
8
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
8
8