講座概要

このトレーニングでは、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の使い方・基本トレーニング（2日間・オンライン受講（ライブ配信））
  • Illustratorの使い方・基本トレーニング（2日間・オンライン受講（ライブ配信））
  • AfterEffectsの使い方・基本トレーニング（2日間・オンライン受講（ライブ配信））
  • HTML・XHTML・CSSの基礎知識（2日間・オンライン受講（ライブ配信））
  • JavaScriptの基礎知識（2日間・オンライン受講（ライブ配信））
  • HTML5/CSS3の基礎知識

期待される効果

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

受講対象者

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

受講者へのメッセージ

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

講師紹介

伊藤　和博

株式会社デジタルスケープ
キャリア開発グループ・トレーニングディレクター

講師歴27年。講座開発数200以上。
総合商社のスクールでMac/Winを使ったDTP/Webトレーニングスクールの業務全般を担当。大手PCメーカー、プリンターメーカー、化粧品メーカー、大手印刷会社、大手広告代理店、新聞社、大手玩具メーカー、大学、官公庁、団体などに向けたトレーニングなど幅広い企業の人材育成に携わる。
現在は、デジタルスケープにて一般受講者および法人を対象としたWeb、ビデオ、AdobeCCを中心としたトレーニングの企画・講師および、Webクリエイターとしての就労を目的に、求職者向けに厚生労働省管轄・求職者支援訓練の企画・講師を務める。Adobe認定エキスパート、アップルコンピュータ認定技術者、CIW JavaScript Specialist、CIW Web Design Specialist。ウェブデザイン技能士。

開催日時

平日の10:00〜17:00に開催いたしますので、お問合せフォームよりご希望の受講日をご連絡願います（土日・祝祭日、年末年始、お盆、ゴールデンウィーク等の期間、国の研修を実施している期間（要お問い合わせ）は除きます）。

会場

オンライン研修または出張トレーニングによる開催のため、ご自宅またはお勤めの社内にてご受講いただく形となります。出張トレーニングをご希望の場合には、受講人数に合わせて別途お見積もりいたしますので、お問い合わせフォームよりお問い合わせください。

カリキュラム

    Adobe XDとUI/UX
    • 目的と必要性
    • UIとUXの関係と範囲
    • 認知特性
    • デバイスについて
    • Adobe XDについて
    • 動作環境
    階層と構造
    • カスタマージャーニーマップ
    • ナビゲーション
    • インタラクション
    デザイン
    • アートボードの作成
    • インターフェイス
    • ワークスペース
    • 各パネルの役割
    • モード（デザイン/プロトタイプ/共有）
    • レイアウトグリッド
    オブジェクト・アイコンの作成
    • 矩形/円/多角形の描画
    • 塗りと線
    • アピアランス
    • 直線/曲線の作成
    • 合体と整列
    テキスト
    • ポイントテキストとエリアテキスト
    • テキストの流し込み
    • アウトライン化
    • Illustrator及びPhotoshopからのテキストのコピー
    画像
    • 画像の配置
    • 配置画像の編集
    • オブジェクト内に配置
    • タイル
    • シェイプでマスク
        Illustrator連携
        • ベクトルデータの読み込み
        • SVGデータの読み込み
        リピートグリッド
        • リピートグリッドの作成
        • マージン調整
        • 既存コンテンツのリピートグリッド化
        • データの流し込み
        ライブラリ（アセット）
        • ライブラリ（アセット）への登録
        • 文字スタイルの作成
        • シンボル
        • アセット管理
        • ローカルを作成
        プロトタイプ
        • ホームの設定
        • 遷移先の設定
        • トランジション及びイーズの設定
        • スクロール位置を保持
        • インタラクションのコピーペースト
        • プレビューを録画
        サンプルサイト作成
        • トップページの作成
        • UIキットの活用
        • メニューの作成
        • フォーム及び表の作成
        • インタラクション設定
        • プレビュー
        書き出し
        • 画像書き出し
        • AfterEffects書き出し
        他

        テキスト

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

        使用アプリケーション・バージョン

        • Adobe XD
        • Adobe Illustrator
        • Adobe Photoshop
        • Adobe AfterEffects

        テキストエディタは、HTML/CSSの入力に最適化されたフリーのエディタを使用いたします。普段使い慣れたエディタがある場合は、そちらでご受講いただくことができますので、お問い合わせください。

        使用端末

        MacintoshまたはWindowsにてご受講いただけます。講師はMacintoshにてトレーニングを実施いたしますが、Windowsでのキー操作も含めて解説いたしますので、Windowsでご受講の方もご安心ください。

        受講料金

        • 41,800円：一般（2日間・税込・iPadレンタル込）別途保険料＋配送料をご選択
        • 39,600円：一般（2日間・税込・iPadレンタル無）
        • 22,000円：学割（2日間・税込・iPadレンタル込）別途保険料＋配送料をご選択
        • 19,800円：学割（2日間・税込・iPadレンタル無）

        受講者の声

        ニックネーム内容評価日付