キャンバスの使い方
PageFlow のキャンバスは、アプリケーションデータの編集ではなく、ルートグラフの探索を目的としています。
移動と拡大・縮小
- スクロールまたはトラックパッドで、ポインターを中心に拡大・縮小します。
- 空いているキャンバスをドラッグして表示範囲を移動します。
- ページカードを選択し、関連ページを表示します。
- ビューポート操作でモバイルとデスクトップのプレビューを比較します。
ページにフォーカスする
ページを選択すると、接続されたページが表示範囲に入り、選択したプレビューがライブ iframe になり、遷移ホットスポットが表示されます。グラフ全体の情報量が多すぎる場合に便利です。
ルートグループを探索する
共通のパス区間を持つルートはデッキとして表示できます。デッキを開くと次の階層を確認できます。PageFlow は現在のグループをパンくずで示し、階層間をアニメーションします。
接続を読む
接続には方向があります。外向きの線は、元ページに対象ページへ到達する既知の方法があることを示します。線がなくても遷移不能とは限りません。計算される遷移先は、アプリが公開した後に検出されます。
プレビューを更新する
PageFlow は古いページを上限付きキューで再キャプチャします。選択ページと表示中のページが優先されます。ルートやリンクの変更は HMR で配信され、新しい画像が準備できるまで既存のサムネイルを表示します。
ヒント
- ホームまたは主要な入口ルートから始めます。
- 大規模アプリでは、一度に一つのルートグループを開きます。
- 初期化時に書き込みを行うページにはテストデータを使います。
- ページの準備が終わらない場合は明示的な準備完了シグナルを追加します。