請觀看下方影片，快速瞭解全新的「錄音工具」面板 (預先發布版功能)。
完成本教學課程，瞭解如何使用「錄音工具」面板錄製、重播及評估使用者流程。
如要進一步瞭解如何分享記錄的使用者流程、編輯這些流程和相關步驟，請參閱錄音工具功能參考資料。
開啟「錄音工具」面板
>「更多工具」 >「錄音工具」。
簡介
我們會使用這個咖啡訂購示範網頁。結帳是一般使用者在購物網站上的流程。
在後續章節中，我們會逐步說明如何透過「Recorder」面板記錄、重播及稽核下列結帳流程：
- 將咖啡加入購物車。
- 將另一杯咖啡加入購物車。
- 前往購物車頁面。
- 從購物車中取出一杯咖啡。
- 啟動結帳程序。
- 填寫付款資料。
- 結帳。
記錄使用者流程
- 開啟這個示範頁面。按一下「Start new record」按鈕開始錄製。
- 在「錄製名稱」文字方塊中輸入「咖啡結帳」。
詳情請參閱「瞭解選取器」一文。
1. 按一下「Start a new record」按鈕。已開始錄製。面板顯示「Recording...」，表示正在錄影。
1. 點按「Cappuccino」即可將商品加入購物車。
1. 按一下「Americano」即可將該商品加入購物車。請注意，「錄音工具」會顯示您到目前為止執行的步驟。
1. 前往購物車頁面，將「Americano」從購物車中移除。
1. 按一下「提交」按鈕完成結帳程序。
1. 在「錄音工具」面板中，按一下「結束錄製」圖示 
即可結束錄製。
重播使用者流程
記錄使用者流程後，您可以按一下「
重播」按鈕重播。
您可以在頁面上看到使用者流程重播。重播進度也會顯示在「Recorder」面板中。
如果您在錄製時誤點，或者發生故障，可以偵錯使用者流程：減緩重播速度、設定中斷點，並逐步執行。
模擬速度緩慢的網路
調整重播設定即可模擬速度緩慢的網路連線。舉例來說，展開「重播設定」，然後在「網路」下拉式選單中選取「慢 3G」。
未來可能會支援更多設定。將您想要的重播設定告訴我們！
評估使用者流程
如要評估使用者流程的成效，請按一下「評估成效」按鈕。舉例來說，結帳是購物網站的重要使用者流程。透過「錄音工具」面板，您可以記錄一次結帳流程，並定期評估。
按一下「評估效能」按鈕會先觸發使用者流程的重播，然後在「效能」面板中開啟效能追蹤記錄。
瞭解如何透過「效能」面板分析網頁的執行階段效能。您可以在「成效」面板中啟用網站體驗指標核取方塊，然後查看網站體驗指標指標，找出改善使用者體驗的機會。
編輯步驟
以下將逐步介紹編輯已記錄工作流程中各個步驟的基本選項。
如需完整的編輯選項清單，請參閱功能參考資料中的「編輯步驟」一節。
展開步驟
展開每個步驟即可查看動作詳情。例如，展開「點擊元素 Cappuccino」步驟。
上述步驟會顯示兩個選取器。詳情請參閱「瞭解錄製內容的選取器」。
重播使用者流程時，Recorder 會嘗試依照序列的其中一個選取器查詢元素。舉例來說，如果 Recorder 成功使用第一個選取器查詢元素，就會略過第二個選取器並繼續下一個步驟。
從步驟中新增及移除選取器
您可以新增或移除任何選取器。舉例來說，您可以移除選取器 2，因為在這種情況中只需使用 aria/Cappuccino。將滑鼠遊標懸停在選取器 2 上，然後按一下 - 即可移除。
逐一編輯選取器
您也可以編輯 selector。舉例來說，如要選取「Mocha」而非「Cappuccino」，您可以採取下列做法：
請將選取器值改為「aria/Mocha」。
或者，也可以按一下「選取」按鈕
，然後按一下頁面上的「Mocha」。現在重播流程，應選取「Mocha」，而非「Cappuccino」。
請嘗試編輯其他步驟屬性，例如 type、target、value 等。
新增及移除步驟
您也可以選擇新增及移除步驟。如果您想新增額外步驟，或是移除不小心加入的步驟，這個方法就能派上用場。您可以直接編輯使用者流程，不必重新記錄使用者流程：
在要編輯的步驟上按一下滑鼠右鍵，或是按一下旁邊的
三點圖示。
您可以選取「移除步驟」將其移除。舉例來說，您不需要在「Mocha」步驟後使用 Scroll 事件。
假設您要等到 9 杯咖啡出現在頁面上，再執行任何步驟。在「Mocha」步驟選單中，選取「在前面新增步驟」。
在「Assert Element」中編輯新步驟，加入下列詳細資料：
- 類型：waitForElement
- 選取器 #1：.cup
- 運算子：== (按一下 [新增運算子] 按鈕)
- 計數：9 (按一下「add count」按鈕)
立即重播流程來查看變更。
後續步驟
恭喜，您已完成教學課程！
如要進一步瞭解與錄音工具相關的其他功能和工作流程 (例如匯入和匯出)，請參閱錄音工具功能參考資料。