Adobe XD Trail のオンラインイベント「XD Trail 部屋キャンプ」の第一弾です。Adobe XD に興味があって、実際に簡単なデザイン作業をする機会が欲しい人を対象に、シンプルなモバイルサイトのデザインおよびプロトタイプ制作の手順を紹介します。

配信ページのURLは https://xdtrail.com/live/ です。

【XD Trail 部屋キャンプ】の学び方

1. 生徒役がいます：参加者代表として、生徒役がAdobe XDを使って課題を進める様子が配信されます。ひとりで課題に取り組むのが不安な人は、それを見て使い方を学びましょう。

2. サポーターがいます：見ていて分からないことがあったらその場でオンラインで質問しましょう。サポーターが順次回答します。イベントの途中に何回かQ&Aタイムも設けられます。

3. まとめページが公開されます：当日配信した動画、セッション中のQ&Aなどをまとめたページを後日公開します。時間があるときに自分のペースでゆっくりと復習しましょう。

4. ワークショップキットがあります：学習用の素材と詳細な手順書が提供されます。ダウンロードして、自習、復習、勉強会などに活用してください。

参加するための準備

以下の環境を用意します。

• 最新版の Adobe XD がインストールされた PC
• 最新版のAdobe XD (iOS, Android) がインストールされたスマートフォンと、PCと接続するUSBケーブル（オプション）
• インターネット接続

※ Adobe XD を全く操作したことが無い方は、事前に Adobe XD スターターキットをダウンロードして完了しておくことをオススメします。

ワークショップの内容

簡単なモバイルサイト（3ページ程度）の制作を、以下の作業工程で進めていきます。

全部で4つのトピックから構成され、各トピックは「講師からの説明」「課題の制作」「Q&Aタイム」から構成されます。各トピックの間には5分程度の休憩があります。

トピック

【ワイヤーフレームの作成】
Adobe XDの描画ツールやテキストツールを使って、ワイヤーフレームを作成します。

【スタイルの適用】
ワイヤーフレームにスタイルを適用し画像を配置します。

【プロトタイプの作成】
実際に画面遷移の操作ができるようにインタラクションを設定します。

【コラボレーション】
画像の書き出しや共同編集によるデザイン作業を行います。

スタッフ

【講師】
轟 啓介（アドビ）

【生徒】
透子

【テクニカルサポーター】
湯口 りさ（XDUG東京 / Adobe Community Evangelist）