Platforma · Eksperymenty

Trzy typy testów, jeden edytor wizualny

Testy wielowariantowe wizualne, przekierowania URL i testy po stronie serwera, uruchamiane prosto z rozszerzenia Chrome na waszej żywej witrynie. Wskażcie element, zmieńcie go, zapiszcie wariant.

Jak działa test

Od hipotezy do wdrożonej zmiany

Kto to widzi, co uruchomić dalej, i co dostaje zespół programistów, kiedy skończycie.

  • Edycja tekstu, stylu, układu i pozycji bez kodu, plus własny CSS i JS dla zaawansowanych użytkowników
  • Kierowanie według URL, urządzenia i ciasteczka, z trwałym przypisaniem, więc powracający odwiedzający widzą spójne doświadczenie
  • Renderowanie z zabezpieczeniem przed migotaniem i czterema niezależnymi bezpiecznikami, więc odwiedzający nigdy nie widzą oryginału mrugającego w test
  • Każdy kwalifikujący się odwiedzający wchodzi do każdego kwalifikującego się testu, więc uruchomienie dziesięciu testów naraz nie kosztuje żadnej wielkości próby
  • Wdrożenie zwycięzcy jednym kliknięciem na 100% ruchu i przekazanie do wdrożenia dla zwycięzców wartych wpisania na stałe
  • Śledzenie hipotez z punktacją priorytetów PXL do uporządkowania waszego backlogu
WielowariantowyPrzekierowanie URLPo stronie serwera
Biblioteka testów: pięć testów w trzech typach, z podziałem ruchu i okresem kierowania, jeden działa, jeden czeka na decyzję, a jeden jest już wdrożony.

Kierowanie

Pokażcie to dokładnie tym, komu chcieliście

Trzy wymiary, łączone dla każdego testu: adres, urządzenie i ciasteczko, które wasza witryna już ustawia. Przypisanie jest trwałe, więc powracający odwiedzający zachowuje wariant, który dostał.

  • Reguły URL na siedmiu warunkach, w tym regex i dwa negatywne
  • Komputer, telefon albo tablet, wykrywane zanim odwiedzający zostanie zakwalifikowany
  • Kierowanie po ciasteczku dla ruchu zalogowanego albo segmentowanego, dopasowywane do listy wartości
  • Trwałe przypisanie, przechowywane w pamięci przeglądarki, a nie w ciasteczku
  • Wymuszenie dowolnego wariantu przez URL do przeglądu, bez konta testowego
Reguły kierowania jednego testu: strony produktów na telefonie, z wyłączeniem sekcji outlet, dla odwiedzających, których ciasteczko programu lojalnościowego oznacza jako członków, z trwałym przypisaniem, wpuszczające 61% ruchu.

Wdrażanie zwycięzcy

Jedno kliknięcie do 100%, albo przekazanie zespołowi programistów

Wdrażajcie zwycięski wariant na cały ruch bezpośrednio z ekranu wyników. Kiedy zmiana ma zamiast tego żyć w waszej bazie kodu, Pertento pisze przekazanie z dokładną zmianą.

  • Wdrożenie jednym kliknięciem z zapisem, kto je wdrożył
  • Przekazanie do wdrożenia z selektorem i zmianą
  • Powrót do oryginału w każdej chwili
Ekran wdrożenia: wariant B wypuszczony na cały ruch, z nazwiskiem osoby wdrażającej, znacznikiem czasu i możliwością wycofania, obok przekazania podającego selektor, treść i kolor do wpisania na stałe.

Priorytetyzacja

Backlog uporządkowany według wyniku PXL, nie według opinii

Zapiszcie każdą hipotezę, oceńcie ją według modelu PXL i pozwólcie rankingowi zdecydować, co uruchomić dalej. Trzy wyniki łączą się w jedną liczbę, bo backlog musi dać się uporządkować, a trzy liczby to dyskusja.

  • Potencjał, ekspozycja i nakład pracy, każde ocenione od jednego do pięciu
  • Połączone w jedną ważność od zera do dziesięciu, według której sortuje się lista
  • Hipotezy powiązane z testem, który je sprawdził
  • Szkic z najwyższym wynikiem na wierzchu, kiedy nic innego nie potrzebuje waszej uwagi
Backlog hipotez uporządkowany według wyniku PXL, od przyklejonego przycisku dodania do koszyka z 9,4 aż po wideo w sekcji hero z 3,2.

Wdrożenie

Przekażcie zwycięzcę zespołowi programistów, ze zmianą

Zwycięzca może być wydawany przez Pertento bez końca, ale większość zespołów w końcu chce mieć go w bazie kodu. Kolejka wdrożeń śledzi, którzy zwycięzcy wciąż działają na platformie, a którzy zostali już wpisani na stałe.

  • Selektor i dokładna zmiana, gotowe do wklejenia
  • Status dla każdego zwycięzcy: oczekuje, w toku, wpisany na stałe
  • Test dalej działa, dopóki kod nie zostanie wdrożony
Pulpit wdrożeń: pięciu zwycięzców ze swoim statusem i przekazanie jednego z nich, podające selektor, zmianę, informację, czy Pertento wciąż go wydaje, i zgłoszenie.

Potoki · beta

Zdecydujcie o kolejności, potem przestańcie planować ręcznie

Potok to uporządkowany bieg etapów, a etap to zestaw testów działających razem. Testy, które by się zderzyły, trafiają do różnych etapów, a każdy etap działa po kolei na pełnym ruchu, co jest odwrotnością wzajemnego wykluczania i dzielenia publiczności.

  • Etapy uzbrajają się same po kolei, więc nic nie czeka, aż ktoś sobie o tym przypomni
  • Przejście, kiedy wszystkie testy się zakończą, przy pierwszym istotnym wyniku, albo na sygnał od człowieka
  • Etap uzbraja się w całości albo wcale, więc częściowo uruchomiony etap nigdy nie zostaje w działaniu
  • Automatyzacja i automatyczne wdrożenie to osobne przełączniki, oba wyłączone, dopóki ich nie włączycie
  • Przy wyłączonej automatyzacji silnik i tak zapisuje, co by zrobił, tym samym kodem
Tablica potoku z czterema etapami: etap checkoutu zakończony, dwa testy na stronie produktu działają razem w bieżącym etapie, a dwa późniejsze etapy czekają, z włączoną automatyzacją i wyłączonym automatycznym wdrożeniem.

Edytor wizualny

Wskażcie to, zmieńcie to, zapiszcie wariant

Edytor otwiera się na waszej żywej witrynie z rozszerzenia Chrome. Wybierzcie element, zmieńcie jego treść i styl w panelu właściwości, a zmiana zapisuje się przy wariancie. Bez wdrożenia, bez zgłoszenia, bez kopii strony na środowisku testowym.

TekstStylUkładPozycjaWłasny CSS/JS
PDP Mobile — Sticky CTA + selector /V-1Save
FREE DELIVERY OVER €504.7 ★★★★★  ·  27,726 reviewsFind a store
NORTHWINDHi, what are you looking for?Sign in
WOMENMENKIDSFOOTWEAREQUIPMENTHOMEHUNTINGNEWSSALE
Storefront hero · 1200×472
AUTUMN ARRIVALS ARE HERE
Shop the new seasonShop autumn arrivalsa.cta
Product
NEW
Art 4176Trail trouser, men€39
Product
NEW
Art 5038Fleece shirt, men€29
Product
COLOUR
Art 1520Bamboo tee, menFrom €10
Product
NEW
Art 4177Trail trouser, women€39
Properties
bodydivmaindivsectiona
a.cta
Typography
Text content
Shop autumn arrivals
Font family
sans-serif
Font size
13px
Text colour
#111827#c81e28
Text align
center
Spacing
Size
Background
Border
Position
Content
Changes3 changes

Drzewo hierarchii i pole selektorana chwile, kiedy wskazanie nie jest dość precyzyjne, z okruszkami pokazującymi dokładnie, który węzeł jest wybrany.

Przełącznik interaktywnościprzełącza między wybieraniem elementów i korzystaniem ze strony, więc możecie otworzyć menu albo okno modalne i zmienić to, co jest w środku.

Wybór urządzeniaprzestawia obszar roboczy na szerokości, których używa wasz ruch. Wariant, który działa tylko w szerokości komputera, nie jest skończony.

Lista zmianjest wariantem: uporządkowany zapis wszystkiego, co robi, każdy wpis usuwalny osobno, i ta sama lista, którą później czyta przekazanie.

Więcej o edytorze wizualnym · Jak otwiera go rozszerzenie

Budowanie testu

Elementy, dzięki którym drugi test jest tańszy niż pierwszy

Większość czasu programu nie idzie w pierwszy test. Idzie w odtwarzanie konfiguracji, sprawdzanie wariantu przed publikacją i prowadzenie zapisu, który ktoś przeczyta za rok.

Pięć miejsc wstawienia HTML

Zamieńcie element, wstawcie coś w jego środku na początku albo na końcu, albo umieśćcie markup przed nim lub po nim. Zmiany struktury dają się opisać jedną linią, i to właśnie pozwala je później przejrzeć.

Własny CSS i JavaScript

Dla każdego wariantu, na wszystko, czego panel właściwości nie potrafi wyrazić. Jedzie w bundle zbudowanym dla waszej witryny i działa, zanim strona zostanie odsłonięta, więc zmiana ze skryptu nigdy nie czyta się jako skok.

Zrzuty ekranu wariantów

Uchwyćcie i przytnijcie to, jak wariant wyglądał, prosto z edytora. Wynik czytany pół roku później jest bez tego listą selektorów.

Duplikowanie testu

Kopiuje warianty, każdą zmianę na nich, zrzuty ekranu i wszystkie trzy rodzaje kierowania. Odtwarzanie konfiguracji ręcznie to ten moment, w którym wydawana jest zła reguła kierowania.

Próbne przebiegi przed startem

Przećwiczcie cały łańcuch na prawdziwym runtime jako oznaczony test, a potem go usuńcie. Nic, co zebrała próba, nigdy nie musi być potem tłumaczone w raporcie.

Wymuszenie wariantu przez URL

Dodajcie parametr do dowolnego adresu, żeby przypiąć się do konkretnego wariantu albo zobaczyć jeden wariant przy wszystkim innym trzymanym w oryginale. Przegląd na oko nie wymaga konta testowego.

Podczas działania

Co runtime robi na stronach waszych odwiedzających

Wszystko poniżej rozstrzyga się w przeglądarce, na podstawie pliku skompilowanego wyłącznie dla waszej witryny. Przed wyrenderowaniem strony nie ma żadnego wywołania do Pertento i nic nie czeka na odpowiedź, żeby zdecydować, co widzi odwiedzający.

Współbieżność nic was nie kosztuje

Każdy kwalifikujący się odwiedzający wchodzi do każdego kwalifikującego się testu, więc dziesięć działających testów dostaje każdy pełną publiczność, a nie jej dziesiątą część. Powód, dla którego większość programów prowadzi jeden test naraz, tu nie obowiązuje.

Wagi, które zawsze się sumują

Podziały zapisywane są w punktach bazowych na dziesięć tysięcy i sprawdzane, czy sumują się dokładnie, więc test na trzy warianty to naprawdę trzy równe trzecie, a nie trzy zaokrąglenia i luka.

Automatyczne równoważenie

Podział, który faktycznie dostał każdy wariant, jest mierzony i korygowany według harmonogramu, więc narastający przydział zbiega do tego, który skonfigurowaliście, zamiast od niego odpływać.

Trwałe przypisanie, bez ciasteczek

Odwiedzający zostaje z wariantem, który dostał, trzymanym w pamięci przeglądarki, a nie w ciasteczku. Spójność jest wymogiem poprawności, zanim będzie uprzejmością.

Zabezpieczenie przed migotaniem z czterema bezpiecznikami

Strona jest ukryta, kiedy zmiany są nakładane, i odsłaniana z czterech niezależnych ścieżek kodu. Awaria, przed którą to chroni, to witryna klienta pozostawiona pusta dla jego własnych odwiedzających.

Żadnego zapytania przed renderowaniem

Konfiguracja każdej witryny jest kompilowana do własnego statycznego pliku, więc runtime już przy wczytaniu wie, co uruchomić. Nic nie czeka na wywołanie API, żeby zdecydować, co widzi odwiedzający.

Pytania

O co zespoły pytają, zanim przejdą

Jak szybko możemy mieć działający test?

Jeden skrypt w head to cała instalacja i jedyna zmiana na waszej witrynie. Dalej wariant buduje się, wskazując elementy na waszych działających stronach, więc pierwszy test ogranicza tylko to, ile czasu zajmie wam decyzja, co testować, a nie cokolwiek, co trzeba zakupić, zbudować albo zaplanować. Nic nie wchodzi na żywo przez przypadek, kiedy się uczycie: nowy test jest szkicem, dopóki go nie uruchomicie.

Czy to spowolni witrynę albo pogorszy nasze Core Web Vitals?

Każda witryna dostaje własny skompilowany plik z wpisanymi w niego testami, więc runtime już przy wczytaniu wie, co uruchomić, i nic nie czeka na wywołanie do nas, zanim strona się wyrenderuje. Strona jest na moment wstrzymana, kiedy zmiany są nakładane, i to właśnie nie pozwala odwiedzającym zobaczyć oryginału migającego w test, a odsłaniana jest z czterech niezależnych ścieżek kodu, więc awaria pokazuje stronę niezmienioną, a nie pustą. Zbieranie danych ładuje się na końcu, po tym, jak strona jest widoczna, więc pomiar nigdy nie opóźnia renderowania.

Co edytor naprawdę potrafi zmienić i gdzie się zatrzymuje?

Tekst, styl, układ i pozycję edytuje się wskazywaniem, a zmiany struktury pokrywa pięć miejsc wstawienia HTML wobec elementu, który wybierzecie. Dalej zatrzymuje się uczciwie, a nie źle: cokolwiek, czego panel nie potrafi wyrazić, piszecie jako własny CSS albo JavaScript na wariancie, co znaczy, że test nigdy nie stoi zablokowany na narzędziu. Prawdziwą granicą jest zmiana, która dzieje się przed powstaniem strony: ranking, logika cen, model rekomendacji. To testy po stronie serwera i potrzebują waszych programistów.

Ile testów możemy prowadzić jednocześnie?

Tyle, ile macie pomysłów, i to jest ta odpowiedź, którą warto porównać z tym, czego używacie dziś. Każdy test losuje niezależnie, więc kwalifikujący się odwiedzający wchodzi do każdego testu, do którego się kwalifikuje, a każdy z nich mierzy wobec pełnej kwalifikującej się publiczności. Współbieżność nie dzieli tu waszej próby, i dlatego platforma sprawdza, czy dwa testy nie będą sobie przeszkadzać, zamiast racjonować, ile może działać. Tempo zwykle decyduje o różnicy między programem, który się opłaca, a takim, który nie.

Co stanie się z pracą, jeśli przestaniemy korzystać z Pertento?

Zwycięzcy, których wpisaliście na stałe, są już w waszej bazie kodu i nikt ich nie rusza, i właśnie do tego popycha was kolejka wdrożeń: wypisuje każdego zwycięzcę, którego wciąż wydajemy my, i oznacza go, dopóki wasi programiści nie będą mieli miejsca. Zwycięzcy nadal wydawani przez platformę zatrzymują się, kiedy ona się zatrzyma, tak samo jak zatrzymuje się każdy wariant. Testy, hipotezy i zapisana historia zostają na koncie, a nie w naszych narzędziach.

Wszystko, co jest w pakiecie

Pełny zestaw funkcji

Pertento to platforma do optymalizacji współczynnika konwersji dla stron i sklepów internetowych, zbudowana zarówno dla zespołów wewnętrznych, jak i dla agencji CRO prowadzących programy eksperymentowania w całym portfolio klientów.

Integracje

Działa ze stosem, który już prowadzicie

Jeden fragment kodu wchodzi na każdą witrynę, albo idźcie w pełni po stronie serwera. Nic do przebudowy.

Fragment w jednej linii

Wklejcie w head jeden tag o wadze 0,9 KB i już działacie. Bez kroku budowania, bez zależności.

Google Tag Manager

Wdrażajcie testy i zarządzajcie nimi prosto przez GTM. Czas programistów niepotrzebny.

API po stronie serwera

Uruchamiajcie testy poza przeglądarką: ceny, wyszukiwanie i routing, bez migotania.

  • Shopify
  • BigCommerce
  • Shopware
  • Centra
  • Geins
  • Saleor
  • WordPress
  • Optimizely CMS
  • Storyblok
  • Next.js
  • Vue
  • Astro
  • Matomo
  • Amplitude
  • RudderStack
  • Slack
  • WooCommerce
  • Salesforce
  • Wix
  • Litium
  • commercetools
  • Medusa
  • Drupal
  • Contentful
  • Webflow
  • Nuxt
  • Angular
  • Remix
  • Piwik PRO
  • Mixpanel
  • Tag Manager
  • Webhooks
  • Adobe Commerce
  • PrestaShop
  • Squarespace
  • Norce
  • Shopify Hydrogen
  • Vendure
  • Umbraco
  • Sanity
  • Framer
  • React
  • SvelteKit
  • GA4
  • Adobe Analytics
  • Segment
  • Klaviyo

Nie ma na liście? Jeśli to renderuje HTML, Pertento może to przetestować:przeczytajcie, jak łączy się każda z nich.

Lepsze testy, lepsze konwersje

Test on all visitors with the world’s lightest script and make confident decisions powered by real-time reporting.