ILINČEV 
Před rokem mě oslovili z penize.cz, zda bych jim nepomohl zlepšit hypoteční kalkulačku. Začali jsme klasicky UX analýzou, bez které už téměř nikdy nezačínám projekt.
Původní stav
Tohle byla úvodní stránka kalkulačky:
Hlavní zjištění:
- Chybí social proof.
- Lidem není jasné, která dlaždice je zaškrtnutá (typ hypotéky).
- Hodně lidí kliká na lištu s LTV, která není klikací.
- Není jasné, jaká fixace má nejlepší úrok, lidi tak skáčou od výsledků zpět do kalkulačky a upravují parametry (tzv. poggo-sticking).
- Po kliknutí na tlačítko se ukazuje na 5-10 sekund animované kolečko, než se ukáží výsledky.
Více o optimalizaci nahrávání. - Je špatně nastavená analytika a nesledují se správně všechny cíle (kliknutí na tlačítko, vyplnění formulářů, odkrytí výsledků).
Po kliknutí na tlačítko Porovnat nabídky na ukáže stránka s kontaktními údaji a skrytými výsledky (omluvte zhoršenou kvalitu, lepší nemám).
Hlavní zjištění:
- Neukazujeme přesná čísla, ale pořadí ji i tak užitečné. Zde se klasicky pere cíl uživatele a cíl zadavatele. Uživatel by chtěl vidět výsledky, zadavatel potřebuje kvůli byznys modelu kontakt.
- Polovina lidí odchází bez vyplnění kontaktních údajů, ptáme se na 4 údaje (psč v předchozím kroku, celé jméno, e-mail a telefon), ale stačí nám jen telefon.
- Cca třetina lidí kliká na textový odkaz pro úpravu parametrů (i ve chvíli, kdy nevidí přesné výsledky). Hypotéza je taková, že jim stačí vidět pořadí bank, nebo chtějí změnit parametry.
- Textace v popupu je poněkud nešikovná: Kontaktovat vás můžeme proto, abychom vám poradili, co je pro vás nejlepší.
Když to shrnu, tak největší zjištěné problémy byly:
- Ptáme se na 4 údaje, ale stačí nám jen jeden – telefon. Mimochodem byl docela boj přesvědčit klienta, abychom se ptali jen na telefon. I přes to, že zmenšení počtu formulářových polí je nejjistější způsob zlepšení konverze (průměrné zlepšení 7,6 % na základě 10 předchozích AB testů).
- Dlouhá doba před ukázáním výsledků – 5-10 sekund je hodně. Navrhoval jsem posílat průběžně data z vyplňovaného formuláře a počítání na pozadí, ale bylo to technicky náročné. Tak jsem navrhl ukazovat, které nabídky bank právě kontrolujeme a počítáme. Protože se ukázalo, že lidi preferují si počkat, pokud za vás někdo pracuje spíš, než když se neukazuje nic.
- Úprava parametrů a nahrávání výsledků je nešikovné. Nutíme lidi, aby skákali mezi výsledky a zadáním a pokaždé čekali 5-10 sekund.
- Máme špatně nastavenou analytiku. Takže nemůžeme věřit číslům nebo nám část dat chybí.
- U popupu s kontakty neřešíme obavy, že vás budeme opakovaně obtěžovat a volat vám.
- První dojem je relativně špatný, důvěryhodnost vyšla 2,8 (známkováno jako ve škole).
Navrhovaná řešení – wireframy
S ohledem na to, že ještě pořád nemám křišťálovou kouli, tak často navrhuji více variant. A pak zjišťujeme, která je z nich nejlepší. Ať už AB testem, preferenčním testem nebo jinou metodou.
Upravená původní verze s kontakty
Tahle varianta byla spíš kosmetickou úpravou stávajícího stavu. Přidal jsem social proof nahoře, a kontaktní formulář dal – po vzoru konkurence – nad tlačítko.
Kompaktní kalkulačka jen s telefonem
U této varianty jsme udělali vyplňování údajů kompaktnější, abychom měli CTA tlačítko na první obrazovce.
Kompaktní kalkulačka a popup s kontakty
Kompaktní verze kalkulačky s kontakty v popupu, nakonec jen s telefonem.
Výsledky vyhledávání hypotéky na stejné stránce
Výhodou tohoto řešení je to, že při změně parametrů se vám automaticky přepočítají výsledky. Nemusíte tak skákat tam a zpátky.
Grafika
Zatímco nám Adam Jurák pomáhal s opravou Google Analytics, tak jsme se pustili do grafiky.
Kontrola, AA test a SMS ověření
Klient grafiku naprogramoval, já si následně pomocí AA testu ověřil správnou implementaci, statistickou odchylku a další věci. Zjistil jsem ale, že z nějakého důvodů hapruje tzv. hiding snippet – část kódu, která schovává původní variantu do doby, než se nahraje nová. Občas se stalo, že se nenahrála žádná varianta a já tak čuměl na bílou stránku. Velký špatný.
Takže jsme to schovávání vyhodili. Říkal jsem si, to je drobnost, uživatel prostě na sekundu dvě uvidí starou variantu a pak se mu nahraje nová. No big deal.
Mezitím nám do toho klient hodil trochu vidle, protože tam přidal SMS autorizaci mobilu. Nicméně to přidal do obou variant, takže statisticky to bylo vlastně v pořádku.
Výsledky testování
A pak jsme spustili AB test. A varianta byla původní, B námi navržená nová. Byl jsem si hodně jistý, že to máme v kapse. Udělali jsme všechno správně a web zlepšili.
A… šul nul. Test nedospěl do statistické jistoty.
Testování mě naučilo pokory, ale tady jsem opravdu věřil, že to zlepšíme. Takže byl čas na to zkontrolovat, zda jsme neudělali někde chybu. Zkontroloval jsem:
- Implementaci Google Analytics.
- Implementaci Google Optimize.
- Nastavení cílů a měření v interním nástroji klienta.
- Heatmapy a funnely jednotlivých variant v Hotjaru.
- Výsledky uživatelského výzkumu.
A nic. Všechno vypadalo v pořádku. „No tak to mi nalaď mokrý dudy,“ říkal jsem si. A pak mi vylučovacím způsobem došlo, že jediný rozdíl je v tom, že nemáme implementovaný ten hiding snippet, nad kterým jsem mával rukou.
Takže jsme prohodili varianty. A teď byla nová verze, B stará. A spustili jsme test znova. Bylo důležité dodržet co nejvíce stejný počet návštěv jednotlivých variant, jako jsme měli v předchozím testu, abychom pak neporovnávali jablka a hrušky.
A výsledek druhého AB testu s prohozenými variantami?
Poměrně výrazně z toho vyplývá, že nová verze stránky je lepší. Teď už šlo jen o to oba testy z pohledu statistiky vyhodnotit tak, jako by to byl jeden test. Ano – není to úplně košer – ale je to to nejlepší z toho, co jsme měli k dispozici.
Se statistickou jistotou 99 % jsem tak schopen říct, že nová varianta je lepší než stará. A to o průměrně 23,5 %.
Ohlas zákazníka
Projektová manažerka Bára Dugová k tomu říká:
Jsme moc rádi, že jsme Ondru na pomoc s UX oslovili. Hned od začátku jednal jako profík a svou původní vášeň pro architekturu nezapře. Pod jeho vedením jsem se naučila spoustu věcí, třeba kreslit wireframy nebo vyslýchat cizí lidi na testování. A měl se mnou svatou trpělivost :-) Ale vážně, Ondra je profesionál, který nám pomohl zlepšit konverzní poměr tam, kde jsme v to už ani doufali. Jeho úspěšný návrh jsme ihned aplikovali na další formuláře a cenu za konverzi jsme díky tomu dotlačili téměř na polovinu původní částky. Děkujeme za špičkovou spolupráci, Ondru rozhodně doporučujeme.
A Martin Vlnas, ředitel penize.cz doplňuje:
Ondra splnil, co slíbil, jen to trvalo déle. Část viny za prodlevy neseme my, část Ondra. Zázraky se ale taky nedělají na počkání :).
Po roce přišla ještě jedna pochvala:
Téměř po roce redesignu děláme vyhodnocení a musíme uznat, že všechny kroky, které jsme podnikli, byly správné. Aktuálně nás předaný lead stojí do 500 Kč na všech kanálech, což je takový malý zázrak. Pro srovnání: před redesignem to bylo nad 1000 Kč a někdy i mnohem více . Tak ještě jednou moc děkujeme za pomoc.
Závěr
Sherlock Holmes v knize Berylová korunka praví: „Vyloučíme-li vše, co nepřichází v úvahu, zůstane potom pravda, i když vypadá jakkoli nepravděpodobně.“
Závěr pro geeky
Pro kolegy, co se též rochní v AB testech bych tedy doporučil neignorovat problikávání původního obsahu stránky (FOOC – flash of original content), a důsledně aplikovat hiding snippet (v Google Optimize) nebo obdobnou technologii v ostatních nástrojích. Protože první dojem si děláte během 0,05 sekundy, ale původní obsah vidíte cca 1-2 sekundy (Google Optimize má defaultně nastaveny 4 sekundy. A čtyřsekundové zpomalení stránek znamená průměrně 4-8 % konverze dolů!).
Smysluplná debata