大きなプロトタイプにウィジェットのレイヤーが含まれる場合、組織化されたファイル ビルダーであっても各要素を操作するのは容易ではありません。Axure がこれまで見たプロジェクトの中には、数十のページと数千のウィジェットを含むものもありました。ここでは、複雑なプロトタイプですべてのウィジェットを識別、選択、追跡するための 7 つのヒントを紹介します。
1. 「スロー クリック」して他のウィジェットの後ろにあるウィジェットを選択する
[Outline] ペインを使用しないで他のウィジェットの後ろにあるウィジェットを選択するには、「スロー クリック」して現在選択しているウィジェットの後ろにあるウィジェットを選択します。選択するウィジェットの領域をクリックした後、カーソルを移動しないで、もう一度クリックします。ウィジェットが選択されるまでこの操作を繰り返します。
2. コンテキスト メニューから [Select Widget] を使用して他のウィジェットの後ろにあるウィジェットを選択する
[Outline] ペインを使用しないで他のウィジェットの後ろにあるウィジェットを選択する別の方法として、選択するウィジェットの領域を右クリックして、コンテキスト メニューから [Select Widget] を選択する方法もあります。右クリックした領域の後ろにあるウィジェットのリストが表示されます。
3. ウィジェットを非表示にする
キャンバスのウィジェットを一時的に非表示にするには、[Outline] ペインの [Hide from View] ボタンを使用します。このボタンは、グループ、ダイナミック パネル、コンポーネントに表示されます。編集中はキャンバスから非表示になりますが、プロトタイプには引き続き表示されます。
4. リピーターを編集するときに他のウィジェットを非表示にする
RP 10 では、リピーター ウィジェットを編集するときに、キャンバスの他のウィジェットを非表示にできるようになりました。この機能にアクセスするには、リピーターをダブルクリックして編集モードに入り、リピーターのフローティング ツールバーの [Isolate] ボタンを選択します。
5. マルチレイヤー デザインで作業しているときにページ ロードで移動アクションを使用する
マルチレイヤー デザインで作業していて、埋め込みウィジェットの編集時に問題がある場合は、編集中にキャンバスでウィジェットを重ねて配置しないで、間隔を空けて配置します。次に、編集プロセス全体でウィジェットを前後に移動するのではなく、[Move] アクションを含む [Page Loaded] インタラクションを設定し、プロトタイプが表示されたときに必要な場所にウィジェットを再配置します。良い例は、左上から展開するメニューを使用してモバイル プロトタイプを作成することです。デザインの残りの部分の上でこのメニューを編集するのではなく、キャンバスのオープン スペースで編集して、再配置する必要のあるウィジェットをターゲットにした [Page Loaded > Move] インタラクションを設定します。
6. アウトラインの [Collapse/Expand All]
[Outline] ペインの右上のフィルター メニューから [Collapse/Expand All] を使用して、アウトライン表示をすばやく整理できます。ページ コンテンツ全体の表示とトップレベルのグループのみの表示を簡単に切り替えることができます。
7. プレビュー中に [Start Trace] を使用してインタラクションを追跡する
目的が文書化でもトラブルシューティングでも、プロトタイプ インタラクションのリストを表示する必要がある場合は、プロトタイプのプレビュー時に確認します。コンソール パネルを開いて、[Start Trace] を選択した後、プロトタイプを操作するときのインタラクションと関連イベントをトリガーします。問題のある領域でのインタラクションが分離され、必要に応じて調整できます。
特に複雑で大規模なプロジェクトで、紹介したヒントがプロトタイプ作成のエクスペリエンスをシームレスなプロセスにするのに役立つことを期待しています。
Axure RP の製品概要、価格、およびライセンス体系などについては、こちらを参照してください。
30 日間の無償評価版は、こちらよりお申込みいただけます。
©Copyright 2022 Axure Software Solutions, Inc.
