Skip to main content
Flowstep 可將檔案中的畫面轉變為可點擊的原型。在編輯器工具欄中點擊 Preview，Flowstep 會以整頁原型播放器打開，你可以點擊瀏覽你的流程 — 這對測試使用者旅程或將其呈現給利益相關者很有用。

​
打開原型

1

點擊 Preview

在編輯器工具欄中，點擊 Preview。原型播放器以整頁檢視方式打開，與編輯器分開。
2

讓 Flowstep 連結你的畫面

如果你的檔案有兩個或更多畫面，Flowstep 會在你打開預覽時自動連結互動元素 — 按鈕、卡片、選單項目 — 到其目標畫面（你會看到「Bringing your screens to life」訊息）。只有在你的畫面自上次執行以來已變更時，連結才會重新生成。
3

點擊瀏覽你的流程

點擊任何連結的元素 — 按鈕、卡片、選單項目 — 以導覽到其目標畫面。側欄列出檔案中的所有畫面，以便你可以直接跳到任何畫面，Back to editor 會將你帶回檔案。
自動連結需要檔案中至少有兩個畫面。如果連結生成失敗，請使用播放器中的 Retry 按鈕。

​
手動設定導覽

你可以精確控制元素導覽的位置：
  1. 在編輯器中，選擇元素（例如按鈕）。
  2. 在右側的屬性面板中開啟 Navigation 面板。
  3. 從下拉清單中選擇目標畫面 — 或選擇 No navigation 以移除連結。
若要阻止 Flowstep 的自動連結覆蓋你自己設定的連結，請點擊導覽面板中的 Lock link。當連結被重新生成時，鎖定的連結保持不變。

​
互動控制

原型不只是可點擊的導覽 — 你畫面上的控制項在你預覽時會做出回應。翻轉開關、勾選核取方塊、選取單選按鈕、從下拉菜單選擇、切換標籤、在欄位中輸入，或增加計數器，畫面會實時更新以反映新狀態。 檔案中的畫面在預覽工作階段期間共用一個原型狀態，所以你在一個畫面上進行的變更會在你點擊進入其他畫面時延續。你也可以在淺色和深色外觀之間切換畫面，以查看它如何回應。
互動行為會自動從你的畫面生成 — 沒有任何要連線的東西。預覽檔案以試試看。