Am relansat recent landing page-ul pentru un produs B2B de gestiune a comenzilor la care lucrez de aproape un an. Înainte ne chinuiam undeva pe la 0.6% rată de conversie la conturi de test, iar după modificări am atins constant 2.3% pe un eșantion de 14.200 de vizitatori unici veniți din Google Ads și organic. Nu e o cifră cosmică de Silicon Valley, dar pentru un produs de nișă unde un abonament lunar e 180 de euro, diferența asta a însemnat că proiectul a devenit profitabil.
Partea amuzantă e că n-a contat niciuna dintre ideile mele inițiale de frontend dev entuziasmat. Am tăiat tocmai lucrurile cu care voiam să mă laud pe Twitter.
1. Am aruncat scroll-ul interactiv și Lottie-urile
Prima versiune arăta ca scoasă din Dribbble. Aveam elemente care apăreau la scroll cu fade-in, ilustrații animate SVG și o mică simulare interactivă cu GSAP. Pe MacBook-ul meu de dev rula uns, la 60 fps.
Problema? Pe un telefon midrange conectat la 4G pe șantier sau într-un depozit, pagina gâfâia. Total Blocking Time-ul sărea de 800ms. Oamenii dădeau scroll nervoși, trigger-ul de animație întârzia, iar butonul de CTA apărea după ce omul deja își pierduse răbdarea. Am rescris pagina în HTML și Tailwind chior, fără pic de JavaScript de animație. LCP-ul a scăzut de la 3.4 secunde la 0.9 secunde. Doar din viteza brută am văzut primul salt la 1.1% conversie în primele două săptămâni.
Trade-off sincer: pagina arată mult mai banal acum. Pentru un designer purist, e plictisitoare. Dar utilizatorul din publicul țintă n-a venit să admire tranzițiile mele bezier, ci vrea să știe dacă softul îi rezolvă problema cu facturile.
2. Capturi reale de ecran în loc de grafice abstracte
A doua schimbare majoră a fost să elimin complet ilustrațiile acelea corporatiste cu oameni fără fețe și grafice vectoriale colorate pastelat. Toată lumea le folosește, nimeni nu le crede.
Am pus în loc screenshot-uri 1:1 din aplicație, needitate artistic, doar cu date fictive dar perfect plauzibile (nume de produse românești, prețuri în lei, tabele dense). Lângă fiecare captură am adăugat un rând simplu de text: ce face ecranul ăsta și câte minute economisești pe zi folosindu-l. În testul A/B pe care l-am rulat timp de trei săptămâni, varianta cu UI real a adus cu 40% mai multe click-uri pe butonul de start trial decât varianta cu ilustrații vectoriale.
3. Buton unic, fără opțiuni alternative
Înainte aveam o criză de personalitate pe prima pagină. Aveam „Începe gratuit”, „Programează un demo”, „Vezi documentația” și „Află mai multe”. Vizitatorul trebuia să ia o decizie complexă din primele trei secunde. Am păstrat un singur CTA vizibil deasupra fold-ului: „Creează cont de test (14 zile gratuit)”. Sub el, cu font mic: „Fără card bancar. Durează sub un minut”. Am tăiat orice altă cale de ieșire din primul ecran.
Strategia asta merge excelent pentru un produs self-serve unde onboarding-ul e rapid. Dacă vindeam un enterprise de 50.000€ pe an unde e nevoie obligatoriu de un apel de vânzări, abordarea asta ar fi eșuat lamentabil. Contextul contează mereu.
Voi când ați testat ultima oară o pagină intenționat mai simplă și mai „urâtă”, dar brutal de clară?