Adobe XD, デザイン

<前回の内容>

 プロトタイプとは?

「プロトタイプ」とは試作品のことです。「デザインカンプ」や「モックアップ」などと呼ばれることもあります。XDで制作するプロトタイプは、デザインの他にどこをクリックしたらどのページに飛ぶと ...

Adobe XD, デザイン

<前回の内容>

最終の一番下部分を作成していきます。

SNSリンクボタンの配置

1. 画像を入れるための正方形を描く

【Point】正方形→長方形ツールで、Shiftキーを押しながらドラッグ

Adobe XD, デザイン

<前回の内容>

最後に、ワイヤーフレーム下部分を作成していきます。こちらがサンプルです。

ー 作成手順 ー

写真入りの記事(2)

今回の写真記事部分は、前回作成した写真記事と要素がほぼ同 ...

Adobe XD, デザイン

< 前回の内容 >

②写真入りの記事(1)

「開花情報」下部分の写真入りの記事を作成していきます。
ここは今までやってきた作業の繰り返しだけで完成します。

1. メニューバー下のグレー背景を ...

Adobe XD, デザイン

< 前回の内容 >

前回までの内容で、ラフなワイヤーフレームの上部分が完成しました。

次はワイヤーフレームの中央部分を作成していきます。こちらがサンプルです。

ー 作成手順 ー

①タイト ...

Adobe XD, デザイン

< 前回の内容 >

⑤背景の作成とロック

メニューバーの下部分を作成していきます

1. 長方形ツールでグレーの背景部分を作成します(塗り:薄いグレー 線:なし)

2. 背景のオブジェクトを選択し、レイ ...

Adobe XD, デザイン

< 前回の内容 >

④メニューバーの作成

メイン画像下の6つのメニューバーを作成していきます

1.  長方形ツールとテキストツールを使用し、オブジェクトを作成します

2. リピートグリッド機能を ...

Adobe XD, デザイン

< 前回の内容 >

 ワイヤーフレームとは?

ワイヤーフレームとは、Webサイトのレイアウトを簡単な線と枠で表した設計図のことです。

ワイヤーフレームには
・掲載するコンテンツの大まかな配置
・タ ...

Adobe XD, デザイン

< 前回の内容 >

 アートボードの編集

・アートボードの名前変更

アートボード左上に表示されているタイトルをダブルクリックすると名前変更ができます

・アートボードの複製

アートボードを選択し、Ctrl ...

Adobe XD, デザイン

AdobeXDについて

AdobeXDは、ワイヤーフレーム・アニメーション・プロトタイプ・共同作業などの機能がすべて統合されたウェブデザインツールです。

XDの基本的な使い方について、初めてデザイン制作ツールに触れる方にも分 ...