コーディングに適したプロトタイプが作れる！ 本書はAdobe XDを使った WebデザインとUIのプロトタイピングを、 高品質なサイトを作りながら、 現場のワークフローに沿って学んでいく本です。 ワイヤーフレームの作り方から、 デザインカンプ制作、コンポーネントの管理、 画面遷移の設計、インタラクティブなプロトタイプ制作と共有、 コーディングに必要なデザインスペックの共有、 さらに動きのあるUI設計やプラグイン活用まで、 現場レベルで求められるスキルを、 より実践的な学び方で習得できます。 初学者から、現場経験が浅い新人デザイナー、 さらにグラフィックデザインからWebへキャリアを広げたい方まで、 しっかりWebデザインを学びたい、あらゆる方のための一冊です。 ＊本書は、Adobe XDのバージョン28.6.12.3をベースに書かれています。 ＊Adobe XDをインストールして使用するには、macOS 10.12以降、 またはWindows 10 Creators Update（64ビット）（v1703［ビルド 10.0.15063］以降）が必要です。 Chapter 1　Adobe XDの基本と制作準備 01｜Adobe XDが必要になった背景 02｜Adobe XDの特徴 03｜インストールと環境設定 04｜フォント環境を整える Chapter 2　ワイヤーフレームの制作 01｜制作の準備をする 02｜トップページのワイヤーフレームを作成する 03｜コンポーネントについて理解する 04｜トップページのワイヤーフレームを完成させる 05｜下層ページのワイヤーフレームを完成させる Chapter 3　スマートフォン版デザインカンプの制作（1）トップページ 01｜共通パーツを作成する 02｜トップページデザインの作成 Chapter 4　スマートフォン版デザインカンプの制作（2）下層ページ 01｜下層ページ共通デザインの作成 02｜コンセプトページの作成 03｜製品一覧ページの作成 04｜敏感肌用化粧水ページの作成 05｜よくあるご質問ページの作成 06｜店舗情報ページの作成 07｜「オンラインショップ」セクションの作成 08｜メニューページの作成 Chapter 5　インタラクティブ・プロトタイプの制作 01｜プロトタイプモードに切り替えて作業する 02｜リンクを設定する 03｜共通部分のリンクの設定 04｜メニューページのプロトタイプ Chapter 6　プロトタイプとデザインスペックの共有 01｜プロトタイプを共有する 02｜デザインスペックを共有する Chapter 7　デスクトップ版デザインカンプの制作 01｜デスクトップ版を作成する準備 02｜デスクトップ版トップページを作成する 03｜下層ページの共通部分を作成する 04｜下層ページを作成する Chapter 8　コーディングの準備と画像の書き出し 01｜コーディングの準備 02｜差し替え作業をする Chapter 9　動きのあるUIの制作 01｜自動アニメーションの基本 02｜スクロールダウンアイコン 03｜開閉式のアコーディオンメニュー 04｜ボタンホバー時のアニメーション 05｜アンカーリンク Chapter 10　プラグインの活用 01｜プラグインの使い方 02｜プラグインの紹介