Adobe XD 自動アニメーションで作る 動くプロトタイプ

オンライン

ウェブデザイナー 松下絵梨氏登壇、Adobe XDの自動アニメーション機能を駆使し、「動くプロトタイプ」を共有する、Bau-yaの講座。

こんなことを学びます

日本全国や海外在住の方がご参加可能な、オンライン講座に対応しています。

受講お申し込みのすべての方が、講座開催後1週間、お好きなときに開催当日の収録動画をご視聴して復習いただけます。

--

今日のウェブやアプリのUI/UXデザインにおいて、「動く仕掛け」は必ずと言っていいほど設けられます。
もちろん、そのプロトタイプの制作においても、動く表現は重要。
画面遷移時のトランジションや、ユーザの操作に反応するマイクロインタラクションなど、チーム内では制作の段階から「動きの共有」が求められます。

では、どのような方法で、そのようなプロトタイプを実現し共有すればいいのでしょうか。

Adobe XD®は、ウェブページやアプリのワイヤーフレーム、ビジュアルデザイン、そして、プロトタイプを効率よく制作し共有することで、プロジェクトのコミュニケーションを円滑にするUI/UXのプロトタイプイングツールです。

Adobe XD
https://www.adobe.com/jp/products/xd.html

Adobe XDの『自動アニメーション』機能を使えば、動きのある画面遷移やアニメーションのマイクロインタラクションを、チーム内で共有しコンセンサスを取ることができるのです。

この講座では、デザイナー・クリエイターとして豊富な実績を持ち、『Adobe XD ユーザーグループ 大阪』の代表を務め、5月29日発売『Adobe XDではじめるWebデザイン&プロトタイピング 一歩先行く現場のスキル』を上梓された松下絵梨氏を招聘。
Adobe XDの自動アニメーション機能を使って、「動くプロトタイプ」を制作し共有する方法を徹底解説いただきます。

Adobe XD ユーザーグループ 大阪
https://xdug.jp/osaka/

『Adobe XDではじめるWebデザイン&プロトタイピング 一歩先行く現場のスキル』(翔泳社)
https://www.shoeisha.co.jp/book/detail/9784798158716

これでもう、ビジュアルが固まった後に動きの相談を後追いでする必要もなくなります。
これこそ、真のUI/UXの制作現場です。


Keywords: ウェブ, アプリ, デザイン, UI, UX, プロトタイプ, インタラクション, Adobe XD, マイクロインタラクション, トランジション


● この講座で学べること
○ Adobe XDの「自動アニメーション」機能
○ 動きのある画面遷移のプロトタイプ制作方法
○ アニメーションするマイクロインタラクショ のプロトタイプ制作方法
○ 動くプロトタイピングの共有方法

● この講座で得られること
○ 「自動アニメーション」の基本が理解できる
○ マウスオーバーやページ遷移時などの、アニメーションするUIを作成できるようになる
○ 簡単なローディングアニメーションが作成できるようになる
※ 配布資料がある場合は、配布やダウンロードなどで入手いただけます。
※ 講座内で利用するデモなどのサンプルファイルがある場合は、ダウンロードで入手いただけます。
※ 各種受講証明書への署名・発行に対応します。

● この講座の特徴
○ ハンズオンでも聴講でも、お好きなスタイルで受講可能な『技術講座』です。
○ 実践的な技術や方法を、要点をまとめて具体的にわかりやすくお伝えします。
○ 操作の解説は、デモンストレーションを実演して解説します。
○ 講座開催の後でも1週間、講義の様子をすべて収録した動画の視聴ができ、グループメッセージで登壇者宛に質問が可能です。

● 協賛企業・ブランド
株式会社翔泳社
https://www.shoeisha.co.jp/

#bauya123
続きを読む

開催日程がありません

開催予定エリアオンライン

価格(税込)¥3,800

現在は開催リクエストを受け付けていません
受けたい
15人が受けたい登録しています

オンライン受講日程

開催日程はありません。

オンライン受講料に含まれるもの

参加費に教材費などはすべて含まれています。
参加費の他に一切費用はかかりません。
※ オンラインで講座に参加いただく場合の通信費などは、参加者さまのご負担になります。
※ 参加費の領収書は、ストリートアカデミーから発行・印刷することができます。
  https://support.street-academy.com/hc/ja/articles/201345225

この講座の先生

松下 絵梨のプロフィール写真
ウェブデザイナー,UIデザイナー,講師
松下 絵梨
大阪出身大阪在住のウェブ/UIデザイナー 

東京理科大学理工学部卒業 

京都造形芸術大学 非常勤講師 
デジタルハリウッド大阪校 主幹講師 
コンピュータ専門学校HAL 非常勤講師 

通信機器メーカーで開発・サポート業務に従事したのち、デザイン・広報秘書業務に転身。
2010年よりフリーランスとして独立し、DTP、ウェブ、アプリデザイン、ディレクションを行なっている。 

ウェブに関する様々なセミナーを行っているCSS Niteでは、「CSS Niteベスト・セッション2018」「CSS Niteベスト・セッション2019」で...
+続きを読む

この講座の主催団体

  • 5,095人
  • 180回
クリエーターの学び舎 Bau-ya®

■ Bau-ya®にある『知識講座』『技術講座』『ワークショップ講座』の3つのスタイル

『知識講座』は、ふんだんな資料や図解で解説する座学形式。
業界人として必須の教養や情報を学べます。
スライドや資料などを見ながら、じっくり学ぶスタイル。
提示されるスライドや資料はダウンロードして、何度でも復習いただけます。

『技術講座』は、ふんだんに実演デモを駆使するセミハンズオン形式...
+続きを読む

主催団体に質問する 主催団体ページを見る

当日の流れとタイムスケジュール

■ 開始準備・開場時間
開演15分前から

■ 所要時間
約1.5–2時間程度(途中参加、途中退出も可能です)

■ 講座の流れ(予定)
1. オープニング(Bau-yaおよび講座について説明,登壇者紹介など 約5分)
2. 講義(約35–50分)
3. 休憩(約5分)
4. 講義(約35–50分)
5. 質疑応答(約5分)
6. エンディング(約5分)
※ 講義時間や時間割は、変更する可能性があります。
※ 予定よりも早く終了、または長引く可能性があります。
続きを読む

こんな方を対象としています

□ ウェブデザイナーやUIデザイナーの方

□ ウェブディレクターやウェブ制作関係者の方

□ ウェブデザイナーを目指す初学者や学生の方

□ 動きのあるウェブデザインやUIデザインのプロトタイピングを制作したい方

□ 動きのあるウェブデザインやUIデザインのプロトタイピングを共有作業したい方
続きを読む

受講する際は以下をお読み下さい

■ ご用意いただくもの
□ オンラインで受講いただく場合は、インターネット環境とコンピュータなどのデバイスおよびウェブブラウザ。
□ ハンズオンスタイルで受講の方は、以下のアプリケーションがインストールされたコンピュータ。
・Adobe XD

 「スタータープラン」はAdobe CCを利用していなくても、無料でダウンロードが可能です。
※ OSやウェブブラウザー、各種アプリケーションなどは、最新のバージョンのものをご使用ください。
※ コンピュータの動作やソフトウェアなどの動作不良に関するサポートは行いません。
□ 対面講座へ来場受講で電源を使われる方は、電源タップをご持参ください。
□ 対面講座へ来場受講の場合、メモを取るための筆記用具やデバイスはご持参ください。

■ その他
□ 参加者さまによる動画の収録や録音、撮影などの、一切の収録行為を禁じています。
□ 講座内で配布する資料やファイルなどの一切の二次利用、再配布、無断転載などを禁じています。
□ 対面講座へ来場での受講の際、お名刺をお持ちでしたら講座終了後に登壇者や主宰者とご交換ください。
続きを読む
※ストアカでは講座に適用される保険を用意しています。詳しくはストアカ補償制度をご覧ください。

レビュー6

  • 楽しかった( 4 )
  • 勉強になった( 6 )
  • 受ける価値あり( 4 )
  • この講座は「とてもとても分かりやすい講座」でした
    女性 40代

    先生のご説明が本当にとても分かりやすくて、
    気が付くといろいろな機能の使い方を知ることができている、
    という感じでした。

    こんなにひとつひとつ明確にしてくださる先生に
    尊敬です・・・。

    たのしく勉強させていただきました。
    ありがとうございました!

  • この講座は「初心者に優しい講座」でした
    女性 30代

    全くXDの知識がない状態で講座をうけましたが
    教材を使いつつツールの機能や使い方をわかりやすく説明いただけました。

  • この講座は「このひとなら、安心して受けられる講座」でした
    女性 40代

    本の執筆もなさっているせいか、スライドも素材も美しくアタマに入ってきます。動画を繰り返しみようと思います。

  • Webデザインのおすすめの先生Webデザインの先生を探す

    Webデザインの関連カテゴリーから講座を探す

    先生のスキルから探す