l Webデザイン　Adobe XDの「共有」機能

2020年7月14日 18:51

Adobe XDで作成したデザインやプロトタイプの共有URLを発行して、関係者に共有できます。コメント機能や開発者向けのデザインスペックなど高度な機能も利用できます。

この機能は共有リンクの用途に応じて、必要なものをデザイナー側で選択できます。「プリセット」として提供されているものを選ぶか、自由にカスタムすることが可能です。

l 共有モードの表示

上部メニューにあるタブをクリックして「プロトタイプ」モードに切り替えます。

共有対象のアートボードとホームアートボードを確認

共有モードを開いた時に、自分が共有したい画面がハイライトされているかどうか確認しましょう。ハイライトされていない場合、アートボードから始まるインタラクションの一連の流れの中にそのアートボードが含まれていない可能性があります。

プロパティインスペクタにて、次の情報を入力して「リンクを作成」をクリックします。

・タイトル
・表示設定（プリセットの選択）
・アクセス権の所有者

デザインやプロトタイプに関するフィードバックを収集するために使います。共有相手にデザイン・プロトタイプを確認してもらいつつ、必要に応じて直接コメントしてもらいフィードバックを直接得られます。
次の機能が選択されています。

・ホットスポットのヒント
・コメント
・ナビゲーション制御

開発者とデザインスペックを共有するために使います。
閲覧者がアートボード内の様々なオブジェクトの色、テキスト、座標など様々な数値を取得し、CSSコードの表示・コピーまでできます。共有リンクとしては次の機能が選択されています。

・コメント
・ホットスポットのヒント
・ナビゲーション制御
・デザインスペック

共同開発者などにデザイン・プロトタイプを説明する時に適しています。

・ホットスポットのヒント
・ナビゲーション制御
・全画面表示

実際にユーザーにプロトタイプを操作してもらい、それを記録して開発者が情報を収集したい時に適しています。共有リンクではホットスポット表示もナビゲーション制御もできません。このため、共有リンクを開いたユーザーは誤動作することなく、事前の説明を踏まえて目の前の画面を操作することだけに集中できます。

上記のプリセットで活用されてきたような設定を、好みに応じて設定した共有リンクを作成できます。

・コメント
・ホットスポットのヒント
・ナビゲーション制御
・全画面表示

「共有」機能を使用して、プレゼンテーション用で作成してみました。Adobe XDを持たない方でも、インターネット環境さえあればいつでもどこでもブラウザから内容を確認することができます。

（パスワード：DjqV66Jp）

この記事が気に入ったらサポートをしてみませんか？