Warning: count(): Parameter must be an array or an object that implements Countable in /home/xs638785/agile-software.site/public_html/wp-content/plugins/rich-table-of-content/functions.php on line 490
Webサイトやアプリケーションのデザインはもちろん、ワイヤーフレーム制作や企画段階の資料など幅広い用途で使用されています。
XDには無料で使用できるスタータープラン、XDのみの有料プラン、Adobe Creative Cloudのすべてのソフトが使用できるコンプリートプランが用意されています。
ワイヤーフレームの複製
Ctrl+D
illustratorからベクターデータを読み込む
トップページの作成
背景画像をぼかす
ヘッダーの編集
長方形を使ってヘッダーやフッターを作成します。
リピートグリッドを使う
ラインパーツを作成した時に繰り返して使いたいときにリピートグリッドが便利です。
ハンドルを縦横方向に移動させるとオブジェクトが繰り返し表示されます。
メニューページの作成
ハンバーガーアイコンを押したときに表示されるメニューページを作成します。
メニューページをトップページの上に重なるようにするにはオーバーレイにします。
コンポーネントについて理解する
コンポーネントとは
Webページの中で繰り返し使用する要素をコンポーネントすることで効率よくデザインを制作することができます。
コンポーネントに登録したオブジェクトはマスターコンポーネントになります。マスターコンポーネントには左上隅に緑色に塗りつぶされたひし形の目印がつきます。
種類 | 左上のマーク | 親子関係 | マスターコンポーネントに変更を加えたとき |
---|---|---|---|
マスターコンポーネント | 🔶 | 親 | |
インスタンス | 子 | ||
マスターコンポーネントを編集するとマスターコンポーネントのコピー(インスタンス)も自動的に変更されます。インスタンスは正確なコピーなのでオリジナルと同じプロパティを持っています。
マスターコンポーネントのワイヤーフレームを作成しコンポーネントを作成。
他のワイヤーフレームにインスタンスを作成
リンク設定
プロトタイプの共有
プロトタイプを共有するためのリンクを作成します。
デスクトップ版デザインカンプ
スマホ版ページの内容をコピーする