最初のプロトタイプを作成
プロトタイプの使用
はじめてのプロトタイプ作成
プロトタイプを作成してエンドユーザーや利害関係者に公開し、フローを検証します。
詳細手順
1. 新しいプロトタイプの作成
プロトタイプとライブラリのリストから + アイコンの項目を選択し、新しいプロトタイプを作成します。
2. 画像の追加
デザイナーに画像をドロップ、または [画像の追加] ボタンをクリックしてローカルにあるファイルを選択します。 追加した画像はプロトタイプのスクリーンになります。
Sketch プロジェクトを追加して Sketch アートボードをスクリーンにすることもできます。
3. インタラクションの追加
スクリーンを選択して左のパネルに読み込みます。
スクリーン領域上にクリックしてドラッグすると、ホットスポットを作成します。
[インタラクションの追加] ボタンをクリックします。
コネクターが表示されます。
右側のパネルでスクリーンの 1 つを選択してクリックします。
デフォルトで手順 4 で選択したスクリーンへ移動する FADE アニメーションで TAP インタラクションが作成されます。
インタラクションをクリックしてインタラクション パネルを表示します。ナビゲーションをトリガーするユーザー操作、トランジションのアニメーション、トランジションの期間を変更するために使用します。
インタラクション オプションの詳細については、このトピックを参照してください。
必要なインタラクションをすべて追加してプロトタイプを完了させます。
4. プロトタイプのプレビュー
[実行] ボタンをクリックします。
プレビュー モードを開きます。
プロトタイプをインタラクティブに操作します。
[閉じる] ボタンをクリックします。
デザイナーに戻ります。
5. プロトタイプの公開
[公開] ボタンをクリックします。
プロトタイプを共有して表示するためのリンクを取得します。
レビューアーがプロトタイプにコメントしたり、ユーザーがユーザビリティ テストでフローを確認したりできます。