Nagrywaj, odtwarzaj ponownie i mierz przepływy użytkowników

Sofia Emelianova
Sofia Emelianova

Rzuć okiem na nowy panel Dyktafonu (funkcja podglądu) z filmem poniżej.

Ukończ ten samouczek, aby dowiedzieć się, jak używać panelu Dyktafon do nagrywania, odtwarzania i pomiaru przepływów użytkowników.

Więcej informacji o udostępnianiu zarejestrowanych przepływów użytkowników, edytowaniu ich i ich krokach znajdziesz w artykule Informacje o funkcjach Dyktafonu.

Otwieranie panelu Dyktafonu

  1. Otwórz Narzędzia deweloperskie.
  2. Kliknij Więcej opcji   Więcej.   > Więcej narzędzi > Dyktafon.

    Dyktafon w menu.

    Panel Dyktafonu możesz też otworzyć za pomocą menu poleceń.

    Pokazuj polecenie Dyktafonu w menu poleceń.

Wstęp

Użyjemy tej strony demonstracyjnej zamawiania kawy. Proces płatności to powszechny przepływ użytkowników na stronach sklepów.

W kolejnych sekcjach pokażemy, jak nagrywać, odtwarzać i kontrolować ten proces płatności w panelu Dyktafon:

  1. Dodaj kawę do koszyka.
  2. Dodaj kolejną kawę do koszyka.
  3. Przejdź do strony koszyka.
  4. Wyjmij jedną kawę z koszyka.
  5. Rozpocznij proces płatności.
  6. Podaj dane do płatności.
  7. Sfinalizuj transakcję.

Rejestrowanie zachowania użytkownika

  1. Otwórz tę stronę demonstracyjną. Aby rozpocząć, kliknij przycisk Rozpocznij nowe nagrywanie.
  2. W polu tekstowym Nazwa nagrania wpisz „kawiarnia do kasy”. Rozpocznij nowe nagranie.

Więcej informacji znajdziesz w artykule z omówieniem selektorów. 1. Kliknij przycisk Rozpocznij nowe nagranie. Nagrywanie zostało rozpoczęte. Na panelu wyświetla się komunikat Nagrywanie..., co oznacza, że trwa nagrywanie. Trwa nagrywanie. 1. Kliknij Cappuccino, aby dodać ją do koszyka. 1. Kliknij Americano, aby dodać produkt do koszyka. Zwróć uwagę, że Dyktafon pokazuje wykonane dotąd czynności. Kroki w panelu Dyktafon. 1. Otwórz stronę koszyka i usuń z koszyka Americano.

1. Kliknij przycisk Łącznie: 19 PLN, aby rozpocząć proces płatności. 1. W formularzu ze szczegółami płatności wypełnij pola Imię i nazwisko oraz E-mail, a następnie zaznacz pole Chcę otrzymywać informacje na temat zamówień i wiadomości promocyjne. Formularz szczegółów płatności. 1. Kliknij przycisk Prześlij, aby sfinalizować transakcję. 1. W panelu Dyktafon kliknij przycisk Zakończ nagrywanie. Zakończ nagrywanie, aby zakończyć nagrywanie.

Ponowne odtwarzanie zachowania użytkownika

Po zarejestrowaniu zachowania użytkownika możesz go ponownie odtworzyć, klikając przycisk Odtwórz ponownie.Odtwórz ponownie.

Na stronie możesz zobaczyć ponowne odtwarzanie przepływu użytkowników. Postęp odtwarzania jest też wyświetlany w panelu Dyktafon.

Jeśli podczas nagrywania popełnisz błąd lub coś nie działa, możesz zdebugować schemat użytkownika: spowolnić jego ponowne odtwarzanie, ustawić punkt przerwania i wykonać go krok po kroku.

Symulowanie powolnej sieci

Możesz zasymulować wolne połączenie sieciowe, konfigurując ustawienia ponownego odtwarzania. Na przykład rozwiń Ustawienia ponownego odtwarzania i w menu Sieć wybierz Powolne 3G.

Ustawienia ponownego odtwarzania.

W przyszłości możemy dodać więcej ustawień. Udostępnij nam ustawienia odtwarzania, które chcesz wybrać.

Mierzenie przepływu użytkowników

Skuteczność przepływu użytkowników możesz mierzyć, klikając przycisk Mierz skuteczność. Na przykład proces płatności to niezwykle ważny proces witryny zakupowej. Panel Dyktafon pozwala zarejestrować proces płatności raz i regularnie go mierzyć.

Kliknięcie przycisku Zmierz wydajność spowoduje najpierw ponowne odtworzenie ścieżki użytkownika, a następnie otwarcie śledzenia skuteczności w panelu Skuteczność.

Dowiedz się, jak analizować wydajność strony w czasie działania za pomocą panelu Wydajność. Możesz zaznaczyć pole Wskaźniki internetowe w panelu Wydajność, aby wyświetlić Wskaźniki internetowe i określić możliwości poprawy komfortu przeglądania stron internetowych.

Skuteczność.

Edytuj kroki

Omówmy podstawowe opcje edycji kroków w zarejestrowanym przepływie pracy.

Pełną listę opcji edycji znajdziesz w sekcji Edytowanie kroków w dokumentacji funkcji.

Rozwiń kroki

Rozwiń każdy krok, aby zobaczyć szczegóły działania. Na przykład rozwiń krok Element kliknięcia „Cappuccino”.

W panelu Dyktafonu element Cappuccino został rozszerzony o typ, cel, selektory, przesunięcie X i wartość Y.

Powyższy krok przedstawia 2 selektory. Więcej informacji znajdziesz w artykule Omówienie selektora nagrania.

Podczas ponownego odtwarzania ścieżki użytkownika Dyktafon próbuje wysłać zapytanie do elementu za pomocą jednego z selektorów sekwencji. Jeśli na przykład Dyktafon wyśle zapytanie do elementu z pierwszym selektorem, pominie drugi selektor i przejdzie do następnego kroku.

Dodawanie i usuwanie selektorów kroku

Możesz dodawać i usuwać selektory. Na przykład możesz usunąć selektor nr 2, bo w tym przypadku wystarczy aria/Cappuccino. Najedź kursorem na selektor nr 2 i kliknij -, aby go usunąć.

Panel nagrywania w Narzędziach deweloperskich zawiera opcję usunięcia selektora.

Edytuj selektory w danym kroku

Możesz też edytować selektor. Jeśli na przykład chcesz wybrać Mocha zamiast Cappuccino, możesz:

  1. Zamiast tego zmień wartość selektora na aria/Mocha.

    Edytuj selektor.

    Możesz też kliknąć przycisk WybierzPrzycisk Wybierz., a następnie Mocha na stronie.

  2. Powtórz proces. Powinien wybrać Mocha zamiast Cappuccino.

  3. Spróbuj edytować inne właściwości kroku, takie jak type, target, value i inne.

Dodawanie i usuwanie kroków

Dostępne są też opcje dodawania i usuwania kroków. Jest to przydatne, gdy chcesz dodać kolejny krok lub usunąć przypadkowo dodany krok. Zamiast ponownie rejestrować wzorzec przeglądania, możesz go po prostu edytować:

  1. Kliknij prawym przyciskiem myszy krok, który chcesz edytować, lub kliknij ikonę z 3 kropkami Menu z 3 kropkami. obok niego.

    Menu kroku z opcjami usuwania i dodawania kroków przed lub po.

  2. Możesz wybrać Usuń krok, aby go usunąć. Na przykład nie trzeba podawać zdarzenia Scroll (przewinięcie po kroku Mocha).

  3. Załóżmy, że chcesz poczekać, aż na stronie wyświetli się 9 kaw, zanim wykonasz jakiekolwiek czynności. W menu kroków Mocha wybierz Dodaj krok wcześniej.Dodano nowy krok o nazwie Zgłaszanie elementu i można go teraz edytować.

  4. W sekcji Zgłoś element edytuj nowy krok, podając następujące informacje:

    • typ: waitForElement
    • selektor nr 1: filiżanka
    • operator: == (kliknij przycisk dodaj operator)
    • liczba: 9 (kliknij przycisk dodaj licznik) Nowy krok w procesie płacenia za kawę został zaktualizowany o wcześniejsze informacje.
  5. Odtwórz ponownie.Aby zobaczyć zmiany, odtwórz ponownie proces.

Dalsze kroki

Gratulujemy ukończenia samouczka!

Więcej informacji o funkcjach i procesach (takich jak importowanie i eksportowanie) powiązanych z Dyktafonem znajdziesz w dokumentacji funkcji Dyktafonu.