Pomarańczowy: nowa aplikacja PWA zwiększa liczbę konwersji o 52% na urządzeniach mobilnych

Nowa PWA ma też średni czas wczytywania o 30% krótszy niż stara witryna, a także niższy współczynnik odrzuceń (o 12%) i większą głębokość sesji (o 18%).

Adam Skręt
Adam Skręt
Marcin Sierakowski
Marcin Sierakowski
Rafał Filipek
Rafał Filipek

Orange Polska S.A. (należąca do międzynarodowej grupy Orange) jest wiodącym dostawcą usług telekomunikacyjnych w Polsce, w tym usług telekomunikacyjnych mobilnych i stałych, takich jak głos, transmisja danych, dostęp do internetu i telewizja. Oferujemy też usługi informatyczne i integracyjne, linie dzierżawne oraz inne usługi i sprzęt teleinformatyczny o wartości dodanej.

Zrzuty ekranu nowej aplikacji PWA.

Wyzwanie

Wszyscy znamy to uczucie niepokoju, które przeradza się w irytację, gdy strona internetowa wczytuje się wieki. W przypadku firm cyfrowych, które mają niewielką lub w ogóle nie mają obecność fizyczną, wpływ tego czynnika jest oczywisty, zwłaszcza w przypadku aplikacji mobilnych. Nasze wewnętrzne badania wyraźnie pokazują, że najczęstszym powodem odinstalowania aplikacji jest szybkość. Jeśli jednak działasz w dobrze rozwiniętym sektorze, jak my, i masz skuteczną strategię dotyczącą tradycyjnych kanałów dystrybucji, wpływ szybkości w internecie nie jest tak oczywisty, ponieważ internet nie jest jedynym źródłem naszych przychodów. W związku z tym jeszcze trudniej jest przekonać kadrę kierowniczą do inwestowania w szybkość.

Aby przekonać do tego pomysłu naszych menedżerów, wykorzystaliśmy historyczne dane o wydajności z Google Analytics, aby wyraźnie pokazać korelację między czasem wczytywania a współczynnikami konwersji. Dzięki twardym danym mogliśmy udowodnić, że każda dodatkowa sekunda wczytywania strony powodowała spadek przychodów i sprzedaży o 15–20%.

Wykresy przedstawiające korelację między czasem wczytywania a konwersjami.
Górny wykres (pomarańczowy) pokazuje współczynnik konwersji w starej witrynie podzielony według czasu wczytywania. Na przykład pierwszy słupek od lewej przedstawia użytkowników, którzy wczytali stronę w mniej niż 2 sekundy. Pasek obok niego przedstawia użytkowników, którzy wczytywali stronę przez 2–3 sekundy. Wykres na dole (w kolorze szarym) pokazuje czasy wczytywania, które faktycznie miały miejsce w starej witrynie.

Podejście

Zdecydowaliśmy się utworzyć progresywną aplikację internetową (PWA). Skupiliśmy się na ruchu mobilnym, ponieważ ponad 75% klientów korzysta z naszej witryny na urządzeniach mobilnych. Zespół skupił się na poprawie kluczowych wskaźników wydajności i zapewnieniu bardziej angażujących i atrakcyjnych wrażeń.

Utworzyliśmy nowy interdyscyplinarny zespół scrumowy (w tym specjalistów z IT, biznesu i UX), którego celem było opracowanie prototypu, który pozwoliłby odpowiedzieć na te pytania:

  • Czy możemy skutecznie skrócić czas wczytywania, zachowując znaczne ograniczenia?
  • Jaki będzie rzeczywisty wpływ na konwersje i przychody?

Wybraliśmy Next.js ze względu na wiele optymalizacji, które są domyślnie włączone lub łatwe do skonfigurowania, takich jak automatyczne renderowanie po stronie serwera (co jest szczególnie ważne dla SEO), wstępne pobieranie danych i dzielenie kodu. Kolejnym ważnym czynnikiem była możliwość migracji stron w Next.js bez żadnych problemów w naszych starszych aplikacjach. Mimo to musieliśmy zarządzać transformacją w skomplikowanym środowisku, w którym nadal zależało nam na starszych systemach, co spowodowało niedostępność usługi. Aby temu zapobiec, zintegrowaliśmy Workbox, dzięki czemu nasza witryna jest zawsze dostępna, nawet jeśli backend jest niedostępny. Workbox przyniósł nam też znaczne zwiększenie wydajności dzięki wbudowanym rozwiązaniom do wstępnego buforowania, routingu żądań i buforowania w czasie wykonywania.

Wyniki

Średni czas wczytywania naszej nowej aplikacji internetowej jest o 30% krótszy niż w przypadku starej witryny, a liczba konwersji na urządzeniach mobilnych wzrosła o 52%. Współczynnik odrzuceń zmniejszył się o 12%, a głębokość sesji zwiększyła o 18%. Doświadczenia te potwierdziły kierunek strategiczny polegający na przekształceniu wszystkich rozwiązań skierowanych do klientów (w tym interfejsów samoobsługi i interfejsów dla sprzedawców) w rozwiązania oparte na technologii PWA.