デザインとプロトタイプのプレビュー

最終更新日 : 2023年2月6日

Adobe XD を使用してプロトタイプをプレビューする方法、またインタラクションを記録する方法を説明します。

アセットまたはプロトタイプをデザインしたら、画面の切り替えなど、Web サイトまたはアプリのワークフローを正確にプレビューできます。プレビュー時には、Adobe XD でデザインまたはプロトタイプを変更して、それらをリアルタイムでプレビューできます。

メモ

Adobe XD モバイルアプリを使用して、iOS や Android デバイスでデザインまたはプロトタイプをプレビューすることもできます。詳しくは、Adobe XD モバイル版に関する FAQ をご覧ください。

デザインモードまたはプロトタイプモードで、「デスクトッププレビュー」をクリックします。

プレビューウィンドウが表示されます。プレビューウィンドウに、現在選択されているオブジェクトを含むアートボードが表示されます。オブジェクトが選択されていない場合は、プレビューウィンドウがまずホームアートボードで開きます。

メモ

フルスクリーンビューまたは通常のビューでデザインをプレビューできます。 macOS でフルスクリーンモードで表示するには、デザインの右上の再生アイコンをクリックします。プロトタイプが画面全体に拡張されます。

（オプション）XD でアセットまたはプロトタイプのインタラクションをクリックし、必要に応じて変更します。変更は、プレビューウィンドウで直ちに更新されます。

プレビューウィンドウを閉じるには、ウィンドウの閉じるボタンをクリックします。

プロトタイプでのインタラクションの記録

デザインまたはプロトタイプをプレビューするには、プレビューアイコンをクリックします。プレビューウィンドウで、「録画」をクリックします。インタラクティブプロトタイプがある場合は、プレビューウィンドウ内のすべてのインタラクションが .mp4 ファイルとして記録されます。

記録を停止するには、「録画」をもう一度クリックするか、Esc キーを押します。 .mp4 ファイルを保存する場所を指定します。

記録は、次の場合にも停止します。

アプリケーションを切り替えた場合
プレビューウィンドウにフォーカスがなくなった場合

デスクトッププレビューウィンドウでプロトタイプのインタラクションを記録する際に問題が発生する場合は、「macOS Catalina でプロトタイプのインタラクションを収録できない」を参照してください。

Adobe XD モバイルアプリケーションを使用して、iOS や Android デバイスでデザインまたはプロトタイプをプレビューできます。 XD を実行するコンピューターで USB ポートを使用して複数のデバイスを接続できます。デザインやプロトタイプに変更を加えるのと同時に、接続されたすべてのデバイスでそれらをリアルタイムでプレビューできます。詳しくは、Adobe XD モバイル版に関する FAQ を参照してください。