Od kolekcije primera do sistema: Veb primeri koji se skaliraju

Rezime

Onog trenutka kada ste odgovorni za više od jednog klijenta, način na koji koristite primere veb sajtova mora da se promeni. Fascikla sa sačuvanim snimcima ekrana radi za prvu prezentaciju, a propada do treće, jer stvarna vrednost nikada nije bila slika—već obrazac koji možete preneti iz jedne industrije u drugu. Ovaj članak vas vodi kroz tri faze izgradnje prakse sa primerima: prevođenje primera pre nego što ih pokažete, njihovo sistematizovanje u biblioteku obrazaca bez identifikacije klijenata i pretvaranje u povratnu spregu koja se poboljšava sa svakim lansiranjem. Usput, zalaže se protiv lenje verzije pravila o jednom pozivu na akciju (CTA), koje se raspada na sajtovima agencija koje služe više različitih publika. Cilj je proces koji preživljava promene u timu i zahteva manje od vašeg ukusa, a ne više.

Negde u vašim obeleživačima postoji fascikla pod nazivom "inspo" i ima previše kartica. Skupljate primere veb sajtova za svaki početak rada sa klijentom, raspoređujete najbolje na tabli i onda tokom sastanka prevodite: "Ne, ne izgled. Način na koji objašnjavaju šta rade." Taj prevod je stvarna veština, ali je zaglavljena u vašoj glavi. Onog dana kada vam agencija dodeli drugi nalog, pa zatim treći, trik prestaje biti "znati najbolje primere" i postaje "učini ovo ponovljivim." Ako ste gledali junior dizajnera kako pravi gotovo istu sekciju za dva nepovezana klijenta jer im je to bio jedini primer koji ste im pokazali, znate problem. Ovo je vodič za to kako da vaša praksa sa primerima odraste zajedno sa vašom agencijom—od prve pobede do skaliranja—a da to ne postane religija.

Prvi klijent: prevedite pre nego što pokažete

Izaberite tri primera za svakog klijenta i pre nego što pokažete bilo koji od njih, napišite po jednu rečenicu za svaki: koji obrazac ovaj primer doprinosi i šta klijent treba da zanemari? Rani instinkt je gomilati; najjeftinije rešenje je selekcija. Dobro odabrana početna stranica Kalendija doprinosi obrazac imenovanja ishoda u naslovu—"zakažite sastanke bez razmene imejlova"—dok klijentu govori da zanemari umirujuću belu pozadinu. Linearov hero sekcija uči drugu lekciju: svaki element iznad pregiba ima svoju ulogu, tako da primer ostaje koristan čak i kada vaš klijent prodaje nešto što nema veze sa softverom. Zapišite ta dva prevoda pre sastanka. Ako ne možete da napišete drugu rečenicu, primer je dekoracija, a ne dokaz. Ovo je potez ukradi njihov kostur, ali postaje timska veština tek kada je zapisan.

Recimo da je brief regionalna logistička kompanija čiji su kupci menadžeri skladišta. Vaš prvi instinkt je da izvučete tri sajta iz logističke industrije; umesto toga, uzmite Kalendij za naslov koji prvo daje ishod, Notion za stranicu koja se opredeljuje za jednu akciju (njegov CTA "Besplatno preuzmite Notion"), i neku ružnu, ali informativnu stranicu za praćenje pošiljki iz bilo koje industrije. Na sastanku recite: "Kalendij nije logistička kompanija. Deo koji pozajmljujemo je to da naslov uklanja prepreku pre nego što korisnik pročita funkciju. Notionova vrednost je uzdržanost: jedna jasna akcija." Videćete kako klijent prestaje da traži paralaks efekte i počinje da raspravlja o naslovu. To je cela poenta—primeri su funkcionisali kao alati za razmišljanje, a ne kao šabloni.

Peti klijent: sistematizujte blokove koji se ponavljaju

Pokrenite biblioteku obrazaca bez identifikacije klijenata nakon što objavite nekoliko sajtova. Ne još jednu fasciklu sa snimcima ekrana—već dokument o blokovima koji se ponavljaju, sa imenima na običnom jeziku: "naslov sa ishodom," "hero sa jednim zadatkom," "sendvič dokaza," "stranica poverenja." Poenta je da se uhvati princip, a ukloni brendiranje, kako bi tim mogao da ga ponovo koristi, a da ne reprodukuje izgled drugog klijenta. Razlog zašto se isti SaaS primeri stalno hvale nije vizuelna privlačnost, već struktura: jasna ponuda vrednosti na vrhu, fokusirana sekcija iznad pregiba, jedna primarna akcija. Biblioteka obrazaca hvata tu strukturu jednom i omogućava joj da preživi sledeći redizajn. Kada novi nalog stigne, pretražujete biblioteku pre interneta. To menja razgovor o budžetu, jer više ne kupujete inspiraciju; primenjujete proverene odluke.

Faza	Zadrži	Odbaci
Prvi projekti	3 radna primera + objašnjenja zašto	ogromna datoteka sa primerima
Nekoliko lansiranja	biblioteka obrazaca bez identifikacije	primeri koji zahtevaju dugačko opravdanje
Pri skaliranju	živa biblioteka sa povratnom spregom	neversionirani snimci ekrana od pre tri godine

Radite na primeru butične računovodstvene firme: umesto da dizajneru date "evo pet računovodstvenih sajtova," dajete mu karticu iz biblioteke "obrazac stranice poverenja: ko smo mi, šta klijent izbegava ako nas angažuje, dokaz stručnosti, jedan sledeći korak." Dizajn i dalje treba ljudsko oko, ali odluke su već donete. Takođe izbegavate sivi, jednolični izgled koji svaka računovodstvena firma kopira, jer vaš obrazac ništa ne govori o boji. Najbolji izvori ionako retko dolaze iz iste industrije; namerno pozajmite primere veb sajtova iz drugih industrija i koristite biblioteku obrazaca da zadržite ono što se prenosi.

Dvadeseti klijent: uspostavite povratnu spregu u biblioteci

Sprovedite kratku reviziju nakon svakog lansiranja i vratite rezultate u biblioteku. Većina timova stane na "ko god je slobodan, ažurira prošlogodišnji šablon dok se neko ne požali." Potez za skaliranje je da svaki objavljeni sajt tretirate kao test vaših obrazaca. Revizija ne zahteva otmene alate: na dan lansiranja, pogledajte sekcije očima nepoznatog kupca; nedelju dana kasnije, pitajte one koji se javljaju na telefon koja pitanja posetioci i dalje postavljaju; mesec dana kasnije, proverite na koje CTA se stvarno klikće. Otkrićete da neki omiljeni obrasci nikada ne zasluže svoje mesto—izbacite ih. Ovo je navika da sprovedete reviziju kao kupac kome nije stalo do vas, ali primenjena na samu kolekciju: revidirate svoje primere, a ne samo klijentovu stranicu.

Uzmite klijenta iz oblasti profesionalnih usluga čiji je stari sajt sakrio akciju "radite sa nama" iza stranice O nama. Kartica "hero sa jednim zadatkom" u biblioteci obrazaca govori sledećem dizajneru da stavi akciju iznad pregiba. Nakon lansiranja, primećujete da publika za regrutaciju i dalje napušta stranicu. To nije neuspeh obrasca; to je dokaz da ova stranica služi dvema publikama i da biblioteci treba varijanta za "više publika." Dodajte belešku, označite staru karticu kao "za stranice sa jednom publikom," i sledeći sličan klijent neće ponoviti grešku.

Kontrarno poglavlje: ne shvatajte zapovest o jednom CTA doslovno

Sada reakcija. Mnogi tekstovi o SaaS primerima govore da svaka stranica treba da ima jedan poziv na akciju, a Notionov jedini "Besplatno preuzmite Notion" se navodi kao dokaz. Taj savet je tačan za stranice proizvoda čiji je ceo posao jedna prijava; postaje netačan čim radite za klijenta sa više publika. Tretiranje "jednog CTA" kao zakona dovodi do sajtova agencija gde se stranica za regrutaciju, kontakt za medije i formular za konsultacije takmiče za jedno dugme. Odbranjiva verzija pravila je "jedan primarni cilj po publici po stranici," a ne "jedno dugme, ikada." Isti primer koji svaku sekciju usmerava na jednu akciju može se čitati kao stranica koja traži od posetioca da uradi tačno jednu stvar—to je princip koji vredi ukrasti. Univerzitet ili konsultantska kuća treba da imaju primarnu akciju za potencijalne klijente i drugu za osoblje; nametanje jednog CTA krije oba. Zadržite princip, preskočite snimak ekrana.

Manje vremena na sakupljanje, više na odlučivanje

Ništa od ovoga ne zahteva veću datoteku sa primerima. Zahteva brisanje većine onoga što ste sačuvali i zapisivanje zašto ono što preživi ima značaj. Faze su jednostavne: prevedite pre nego što pokažete; sistematizujte ono što i dalje radi; revidirajte ono što ste objavili; ignorišite zapovesti koje ne odgovaraju klijentu. Praksa sa primerima u agenciji treba da sazreva na isti način kao i njeni projekti—od ručno rađenog do ponovljivog i samopoboljšavajućeg. Fascikla je i dalje tu. Samo je sada mnogo manja.