Demokestävä mallipäätös: 6-vaiheinen muistio

Yhteenveto

Pomosi valitsi juuri e-commerce-mallin demosta, ja tiedät, ettei se tule konvertoimaan. Sen sijaan, että kiistelet mausta, voit viedä ehdokkaan kuusivaiheisen arvioinnin läpi, joka päättyy yhden sivun päätösmuistioon. Prosessi alkaa kirjallisesta työnkuvauksesta, sitten demo rakennetaan uudelleen omalla sisällölläsi, mitataan todellinen nopeus ja mobiilikäyttäytyminen, pisteytetään räätälöinnin kustannukset ja esitetään kompromissit selkokielisessä taulukossa. Tuloksena on asiakirja, jonka ei-teknisesti suuntautunut pomosi voi allekirjoittaa ymmärtämättä CSS:ää. Lopetat ulkonäöstä kinastelun ja alat vertailla todisteita. Tämä artikkeli käy läpi jokaisen vaiheen konkreettisten mikroesimerkkien ja varoitusten kanssa, mukaan lukien sen, miksi ilmaiset teemat ovat harvoin ilmaisia ja miksi demon nopeus on fiktiota.

Pomollasi on demo auki yhdessä välilehdessä ja Slack toisessa. Etusivulla on koko leveyden hero-video, lehdistölogojen marquee ja alennuslaskuri, joka tuntuu kiireelliseltä. ”Tämä on se”, he kirjoittavat. Olet käyttänyt kolme päivää konversioon keskittyvien asetteluiden vertailuun, ja olet sanomassa: ”Tuo muotoilu itse asiassa heikentää mobiilikonversioita”, mutta olet oppinut, että ”itse asiassa” -alkuiset lauseet eivät muuta mieliä. Mielen muuttaa viitekehys, joka näyttää työsi.

Tässä on kuusivaiheinen menetelmä, jota olen käyttänyt muuttaakseni mallipäätöksen makutestistä päätösmuistioksi. Se vie muutaman tunnin ja tuottaa artefaktin, jonka ei-tekninen pomo voi allekirjoittaa tuntematta, että hän antaisi periksi.

1. Kirjoita työnkuvaus ennen kuin avaat minkään demon.

Periaate: et voi arvioida mallia, ellet tiedä, mihin työhön se palkataan. Pomosi demolla on tehtävä: näyttää kuuluisalta brändiltä. Verkkosivustollasi on tehtävä: viedä palaava asiakas mahdollisimman nopeasti tilasta ”Tarvitsen tämän” tilaan ”Ostin sen”.

Joten ennen kuin avaat yhdenkään teeman, kirjoita lyhyt kappale kauppasi ydinskenaariosta. Nahkatavaroita myyvälle putiikille se voisi olla: ”Puhelimessa asiakkaan, joka tietää mitä haluaa, pitäisi nähdä tuotteen hinta ja ostopainike ilman vierittämistä. Polku siitä hetkestä kassalle saakka saa kestää alle minuutin, eikä tuotesivun ja maksunäytön välissä saa ponnistaa mitään.” Se on testattava väite. Listaa sitten kolme tai neljä toimintoa, jotka tuovat suurimman osan liikevaihdostasi — hausta tuotteeseen, tuotteesta kassalle ja ehkä ”ostoksille kokoelman mukaan” kausiostajille.

Varoitus: älä laita visuaalisia mieltymyksiä työnkuvaukseen. Värit, fontit ja kuvien rajaukset ovat muutettavissa — yllätyt, kuinka paljon CSS:llä voi ohittaa. Pidä se käyttäytymisessä ja rajoitteissa: nopeus, mobiilinäkyvyys, navigoinnin syvyys ja kassavaiheet. Kun pomosi sanoo ”Pidän isosta kuvasta”, voit vastata: ”Voimme pitää ison kuvan ja täyttää silti työnkuvauksen — mutta vain jos ostopainike pysyy ensimmäisellä näytöllä.” Et hylkää hänen makuansa; testaat sitä kaupan todellisia tarpeita vastaan.

2. Rakenna demo uudelleen omalla sisällölläsi.

Toimittajien demot on lavastettu ammattimaisella tuotekuvauksella, tarkalleen oikean levyisillä otsikoilla ja teeman kirjoittajan kirjoittamalla sisällöllä. Tuotteillasi on erilaiset kuvasuhteet, tuotenimesi ovat lauseita, ja ”meistä”-sivusi on kolme kappaletta kestävyydestä. Demo voi piilottaa kaiken tämän.

Ota siis malli staging-ympäristöön ja vaihda sisään oikea sisältösi — ei näytekappaletta, vaan oikea tuote oikealla nimellään ja kappale oikeaa kuvausta. Testaa sitten kolme tärkeää hetkeä: tuotesivu 375 pikselin levyisellä näytöllä, hakutulokset pitkällä kategorianimellä ja kassa oikealla maksupalveluntarjoajallasi. Esimerkiksi käsityönä tehtyjä keramiikkamukeja myyvä kauppa huomaa, että demon tuotekuvat on otettu valkoista taustaa vasten, mutta heidän kuvissaan on kiireinen pajatausta — teeman tumma peitto saa mokin katoamaan. Tällaisia asioita huomaa vain omalla sisällöllä.

Tämä on mallidemon auditoinnin ydin — se on markkinoinnin tarkistus, ei teeman. Jos otsikko kääntyy kolmelle riville ja työntää ”Lisää ostoskoriin” -painikkeen alas, se on varoitusmerkki riippumatta siitä, kuinka hyvältä demo näytti.

3. Mittaa se, mitä demo ei näytä.

Demo toimii teemakehittäjän optimoidulla palvelimella. Sivustosi tulee toimimaan omalla palvelimellasi, omilla lisäosillasi, analytiikkaskripteilläsi ja hylättyjen ostoskorien sovelluksellasi. Siksi demon latausnopeus on pohjimmiltaan fiktiota.

Perusta staging-sivusto oikealla varastollasi ja suorita kaksi testiä: ensin nopealla pöytäkoneyhteydellä, sitten oikealla puhelimella 4G-verkossa tyhjennetyllä välimuistilla. Katso aikaa, jolloin sivu on käytettävissä, ei vain sitä, milloin se näyttää latautuvan. Monet teemat renderöivät otsikon välittömästi, mutta estävät sitten asettelun kahdeksi sekunniksi, kun sliderskripti latautuu — todellinen ongelma puhelimissa. Käy myös kassaprosessi läpi puhelimella. Jotkut hiotut teemat näyttävät hyvältä pöytäkoneella, mutta muuttavat mobiilikassan viiden näytön dioiksi, kysyvät alennuskoodia ennen osoitetta ja näyttävät toimitusarvion maksupainikkeen jälkeen. Tässä kohtaa mobiililähtöisestä tarkistuslistasta on hyötyä — se pakottaa sinut tarkistamaan peukalon ulottuvuuden, kosketuskohteet ja sen, onko ”Jatka”-painike näkymän yläpuolella.

Saattaa tuntua houkuttelevalta luottaa teeman omaan nopeusraporttiin. Älä. Teeman demosivu palvellaan CDN:stä välimuistituksella, ja teeman nopeusmerkki on yleensä kuvakaappaus, joka on otettu ihanteellisissa olosuhteissa. Ympäristösi on erilainen, ja se on okei — testi koskee sinun ympäristöäsi.

4. Pisteytä räätälöinnin kustannus — ja ole rehellinen ”ilmaisesta”.

Tässä on oletus, jota sinun kannattaa haastaa: ilmaiset teemat ovat halvempia. Ne ovat harvoin ilmaisia, koska maksat kehittäjän ajassa. Ilmaisessa teemassa voi olla rajallinen asetuspaneeli, ja jokainen brändin hienosäätö — otsikon säätäminen, heron vaihtaminen, merkin lisääminen — vaatii CSS-ylityksen tai lapsiteeman, mikä tarkoittaa tuntia kehittäjän laskutettavaa aikaa. Maksullinen teema hyvällä asetuspaneelilla voi maksaa itsensä takaisin jo ensimmäisellä kerralla, kun vältät yksittäisen kustomoidun koodipyynnön.

Mutta myös päinvastoin on totta: maksullinen teema, johon on paketoitu sivunrakentaja, voi olla hitaampi ja vaikeampi ylläpitää kuin kevyt ilmainen teema. Todellinen kustannus ei ole lisenssin hinta; se on ero sen välillä, ”mitä demo tekee” ja ”mitä brändisi tarvitsee”. Laske muutokset, jotka todella tekisit: logo, otsikon asettelu, typografia, tuoteruudukko, alatunniste ja luottamusmerkit. Jos teeman asetuspaneeli kattaa viisi kahdeksasta, olet edellä. Jos se kattaa vain kaksi, ostat projektin, et teemaa. Tämä on osa väärän mallin valitsemisen piilokustannuksia — hintalappu on vasta alku.

5. Asettele kompromissit pomosi nähtäville.

Taulukko on sadan sähköpostiviestin arvoinen, koska se siirtää keskustelun ”pidän tästä” -asenteesta ”tämä valinta maksaa tämän” -asenteeseen. Tulosta tämä (tai liitä se Slackiin), kun vertailet kahta finalistia:

Mitä demo näyttää	Mitä sinun on tarkistettava
Hero-video toistuu välittömästi	Toistuuko se automaattisesti mobiilidatalla, vai muuttuuko se jäätyneeksi kuvaksi, jonka toistopainiketta kukaan ei napauta?
Tuotekuvat näyttävät laadukkailta	Mahtuvatko tuotekuvasi rajaukseen niin, ettei tuote katoa kehyksestä?
Navigointi on sujuvaa	Oikealla puhelimella, onko valikko yhden peukalon ulottuvilla, vai vaatiiko se kahden käden kurkotuksen?
Sivu latautuu nopeasti	Suorita nopeustesti omalla palvelimellasi, älä toimittajan.
Kassa on kaunis	Tee oikea testitilaus. Huomioi, kuinka monta napautusta ja kuinka paljon vierittämistä tarvitaan.

Pomosi näkee, että jotkut demot muuntavat tunteita, eivät myyntiä. Taulukko muuttaa nuo tunteet valintaruuduiksi.

6. Kirjoita yhden sivun päätösmuistio, joka päättää väittelyn.

Viimeinen vaihe muuttaa auditoinnin päätökseksi. Pidä se yhden sivun mittaisena ja selkokielisenä. Aloita suosituksella, näytä sitten kolme todistetta: mobiilitesti, nopeustesti ja räätälöintiarvio. Kerro sitten, minkä kompromissin hyväksyt — esimerkiksi ”menetämme animoidun ostoskori-ikonin, mutta saamme lyhyemmän kassan puhelimissa.” Lopeta seuraaviin vaiheisiin: mitä hienosäädät julkaisun jälkeen ja miten mittaat sen.

Muistio on myyntiasiakirja — myyt pomollesi päätöksen, jota hän voi puolustaa omalle esimiehelleen. Muotoile jokainen kohta liiketoiminnan termein. Sen sijaan, että sanoisit ”ostopainike on näkymän alapuolella iPhone SE:ssä”, kirjoita ”yleisimmällä puhelinkoolla asiakkaiden pitäisi vierittää lisätäkseen tuotteen, mikä lisää todennäköisyyttä, että he poistuvat.” Sen sijaan, että sanoisit ”teema käyttää paljon JavaScriptiä”, kirjoita ”sivu latautuu hitaammin 4G:llä, ja hitaat sivut liittyvät alhaisempaan konversioon.” Älä jätä ”seuraavat vaiheet” -osiota väliin; se vakuuttaa pomollesi, että et allekirjoita jotain pysyvää — aloitat prosessin, joka sisältää hienosäätöä julkaisun jälkeen.

Jos haluat perusteellisemman katsauksen siitä, miten mallin ominaisuudet sovitetaan konversiotavoitteisiin, tämä opas konvertoivan mallin valintaan kattaa ominaisuuskohtaisen erittelyn.

Ratkaisevaa on viitekehys, ei lopputulos.

Demo tulee aina vastaan — uusi trendi, näyttävämpi animaatio, pomon pikkuserkun sivusto. Sen sijaan, että väittelisit joka kerta, vie ehdokas samojen kuuden vaiheen läpi. Demo voi voittaa hetken, mutta muistio voittaa kokouksen. Ja seuraavan kerran, kun tarvitset päätöstä, sinulla on prosessi, jolle ei ole väliä, kuinka hyvältä tarina kuulostaa.