Veidnes izvēle, kuru demo nenosaka: 6 soļu memorands

Kopsavilkums

Tavs priekšnieks tikko izvēlējās e-komercijas veidni pēc demo, un tu zini, ka tā nedos konversiju. Tā vietā, lai strīdētos par gaumi, vari izvērtēt kandidātu sešos soļos, kuru rezultātā tiek izveidots vienas lapas lēmuma memorands. Process sākas ar rakstisku darba aprakstu, pēc tam demo tiek pārbūvēts ar tavu saturu, tiek mērīts reālais ātrums un uzvedība mobilajās ierīcēs, novērtētas pielāgošanas izmaksas un izklāstīti kompromisi vienkāršā tabulā. Rezultāts ir dokuments, ko tavs netehniskais priekšnieks var apstiprināt, nesaprotot CSS. Tu pārtrauksi strīdēties par izskatu un sāksi salīdzināt pierādījumus. Šis raksts soli pa solim parāda katru soli ar konkrētiem mikro-piemēriem un brīdinājumiem, tostarp to, kāpēc bezmaksas tēmas reti ir bezmaksas un kāpēc demo ātrums ir mīts.

Tavam priekšniekam demo ir atvērts vienā cilnē, bet Slack — otrā. Tā ir sākumlapa ar pilna platuma hero video, preses logotipu joslu un atpakaļskaitīšanas līdz izpārdošanai joslu, kas rada steidzamības sajūtu. Viņi raksta: "Šī ir tā." Tu esi pavadījis trīs dienas, salīdzinot uz konversiju vērstus izkārtojumus, un grasies teikt: "Šis dizains patiesībā kaitē mobilajām konversijām," bet tu esi iemācījies, ka teikumi, kas sākas ar "patiesībā", nemaina cilvēku domas. To, kas maina domas, ir sistēma, kas parāda tavu darbu.

Lūk, sešu soļu metode, ko esmu izmantojis, lai veidnes izvēli pārvērstu no gaumes testa par lēmuma memorandu. Tā aizņem dažas stundas, un tās rezultātā rodas dokuments, ko netehniskais priekšnieks var apstiprināt bez sajūtas, ka viņš kapitulē.

1. Uzraksti darba aprakstu, pirms atver jebkuru demo.

Princips: tu nevari novērtēt veidni, kamēr nezini, kam tā tiek pieņemta darbā. Tava priekšnieka demo uzdevums ir izskatīties kā slavenam zīmolam. Tava tīmekļa vietnes uzdevums ir pēc iespējas ātrāk nogādāt atkārtotu pircēju no "man tas ir vajadzīgs" līdz "es to nopirku".

Tātad, pirms atver kaut vienu tēmu, uzraksti īsu rindkopu par sava veikala galveno scenāriju. Piemēram, veikalam, kas pārdod ādas izstrādājumus, tas varētu būt: "Telefonā klients, kurš zina, ko vēlas, bez ritināšanas var redzēt preces cenu un pogu "Pievienot grozam". Ceļam no šī brīža līdz norēķiniem vajadzētu aizņemt mazāk nekā minūti, un starp preces lapu un maksājuma ekrānu nedrīkst parādīties nekas." Tas ir pārbaudāms apgalvojums. Pēc tam uzskaiti trīs vai četras darbības, kas nodrošina lielāko daļu ieņēmumu — no meklēšanas līdz precei, no preces līdz norēķiniem un, iespējams, "iepirkties pēc kolekcijas" sezonas pircējiem.

Brīdinājums: neiekļauj darba aprakstā vizuālās izvēles. Krāsas, fonti un attēlu apgriešana ir maināmi — tu būtu pārsteigts, cik daudz CSS var pārdefinēt. Koncentrējies uz uzvedību un ierobežojumiem: ātrumu, redzamību mobilajās ierīcēs, navigācijas dziļumu un norēķinu soļiem. Kad tavs priekšnieks saka: "Man patīk lielais attēls," tu vari atbildēt: "Mēs varam paturēt lielo attēlu un joprojām izpildīt darba aprakstu — bet tikai tad, ja poga "Pievienot grozam" paliek pirmajā ekrānā." Tu nenoraidi viņa gaumi; tu to pārbaudi pret veikala reālajām vajadzībām.

2. Pārbūvē demo ar savu saturu.

Piegādātāju demo ir sagatavoti ar profesionālām preču fotogrāfijām, precīza platuma virsrakstiem un tēmas autora rakstītu tekstu. Taviem produktiem ir atšķirīgas attēlu proporcijas, tavi produktu nosaukumi ir teikumi, un tava "par mums" lapa ir trīs rindkopas par ilgtspēju. Demo to visu var noslēpt.

Tātad paņem veidni testa vidē un ievieto tajā savu reālo saturu — nevis parauga datus, bet īstu produktu ar tā īsto nosaukumu un rindkopu ar īstu aprakstu. Pēc tam pārbaudi trīs svarīgākos brīžus: preces lapu 375 pikseļu platā ekrānā, meklēšanas rezultātus ar garu kategorijas nosaukumu un norēķinus ar savu īsto maksājumu risinājumu. Piemēram, veikals, kas pārdod ar rokām darinātas keramikas krūzes, atklāj, ka demo produktu attēli ir uzņemti uz balta fona, bet viņu fotogrāfijās ir rosīgs darbnīcas fons — tēmas tumšais pārklājums liek krūzei pazust. Tā ir lieta, ko var pamanīt tikai ar savu saturu.

Tas ir veidnes demo auditēšanas pamatā — tā ir mārketinga, nevis tēmas pārbaude. Ja virsraksts sadalās trīs rindās un nospiež pogu "Pievienot grozam" uz leju, tā ir trauksmes signāls, lai cik labs demo izskatītos.

3. Izmēri to, ko demo nerāda.

Demo darbojas uz tēmas izstrādātāja optimizēta servera. Tava vietne darbosies uz tava hostinga, ar taviem spraudņiem, analītikas skriptiem un pamesto grozu lietotni. Tāpēc demo ielādes ātrums būtībā ir mīts.

Izveido testa vietni ar savu faktisko sortimentu un veic divus testus: vispirms ātrā galddatora savienojumā, pēc tam īstā telefonā 4G tīklā ar iztīrītu kešatmiņu. Skaties uz laiku, līdz lapa ir lietojama, nevis tikai uz to, kad tā šķiet ielādēta. Daudzas tēmas virsrakstu attēlo uzreiz, bet pēc tam uz divām sekundēm bloķē izkārtojumu, kamēr tiek ielādēts slīdņa skripts — īsta problēma telefonos. Turklāt iziet norēķinu procesu telefonā. Dažas pulētas tēmas galddatorā izskatās labi, bet mobilajā versijā pārvērš norēķinu procesu par piecu ekrānu slīdšovu, pieprasot atlaižu kodu pirms adreses un rādot piegādes aptuveno izmaksu pēc maksājuma pogas. Šeit noder mobilās pirmajā vietā kontrollapa — tā liek pārbaudīt īkšķa sasniedzamību, pieskārienu mērķus un to, vai poga "Turpināt" ir virs locījuma līnijas.

Iespējams, tev būs kārdinājums uzticēties tēmas ātruma pārskatam. Neuzticies. Tēmas demo lapa tiek servēta no CDN ar kešošanu, un tēmas ātruma emblēma parasti ir ekrānuzņēmums, kas uzņemts ideālos apstākļos. Tava vide ir atšķirīga, un tas ir normāli — tests ir par tavu vidi.

4. Novērtē pielāgošanas izmaksas — un esi godīgs par "bezmaksas".

Lūk, pieņēmums, kuram jāiebilst: bezmaksas tēmas ir lētākas. Tās reti ir bezmaksas, jo maksā ar izstrādātāja laiku. Bezmaksas tēmai var būt ierobežots opciju panelis, un katra zīmola pielāgošana — galvenes pielāgošana, hero nomaiņa, nozīmītes pievienošana — prasa CSS pārrakstīšanu vai bērnu tēmu, kas nozīmē stundu izstrādātāja apmaksāta laika par katru. Maksas tēma ar labu opciju paneli var atmaksāties ar pirmo reizi, kad izvairies no viena pielāgota koda pieprasījuma.

Bet ir arī pretēji: maksas tēma ar iebūvētu lapu būvētāju var būt lēnāka un grūtāk uzturēt nekā vienkārša bezmaksas tēma. Īstās izmaksas nav licences cena; tā ir starpība starp "to, ko dara demo" un "to, kas vajadzīgs tavam zīmolam". Saskaiti izmaiņas, ko reāli veiktu: logotips, galvenes izkārtojums, tipogrāfija, produktu režģis, kājene un uzticības nozīmītes. Ja tēmas opciju panelis nodrošina piecus no astoņiem, esi vadībā. Ja tikai divus, tu pērc projektu, nevis tēmu. Tā ir daļa no nepareizas veidnes izvēles slēptajām izmaksām — cenas zīme ir tikai sākums.

5. Izklāsti kompromisus tā, lai priekšnieks tos var redzēt.

Tabula ir simts sarunu vērtībā, jo tā pārvērš sarunu no "man patīk šī" uz "lūk, ko šī izvēle maksā". Izdrukā šo (vai iekopē Slack), kad salīdzini divus finālistus:

Ko rāda demo	Kas jāpārbauda
Hero video atskaņojas uzreiz	Vai tas ieslēdzas automātiski mobilajos datos, vai arī pārvēršas par sasalušu attēlu ar pogu, kuru neviens nespiež?
Produktu attēli izskatās augstvērtīgi	Vai tavi produktu attēli iekļaujas apgriezumā, nezaudējot produktu no kadra?
Navigācija ir vienmērīga	Īstā telefonā vai izvēlne ir sasniedzama ar vienu īkšķi, vai arī tas prasa izstiepties ar abām rokām?
Lapa ielādējas ātri	Veic ātruma testu savā hostingā, nevis piegādātāja serverī.
Norēķini ir skaisti	Veic reālu testa pasūtījumu. Ievēro, cik pieskārienu un cik daudz ritināšanas nepieciešams.

Tavs priekšnieks redzēs, ka daži demo pārvērš sajūtas, nevis pārdošanu. Tabula pārvērš šīs sajūtas izvēles rūtiņās.

6. Uzraksti vienas lapas lēmuma memorandu, kas izbeidz diskusiju.

Pēdējais solis pārvērš auditu lēmumā. Saglabā to vienā lapā, vienkāršā valodā. Sāc ar ieteikumu, pēc tam parādi trīs pierādījumus: mobilās ierīces testu, ātruma testu un pielāgošanas izmaksu aplēsi. Pēc tam norādi kompromisu, ko pieņem — piemēram, "mēs zaudējam animēto groza ikonu, bet iegūstam īsāku norēķinu procesu telefonos." Nobeidz ar nākamajiem soļiem: ko tu pielāgosi pēc palaišanas un kā to mērīsi.

Memorands ir pārdošanas dokuments — tu pārdod savam priekšniekam lēmumu, ko viņš var aizstāvēt sava vadītāja priekšā. Formulē katru punktu biznesa izteiksmē. Tā vietā, lai teiktu "poga "Pievienot grozam" iPhone SE ir zem locījuma līnijas", raksti "visizplatītākajā telefona izmērā klientiem, lai pievienotu produktu, būtu jāritina, kas palielina iespēju, ka viņi aizies". Tā vietā, lai "tēma izmanto daudz JavaScript", raksti "lapa 4G tīklā ielādējas ilgāk, un lēnas lapas tiek saistītas ar zemāku konversiju". Neizlaid "nākamo soļu" sadaļu; tā apliecina priekšniekam, ka neapstiprini kaut ko pastāvīgu — tu sāc procesu, kas ietver pielāgošanu pēc palaišanas.

Ja vēlies dziļāk izprast, kā saskaņot veidnes funkciju kopumu ar konversijas mērķiem, šis ceļvedis, kā izvēlēties veidni, kas konvertē, sniedz detalizētu funkciju izklāstu.

Galvenais ir sistēma, nevis spriedums.

Demo vienmēr parādīsies — jauna tendence, košāka animācija, priekšnieka otrā brālēna vietne. Tā vietā, lai katru reizi strīdētos, izvērtē kandidātu ar tiem pašiem sešiem soļiem. Demo var uzvarēt mirklī, bet memorands uzvar sanāksmē. Un nākamreiz, kad būs nepieciešams lēmums, tev būs process, kuram nav nozīmes, cik labi stāsts izklausās.