Adobe XDチュートリアル - エクスペリエンスデザインとプロトタイピング

大規模なAdobe XDチュートリアルへようこそ。このイントロで私があなたのトレーナーとして紹介します。

ユーザーエクスペリエンス（UX）とユーザーインターフェース（UI）の違いは何ですか？ どのようなレベルデザインの種類があり、Adobe XDはどのように最も適していますか？答えはこちらにあります！

Adobe XD を初めて開いた瞬間、選択できる多くの可能性が広がります。このビデオでは、Adobe XD のための軽いウォームアップ、プログラムの概要、XD のスプラッシュスクリーンとその機能への紹介があります。

Artboards（Zeichenflächen）は、Adobe XDで瞬時にさまざまな解像度やデバイス用に作成できます。これを行う際に考慮すべき特性については、このチュートリアルで確認できます。

異なるグリッド設定は、要素やオブジェクトをきれいに配置するのに役立ちます。このためには、矩形のグリッドと列の分割が用意されています。

Google、Apple、Microsoftは迅速な開始のために実用的なUIキットを提供しています。これらの完成したアートボードは、さまざまなプラットフォームのプロトタイプの後半部分を大きく支援してくれます。

ほとんどすべてのデザインにおいて、色は非常に重要な役割を果たします - このビデオでは、Adobe XDで色を使用し、インポートする方法、および完成した色の調和を収集するための便利な情報源について学ぶことができます。

Adobe XDに画像やファイル、テキスト文書などのアセットをインポートするためのさまざまな方法があります。このビデオではいくつかの手法を紹介しています。ただし、XDはAdobeのCreative Cloudの一部であるため、ライブラリを使用すると非常に便利で快適に作業できます。

フォントとタイポグラフィのテーマは、Adobe XDを横断する旅の重要な要素です。このビデオでは、フォントを適切かつ効率的に扱う方法を学びます。

フォームは、Adobe XDに非常に簡単にインポートすることも、パスツールを使用して自分で作成することもできます。オブジェクトが2回以上使用される場合は、アセットリストにシンボルとして追加することもおすすめです。

デザインには、外部からのインスピレーションとインプットが大きく関わっています。これには、アナログ環境だけでなく、デジタルの世界も含まれます。私がよく訪れるいくつかのポータルを紹介します。

小規模で素敵な実践プロジェクトを始めましょう。このチュートリアルと今後の2つのビデオで、ワンページを作成します。

Adobe XDの最重要な機能の1つであるリピートグリッドは、一度作成したオブジェクトグループを自由にスケーリングし、個別に埋めるのに役立ちます。

ワンページの最終段階では、フッターと参照エリアに取り組みます。ここでは実用的なSVGファイルを使用し、さらなるデザインテクニックを学びます。

このレッスンでは、個々のアートボードがどのように相互につながるかに焦点を当てます。遷移の選択肢やプロトタイプで行えるその他の修正について説明します。

すべてのウェブサイトにはナビゲーションのためのアンカーポイントが必要です。このビデオでは、ヘッダー部分のメインナビゲーションの作成とそれらの間のインタラクティブな接続に焦点を当てています。

このトレーニングは前の章に基づいており、作成したデスクトップメニューをスマートフォンに適応させる方法を示しています。ハンバーガーアイコンとメニューアイテムは面白いアニメーションで強化されます。

最高のビジュアライゼーションを実現するための最もパワフルなツールの1つは、Adobe XDのAuto-Animate機能です。この例では、Auto-Animate機能の原則をどのようにしてあらゆるシナリオに適応させるかを説明します。

次のビデオでは、オンラインショップのプロトタイプ作成を学びます。ここでは、シンプルなアートボードから視覚的に魅力的なハイフィデリティのプロトタイプを作成する方法を学びます。その1/4。

第2部では、詳細説明の表示、画像用のスライダーの追加、およびアートボードの相互リンクを行います。

インタラクティブなプロトタイピングのオーバーレイ機能は、情報を直接表示したり非表示にしたりする面白い方法を提供してくれます。

ユーザビリティデザインは常にシステムの状態についてユーザーにフィードバックを提供します。このフィードバックはプロジェクトの最後に素敵なアニメーションとして組み込まれます。

アドビXDは、プロトタイピングプロセスで音声コマンドによるインタラクションも可能です。言葉での命令により、私たちが自ら定義できるシステムアクションが実行されます。その仕組みについては、このチュートリアルで紹介します。

他の部署や関係者との協力時に、プロジェクトの状況を理解しやすくするために、音声コメントは貴重な機能です。

仮想環境でプロトタイプをテストすることは一つのことですが、エンドデバイスで実際に表示することはまったく別のことです。そして、それをAdobe XDを使用してUSB接続またはCreative Cloudに接続することで簡単に行うことができます。このためには、App Storeから提供されるAdobe XDアプリを使用します。

協力中に、プロジェクトの進行状況について他の部署と意見交換することが不可欠です。プロトタイプは公開機能を使用してリリースでき、レビュアーや開発者、発注者がプロジェクトのビジュアルな印象を得ることができます。この時点で、専門部署間でプロジェクトを完成させるための編集サイクルが始まります。

Adobe XDはまだ非常に若いプログラムであり、各アップデートで変化しています。このビデオでは、バージョン18からバージョン19への変更点、機能の活用方法、および有用性について説明します。これには、シンボルの代わりにコンポーネント、レスポンシブリサイズ、ガイドライン、ポリゴンツール、テキストフォーマットの追加オプションなどが含まれます。お楽しみください！