Adobe XDの使い方・基本トレーニング

掲載日:2020年10月7日

※本セミナーはJAGATと業務提携している㈱イマジカデジタルスケープで実施します。
セミナー会場は、㈱イマジカデジタルスケープ(東京都渋谷区)です。

 

講座概要

このトレーニングでは、UI/UXの目的や必要性等の理解から、Adobe XDを使ったレスポンシブWebデザイン、スマホサイト等のプロトタイプ制作に必要なXD上での一連の操作と使い方を学習します。Photoshopの画像データやIllustratorのベクトルデーターなどを活用して、アートボード上にレイアウトし、オブジェクトやテキストなどを作成、リピートグリッド、アセット登録、インタラクションの設定、プロトタイプ作成、サンプルサイトの作成、書き出し、AfterEffects連携などの一連の動作を学習します。

PhotoshopやIllustratorの操作経験のある方は、これらのアプリケーションとの共通点やオペレーション上での相違点などを確認しながら学習を進めていくことが可能で、またPhotoshopやIllustratorの操作経験のない方は、これらのアプリケーションで作成したデータは、XD上での素材として活用できる点を理解しながら学習を進めていくことが可能です。

デザイン、Web、iOS、Andoroidなどの各デバイスへの書き出しに加え、XDドキュメントをAfterEffectsに書き出し、AfterEffects上でエフェクトを追加して映像コンテンツとして書き出すまでの一連の操作を行います。

PhotoshopやIllustrator、AfterEffectsなどの操作経験は問いません。これからAdobe XDを使う方はぜひふるってご参加ください。

またPhotoshopやIllustrator、AfterEffectsの学習も並行して行いたい方、HTMLやCSS等の各コーディングも含めて学習したい方は、各トレーニングのページも合わせてご確認ください。

   ●Photoshop 2020の使い方・基本トレーニング

   ●Illustrator 2020の使い方・基本トレーニング

   ●AfterEffects 2020の使い方・基本トレーニング

   ●HTML・XHTML・CSSの基礎知識

   ●HTML5/CSS3の基礎知識

   ●JavaScriptの基礎知識

 

開催日時

2020年11月30日(月)13:00~17:00

 

期待される効果

XDの基本操作と、XDを使ったプロトタイプ制作の一連の流れを習得することができます。
XDと各アプリケーション間の連携、AfterEffectsによる動画書き出しまでの一連の操作を習得することができます。
HTMLでのセクショニングや、レスポンシブWebデザインを行う場合を想定したオブジェクトの配置等を習得することができます。

 

受講対象者

XDの基本操作と、XDを使ったプロトタイプ制作の一連の流れを習得したい方
PhotoshopやIllustratorのデータをXDで活用し、他アプリケーションとの連携を学習したい方
XDからAfterEfectsに書き出し、動画として書き出すまでの一連の作業を理解したい方

 

カリキュラム

Adobe XDとUI/UX
目的と必要性
UIとUXの関係と範囲
認知特性
デバイスについて
Adobe XDについて
動作環境

階層と構造
カスタマージャーニーマップ
ナビゲーション
インタラクション

デザイン
アートボードの作成
インターフェイス
ワークスペース
各パネルの役割
モード(デザイン/プロトタイプ/共有)
レイアウトグリッド

オブジェクト・アイコンの作成
矩形/円/多角形の描画
塗りと線
アピアランス
直線/曲線の作成
合体と整列

テキスト
ポイントテキストとエリアテキスト
テキストの流し込み
アウトライン化
Illustrator及びPhotoshopからのテキストのコピー

画像
画像の配置
配置画像の編集
オブジェクト内に配置
タイル
シェイプでマスク

Illustrator連携
ベクトルデータの読み込み
SVGデータの読み込み

リピートグリッド
リピートグリッドの作成
マージン調整
既存コンテンツのリピートグリッド化
データの流し込み

アセット
アセットの登録
文字スタイルの作成
シンボル
アセット管理

プロトタイプ
ホームの設定
遷移先の設定
トランジション及びイーズの設定
スクロール位置を保持
インタラクションのコピーペースト
プレビューを録画

サンプルサイト作成
トップページの作成
UIキットの活用
メニューの作成
フォーム及び表の作成
インタラクション設定
プレビュー

書き出し
画像書き出し
AfterEffects書き出し

 


講師

伊藤 和博

株式会社イマジカデジタルスケープ
トレーニングチームディレクター講師歴15年。講座開発数100以上。
総合商社のスクールでMac/Winを使ったDTP/Webトレーニングスクールの業務全般を担当。大手PCメーカー、プリンターメーカー、化粧品メー カー、大手印刷会社、大手広告代理店、新聞社、大手玩具メーカー、大学、官公庁、団体などに向けたトレーニングなど幅広い企業の人材育成に携わる。現在 は、イマジカデジタルスケープにてAdobeCSを中心としたトレーニングの企画、講師。


受講者へのメッセージ

プロトタイプデザインやUI/UXを可視化する際に非常に便利なXDですが、Photoshopを使ったプロトタイプ制作ではできないような部分もカバーされたアプリケーションになっています。あくまでもデザインやUI/UXの可視化となりますので、HTMLやCSSに関する知識が無くてもこのアプリケーションは操作可能ですが、アプリケーションを使ったWebサイト制作になれている方や、初めてWebサイトを作る方は、HTMLやXHTML、CSS等は言葉ではわかっていても、実際にタグそのものの意味や使い方が曖昧な方もいらっしゃるかと思います。このトレーニングでは、言語レベルで(X)HTMLを習得し、アプリケーションに依存せずに、コードの記述ができるようになり、必要なときに必要なコードを調べられる力がつくようになるトレーニングです。Webサイト制作の最初の一歩としてご受講ください。

 

テキスト

オリジナルテキストを使用。受講料に含まれているのでお得です!

持ち物

受講票(プリントアウト環境が無い場合には、携帯・スマートフォン等への画面コピーでも可)
筆記用具

※データの持ち帰り、データの持ち込みはできません。

使用アプリケーション

・Adobe XD
・Adobe Illustrator 2020
・Adobe Photoshop 2020
・Adobe AfterEffects 2020 

使用端末

 Macintosh(MacPro 2.66GHz Quad-Core Intel Xeon 4GBメモリ・600GBHD)

定員

  6名

会場

㈱イマジカデジタルスケープ
〒150-0043
東京都渋谷区道玄坂1-10-8 渋谷道玄坂東急ビル8F
総合受付/登録受付/トレーニングルーム
TEL 03-5459-6200(代) FAX 03-5459-6209

(JR「渋谷」駅西口より徒歩5分、国道246号沿い)  MAP

参加費(消費税込)

JAGAT会員 13,200円 / 一般 17,600円

お申込み


お申込書に必要事項をご記入のうえ、
03-3384-3216
までFAXにてお送りください。

参加費振込先
参加費は、下記口座に開催日の2日前までに振り込み願います。
なお、お申し込み後の取り消しはお受けできません。代理の方のご出席をお願いします。

口座名:シャ)ニホンインサツギジュツキョウカイ
口座番号:みずほ銀行中野支店(普)202430

内容に関して問い合わせ先
内容に関するお問い合わせはお気軽に下記までお寄せください。
CS部 セミナー担当 電話:03-3384-3411

お申し込み及びお支払に関して
管理部(販売管理担当)   電話:03-5385-7185(直通)

公益社団法人 日本印刷技術協会