2019.7.23
講師:境祐司(Adobe Community Evangelist)
日々の情報発信:Twitter(commonstyle)
素材データをダウンロードしてください
事前の確認をお願いします
INDEX
ハンズオンの流れ
ハンズオンの時間は90分です。素材データを使ってXDの基本操作を学習した後、Adobe Stockを活用してプロトタイプを制作します。
※以下のタイムテーブルは目安です(状況に応じて時間調整します)
13:00
全体の流れを説明します[10分]
念のため、始める前に確認します
・Wi-Fi接続の確認/XDの起動確認
・Adobe Stock(https://stock.adobe.com/jp/)にログイン
※XDとStockは同じAdobe IDでログインしてください
・素材データがダウンロードできているか確認
13:05
↓
13:10
Adobe XDとは?[10分]
13:15
↓
13:20
Adobe Stockで素材を集めてXDで活用する手順[5分]
※Stockでは無料/無制限ダウンロードできるカンプ用画像を使用
13:25
最低限知っておくべきXDの基本操作[10分]
13:30
↓
13:35
魅力的なECサイトとは?[5分]
13:40
素材データを使いながらサイトのワイヤーフレームを作成[10分]
13:45
↓
13:50
画面を切り替えるインタラクション設定[10分]
13:55
↓
14:00
Stockで素材を探してXDで配置する手順[15分]
アイデアを素早くカタチにするテクニックを紹介します
14:05
↓
14:10
↓
14:15
作成したプロトタイプを公開する[5分]
14:20
まとめ/復習の方法[10分]
14:25
↓
14:30 終了
[INDEXに戻る]
参考データ
[INDEXに戻る]
レッスン内容
ログインが必要なAdobeのクラウドサービス
macOSとWindowsの違い
インポート可能なデータ形式
フィルター・パターン・サポート対象外のストローク機能(linecap、dasharray)・(ビットマップ)マスク・スケール変換(一部サポート対象)・スキュー変換・switch要素およびforeignObject要素・ブレンドモード・グラデーション変換・テキストアンカー・ネストされた SVG
エクスポートするときの注意
ワークスペースの基本操作
シェイプの描画
PNG・JPEG・GIF・TIFF・SVGの読み込み
A.
B.
C.
画像を配置する前のマスキング:
画像を配置した後のマスキング:
インタラクションの設定
インタラクションが含まれていない場合:
インタラクションが含まれている場合:
メニューから「プラグインを見つける」を選択し、プラグイン名で検索します
インストールするプラグイン
[INDEXに戻る]
XD基本習得の
カリキュラム[標準]
Adobe XDの基本操作を習得するための講座アーカイブです。総再生時間は3時間39分ありますが、実際の講座は5〜6時間になります。
速習コースは厳選したしたカリキュラムで2時間程度に短縮されます。
Adobe XDを学ぶための週末講座のアーカイブ(解説動画/音声なし)をTwitterで公開しています。現在、5月25日〜26日と6月1日〜2日のアーカイブを投稿中です。
※先月(2019年6月)のアップデートで、プロトタイプモードのUIが変わりました。
インタラクション設定時に表示されていたポップアップパネルが無くなり、プロパティインスペクタで設定する仕様に変更されています。
[INDEXに戻る]
XD関連リソース
[INDEXに戻る]
参考資料
ワークショップの参考資料です。Adobe XD 速習簡易マニュアルは、最低限必要な機能に絞って解説しています。今回のワークショップでは使用しません(ワークショップ後の復習などにご利用ください)。
A
B
C
D
更新日:2019年7月23日(火)
Made with
Adobe Muse
& AI Technology
このWebサイトは、AI技術とAdobe Museの連携によって生成されています