Jak zrobić testy A/B

Czy zdarzyło Ci się kiedyś brać udział w spotkaniu, na którym w gorącej dyskusji próbowaliście ustalić czy należy umieścić ładny obrazek na stronie głównej. Ja pamiętam takie spotkania. Grafik upiera się, że obrazek jest konieczny bo ludzie wolą estetyczne strony. Inna osoba twierdzi, że nie bo nie jest związany merytorycznie ze stroną. A szef firmy chce by na stronie produktu umieścić informację o firmie.
Spotkanie kończy się 2 godziny później bez podjęcia decyzji. No może oprócz uwzględniania uwag szefa :-)
Czy można inaczej?
Oczywiście, że tak. Służą do tego testy A/B. Testy te pozwalają sprawdzić skuteczność 2 różnych wersji strony.


Aby przygotować taki test należy:

1. Zdecydować się na miarę, którą będziemy oceniać strony (np. bounce rate)
2. Przygotować 2 wersje strony (np. z obrazkiem i bez obrazka)
3. Podzielić osoby wchodzące na 2 grupy. grupę A i grupę B
4. Przygotować raportowania wyniku testu w google analytics
5. Podsumować wyniki

Wybieramy miarę


Celem testów jest zdobycie wiedzy o naszym użytkowniku. Aby to zrobić powinniśmy wykonać następujące kroki:

1. Postawić tezę (użytkownicy wolą stronę z ładnymi obrazkami)
2. Ustalić miarę sukcesu (bounce rate spadnie o 5%)
3. Ustalić akcję do podjęcia (Dołożymy obrazek na stronę)
4. Przeprowadzić test

Jeżeli to jest Twój pierwszy test to sugeruję zacząć od testów strony głównej i wybranie jako miary bounce rate. Dla przypomnienia; bounce rate określa ile osób wyszło z serwisu po obejrzeniu tylko jednej strony. Jest to dla nas niekorzystna sytuacja. Czyli im większy bounce rate tym gorszy wynik strony.


Przygotowujemy 2 wersje strony

Jeżeli w aplikacji webowej korzystacie z szablonów, to można przygotować różne wersje strony jako różne szablony. W django może to wyglądać w następujący sposób:

    cohort = getCohort(request)
    templateName = 'home/index' + cohort + '.html'
    response = render(request, templateName)
    _setCookie(response, 'cohort', cohort)
    return response

Funkcja getCohort() zwraca wartość 'A' lub 'B'.
W katalogu z szablonami mamy natomiast 2 wersje strony indexA.html oraz indexB.html.



Dzielimy osoby wchodzące na 2 grupy A i B

Grupy mogą mieć różną liczebność. Na początek jednak najlepiej jest podzielić ruch wejściowy po równo na obie grupy:

def getCohort(request):
    if request.COOKIES.has_key( 'cohort' ):
        cohort = request.COOKIES[ 'cohort' ]
    else:
        if random.random() >= 0.5: 
            cohort = 'A'
        else: 
            cohort = 'B'

    return cohort

Informację o przydziale do grupy zapisana jest w cookie. Robimy to ponieważ chcemy uniknąć sytuacji w której osoba wracająca na nasza stroną dostanie się do innej grupy.


Przygotowanie raportowania wyniku testu

Wyniki testu będziemy obserwować w GA (Google Analytics). Aby można było tam zaobserwować ruch z podziałem na grupy musimy w naszych szablonach ustawić zmienną, która zostanie przekazana do GA.
W tym celu w szablonie szukamy kodu GA:

    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-22106147-2']);

I dopisujemy do niego zmienną. Dla strony A:

    _gaq.push(['_setCustomVar', 1, 'Cohort', 'A', 1]);

oraz dla strony B

    _gaq.push(['_setCustomVar', 1, 'Cohort', 'B', 1]);

W efekcie powinnyśmy w szablonie A mieć:

    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-22106147-2']);
    _gaq.push(['_setCustomVar', 1, 'Cohort', 'A', 1]);
    _gaq.push(['_trackPageview']);

Jeżeli wszystko zrobiliśmy poprawnie to możemy w GA przygotować odpowiedni dashboard. Przykład takiego dashboard-u przedstawiam poniżej:

Wraz z przykładem konfiguracji środkowego widgetu z bounce rate:

Podsumowanie wyników

Aby można było podsumować wyniki potrzebujemy co najmniej 100 wejść w ramach każdej z grup (czyli razem 200). Im więcej tym bardziej wartościowe wyniki.

Na podstawie wyników podejmujemy ustalone wcześniej działania i zaczynamy kolejny test.

Uwaga to wciąga!
Jak raz się zacznie testować strony to później chce się robić to coraz częściej :-)


Informacje dodatkowe

Dobór miary i odpowiedniej hipotezy to całkiem złożony temat. Trochę można znaleźć w artykule:

• http://www.symetryczna.pl/usability/testy-ab-co-zrobic-aby-byly-skuteczne 

 Jednak bardziej zainteresowani będę musieli sięgnąć do literatury angielskojęzycznej.


W przypadku pierwszego testu warto przygotować strony A i B jako identyczne. Ma to na celu sprawdzenie czy sposób wykonania testu jest poprawny. Wyniki które osiągniemy w ramach poszczególnych grup powinny być prawie takie same. Jeżeli nie są to znaczy, że testy są źle zaprojektowane.

Jeżeli chcesz zobaczyć jak się te testy skończyły to opisałem to w artykule Podsumowanie testów


I na koniec jak zwykle zachęcam do podzielenia się uwagami.  Jeżeli nie wszystko jest jasno opisane lub masz specyficzne pytania, to napisz komentarz do posta. Postaram się pomóc.

Miłej zabawy z testami!