マニュアル キャンセル

キーボードとゲームパッドでプロトタイプを作成

トリガーとしてキーボードおよびゲームパッドを使用してプロトタイプを作成する方法について説明します。

キーボードおよびゲームパッドのトリガー

Adobe XD では、キーボードショートカットとゲームパッドのトリガーを使用して、ネイティブのデスクトップアプリケーションとプロトタイプをシミュレートし、充実したゲームエクスペリエンスやデザインを実現できます。プロトタイプをワイヤー接続するとき、「トリガー」ドロップダウンリストから「キーとゲームパッド」を選択して、任意のキーを割り当てることができます。その後、プレビューウィンドウ、web ブラウザー、またはモバイルアプリケーションでのこれらのアニメーションを再生または録音し、関係者と共有して共同でレビューを行うことができます。これにより、ユーザーエクスペリエンス全体にリッチなレイヤーを追加しながら、より優れたプロトタイプストーリーを伝えることができます。

キーとゲームパッド」は、次の場合に選択できます。

  • 1 つのオブジェクトまたはアートボードを別のアートボードにワイヤー接続する場合
  • 2 つのコンポーネントのステートをワイヤー接続する場合
  • 1 つのコンポーネントのステートを別のアートボードにワイヤー接続する場合
  • 音声、オーディオ、ビデオ、または Lottie を再生する場合

キーボードトリガーの操作

特定のデスクトップアプリケーション、アクセシビリティ、ショートカットまたはゲームのプロトタイプを作成するときは、プロトタイプとやり取りするためにキーボードが必要です。プロトタイプでは、キーボードショートカットをトリガーとして使用して、画面やコンポーネントの状態を切り替えたり、音声、オーディオ、ビデオ、または Lottie を再生したりすることができます。

プロトタイプを接続する際には、「キーとゲームパッド」を選択します。次に、キーボードの任意のキーを押し、個々のオブジェクト、コンポーネントのステート、またはアートボード全体にトリガーとして割り当てることができます。これにより、同じアートボードから複数のトリガーを使用できます。

キーボードトリガー
キーボードトリガー

A. トリガーをキーボードショートカットに設定 B. キーボードショートカットキー C. アクションを自動アニメーションに設定 D. 移動先アートボードまたはコンポーネントのステート 

また、command + S、Ctrl + R などのショートカットを使用し、キーと修飾子を組み合わせてトリガーを定義することもできます。スペースキーや、ファンクション、スリープ、音量、電源などの他のシステムレベルのキーは使用できません。同じアートボード上の同じショートカットに複数のトリガーを割り当てると、最後のトリガーが割り当てられ、プレビュー中にトリガーされます。

ゲームパッドトリガーを使用する

ゲームのプロトタイプをテストする最も効果的な方法は、実際のゲームコントローラハードウェアを使用することです。プロトタイプでは、ゲームパッドをトリガーとして使用して、画面やコンポーネントの状態を切り替えたり、音声、オーディオ、ビデオ、または Lottie を再生したりすることができます。次に、接続されたゲームパッドコントローラーを使用して、デスクトッププレーヤーや web ブラウザーでプロトタイプを操作します。

Xbox コントローラ(Series X/S または One)を Bluetooth 経由または PlayStation コントローラー(DualSense または DualShock 4)経由で接続し、「キーとゲームパッド」を選択します。次に、接続したゲームパッドで任意のキーを押すと、個々のオブジェクト、コンポーネントのステート、またはアートボード全体に、そのキーをトリガーとして割り当てることができます。

ゲームパッドトリガー
ゲームパッドトリガー

A. ゲームパッドのトリガーを選択 B. ゲームパッドショートカットキー C. アクションを自動アニメーションに設定 D. 移動先アートボードまたはコンポーネントのステート 

プロトタイプのデザインとプレビューには必ず同じコントローラーを使用してください。例えば、Xbox コントローラーを使用してデザインした場合、デスクトップや web でのプロトタイプのテストにも、Xbox コントローラーを使用する必要があります。

モバイルアプリケーションおよびモバイル web エクスペリエンス

XD では、デスクトッププレビューアプリケーションおよび web プロトタイプでのキーボードゲームパッドサポートがサポートされます。モバイルアプリケーションまたはモバイルブラウザーでプロトタイプをプレビュー表示している場合、キーボードやゲームパッドデバイスが接続されていないため、タップを使用してアートボード間を移動できます。

サポートされているゲームコントローラーとブラウザー

USB および Bluetooth のサポート:

コントローラー

Mac(USB)

Mac(Bluetooth)

Win(USB)

Win(Bluetooth)

Xbox(Series X/S、One)

PlayStation(DualSense、DualShock 4)

ブラウザーのサポート:

コントローラー

Chrome(Mac)

Chrome(Win)

Edge Chromium(Mac)

Edge Chromium(Win)

Edge(レガシー)

IE

Firefox(Mac & Win)

Safari

Xbox(USB)

Xbox(Bluetooth)


PlayStation(USB)



推奨されません

PlayStation(Bluetooth)


推奨されません

キーボードまたはゲームパッドのキーを使用したプロトタイプ

  1. プロトタイプ」タブに切り替えます。

  2. インタラクションを定義するには、ソースオブジェクトの青いコネクタ、コンポーネントのステート、またはアートボードをクリックします。プロパティインスペクターで、次のオプションを設定します。

    • トリガー:トリガーの種類を「キーとゲームパッド」に設定し、キーボードまたはゲームパッド上の任意のキーを選択して、スペースバーおよびその他のシステムレベルキー(ファンクション、スリープ、音量、電源など)を除くトリガーを割り当てます。
    • タイプ:用意されているいずれかのアクションタイプ(「トランジション」、「自動アニメーション」、「オーバーレイ」、「スクロール先」、「前のアートボード」、「オーディオ再生」、「音声再生」、「ビデオ再生」、または「Lottie 再生」)を選択します。
    • 移動先:移動先のアートボードまたはコンポーネントのステートをドロップダウンリストから設定します(一部のアクションタイプでは利用できません)。

    アクションタイプを選択したら、そのアクションタイプで使用できるオプションを設定します。

  3. 1 つのオブジェクト、コンポーネントのステート、またはアートボードに対して、複数のインタラクションを定義するには、次の手順を実行します。

    1. 目的のオブジェクト、コンポーネントのステートまたはアートボードを選択し、アートボードの「+」ボタンをクリックします。または、プロパティインスペクターで「+」ボタンをクリックすることもできます。
    2. プロパティインスペクターでプロパティを設定します。

    トリガーのうち、タップ、ドラッグホバー時間は 1 回しか適用できず、音声キー/ゲームパッドは何度でも適用できることに注意してください。

    1

  4. デスクトップ上の変更をプレビューするには、デスクトッププレビューアイコン を選択します。

  5. XD デスクトップアプリケーションからプロトタイプを関係者と共有するには、共有表示設定を選択し、「デザインレビュー」または「開発」を選択します。

その他の関連ヘルプ

ヘルプをすばやく簡単に入手

新規ユーザーの場合