実行可能なユーザー: すべてのユーザー
適用プラン: すべてのプラン
対応プラットフォーム: ブラウザ、デスクトップ、モバイル
プロトタイピングライブラリを使用して、Miroキャンバス上で直接プロトタイプレイアウトを構築します。このライブラリには、フローをビジュアル化し、早期にアイデアを構造化するのに役立つスクリーン、UIコンポーネント、アイコンが含まれています。
プロトタイピングライブラリを使用して、静的なプロトタイプを作成できます。高度なコンポーネント、コネクタライン、インタラクティブプレビューなどの機能はMiroプロトタイプアドオンが必要です。
プロトタイピング ライブラリーには、Miroでシングルおよびマルチスクリーンフローを手動で作成するために必要なすべてのものが揃っています。
プロトタイピング ライブラリーを開く
- キャンバスで、作成バーからツール、メディア、インテグレーション (
) をクリックします。
- 「プロトタイピング」を検索して見つけたら、プロトタイプ ライブラリーをクリックします。
- プロトタイプ ライブラリーパネルが開きます。
プロトタイプ ライブラリーの内容
プロトタイプ ライブラリーはタブに整理されています。すべてのユーザーがスクリーン、UI コンポーネント、アイコンを使用して静的なプロトタイプレイアウトを組み立てることができます。
💡 AI が生成したプロトタイプやインタラクティブなフローを作成する際は、Miro Prototypes と一緒にプロトタイピング ライブラリを使用します。
スクリーン
スクリーンは、プロトタイピングのフロー向けにあらかじめ用意されたフレームです。モバイル、タブレット、またはデスクトップのスクリーンをキャンバスに追加し、その上に UI 要素をドラッグしてレイアウトを構築することができます。
スクリーンの操作
- 表示または非表示にして、デバイスのフレームのように見せたり、単純なフレームにしたりできます
- 回転させる
- リサイズして高さのみを延ばせます
UIコンポーネント
UIコンポーネントは、ボタンや入力欄、ナビゲーションバー、フォーム要素などの一般的なインターフェイス要素で、画面上にドラッグして配置できます。
以下の操作が可能です:
- コンポーネントを画面にドラッグして配置
- リサイズや再配置
- コンテキストメニューからテキストやベーシックなスタイルを編集
✏️ コンテキストメニューのオプションは、選択した要素によって異なります。
Miro Prototypesアドオンが有効化されている場合、一部のUIコンポーネントがプレビューモードでインタラクティブになります。例えば、ボタン、スライダー、入力フィールド、ドロップダウンメニューは、定義したコネクターラインにもとづいてユーザー操作に反応します。
また、高度なコンポーネントのような一部のコンポーネントセットは、Miro Prototypesアドオンでのみ利用可能です。アドオンが有効でない場合、これらのコンポーネントはライブラリにインジケータ付きで表示されることがあります。
アイコン
アイコンタブには、プロトタイプで使用できる検索可能なアイコンライブラリが含まれています。
アイコンを追加または置換する
- ライブラリからアイコンをキャンバスにドラッグします。
- アイコンを選択し、コンテキストメニューからその色を更新します。
- アイコンを置換 を選択して、位置やサイズを変えずに別のアイコンと交換します。
ワイヤーフレーム(レガシー)
ワイヤーフレーム タブにはレガシーのワイヤーフレーム要素が含まれています。これらの要素は既存のボードで利用可能かつ編集可能ですが、新しいプロトタイプではプロトタイピングライブラリから画面やUIコンポーネントを使用してください。
コネクターラインとインタラクティビティ(Miro Prototypesアドオン)
コネクターラインを使って、プロトタイプ間の画面遷移を定義できます。Miro Prototypes アドオンが有効になっていると、要素や画面間にコネクターラインを作成してマルチステップフローを構築できます。
コネクターラインはインタラクティブ プレビューも可能にします。プレビューモードでは、接続された画面がクリック可能なフローとして機能し、画面がビューポートを超える場合は縦方向にスクロールします。アドオンがない場合、コネクターラインやインタラクティブな動作は利用できません。
💡 一部のUI要素は画面に追加されると稲妻アイコンが表示されます。マルチスクリーン フローでは、稲妻アイコンをドラッグして画面間にコネクターラインを作成します。