design
マリンロード

2020.1.17デザイン 

マリンロード

Adobe XD:プロトタイプ作成の基本

こんにちは。加藤です。
以前、Adobe XDのアセット機能について記述しました。
今回はXD操作の中でも基本となるプロトタイプ作成についてです。

プロトタイプ作成
1.各ページのデザイン(or WF)を作成する
2.デザインモードから、プロトタイプモードに切り替えする
3.インタラクションの追加
リンク設定したい部分をクリックしてトリガー(青い矢印)をドラッグし、
ボタンから遷移するページへ接続する
(他、必要な箇所も設定)
4.接続の設定が出来たら、デスクトッププレビューボタンをクリックして
インタラクションの設定を確認する
※プレビューの際にはホームアイコンがついているページから開始
※もっと細かな設定等行えますが、今回は基本のみ

Adobe XDでワイヤーフレームやデザインを作成した際、
このようにプロトタイプ作成しておけば
クライアントに確認いただく際、画面で確認いただけるので
イメージもつかみやすく、ご意見・ご要望も伝えやすくなりますね。

現役ウェブ解析士が教えるWebサイトの読み解き方 イメージ
ホームページ制作サービスはこちら
ページTOPへ