ハイパーリンクの作成 Adobe XD では、任意のオブジェクトから Web ページを開いたりメールアプリを起動するハイパーリンクを作成できます。アクションに「ハイパーリンク」を選択できるトリガーは以下...
複数のフローを含んだプロトタイプの作成 ひとつの XD ドキュメントに複数のインタラクションのフローを定義できます。フローの定義はプロトタイプモードで行います。 まず、ホームアートボードを設定して、フローの開始点を定義し...
音声コマンドや音声再生を使用したプロトタイプの作成 2/2(音声とオーディオの再生) Adobe XDでは、プロトタイプに音声によるテキストの読み上げや、オーディオを使用した効果音を追加できます。 音声UIのプロトタイプを作成していて、遷移したら音声が再生されるよう...
音声機能付きプロトタイプのデザイン Adobe XDは、音声を使って体験をデザインし、音声機能付きプロトタイプを共有できます。デザイナーは、音声技術やコーディングに関する知識がなくても、音声をプロトタイプに簡単に追加...
音声コマンドや音声再生を使用したプロトタイプの作成 1/2(音声コマンドの使用) Adobe XD は、音声 UI(VUI)のプロトタイプを作成できます。そのための機能のひとつが、音声をトリガーとする音声コマンドです。 プロトタイプへの音声コマンドの追加はプロト...
キーボードを使用したプロトタイプの作成 Adobe XD には、キー入力により操作できるプロトタイプを作成する機能があります。 設定はプロトタイプモードで行います。遷移先のアートボードに接続ハンドルをつないでから、トリガ...
インタラクティブプロトタイプの作成 1/2(ホーム画面と画面遷移) プロトタイプの作成は、プロトタイプモードに切り替えて行います まず、ホーム画面、すなわち最初に表示される画面を設定します。アートボードを選択して、左上隅のホームアイコンをクリックす...
インタラクティブプロトタイプの作成 2/2(画面遷移のアニメーション) 画面遷移のインタラクションにはデフォルトで「ディゾルブ」のアニメーションが設定されています。これを「左にスライド」「右にスライド」のアニメーションに変更すると、一覧画面と詳細画面の...
オーバーレイを使用したプロトタイプの作成 Adobe XDのプロトタイプでは、アートボードの上に別のアートボードを重ねて表示できます。ドロップダウンリスト、入力用キーボードなどの表現に便利です。 まず、プロトタイプモードで...
モバイルデバイスでプレビュー モバイルデバイスを使い、XD で作業中のデザインをレビューしたり、保存済みのクラウドドキュメントを確認することが可能です。プレビューに必要な XD モバイルアプリケーションは、iO...
プレビューウィンドウでのデザインとプロトタイプのプレビュー Adobe XD のデスクトッププレビューを使用して、プロトタイプに設定したインタラクションをプレビューできます。プレビューウィンドウを表示するには、デザインモードまたはプロトタイ...
リピートグリッドを使ったインタラクションの作成 リピートグリッドから他のアートボードへの接続は、3種類の方法が選べます。 リピートグリッド全体を接続するには、リピートグリッドを選択し、接続ハンドルをドラッグして移動先のアートボー...
プロトタイプのアニメーション化 1/3(フェードイン/アウト) 自動アニメーションを使用すると、流れるようなトランジションを作成して、アートボード間のコンテンツの関係を視覚的に表現できます。 プロトタイプモードでアートボードを接続し、プロパティ...
プロトタイプのアニメーション化 2/3(拡大縮小のアニメーション) 自動アニメーションでは、移動元と移動先のオブジェクトの種類、レイヤー名、グループの階層が一致している場合、そのオブジェクトの属性が自動的にアニメーション化されます。 移動元のアート...
プロトタイプのアニメーション化 3/3(ドラッグトリガー) 自動アニメーションとドラッグトリガーを組み合わせると、実際のドラッグ操作のようなインタラクションを作成できます。 移動元と移動先のアートボードには自動アニメーションの条件を満たすオ...
タイマートランジションの作成 1/2(時間トリガーの基本) 時間トリガーを使用して、時間の経過により自動的に発生するアートボード間のトランジションを作成できます。 プロトタイプモードで、移動元のアートボードを選択し、移動先のアー...
タイマートランジションの作成 2/2(自動ループの作成) 時間トリガーをアクションと組み合わせて使用すると、ループアニメーションを作成できます。 ループアニメーションを作成するには、アニメーションの最初と最後のアートボードの外観を同じにし...
アンカーリンクの作成 Adobe XD では、プロトタイプにアンカーリンクを作成し、アートボードの特定の位置にスクロールする動作を設定できます。 設定するには、プロトタイプモードに切り替えて、アンカーリ...