• E-kaubanduse ja kasutajaliidese (UI) disain

E-kaubanduse kasutajaliidese disain: (6 rakendatavat taktikat): Kuidas luua atraktiivseid tootekogumiku lehekülgi (6 rakendatavat taktikat)

  • Felix Rose-Collins
  • 5 min read
E-kaubanduse kasutajaliidese disain: (6 rakendatavat taktikat): Kuidas luua atraktiivseid tootekogumiku lehekülgi (6 rakendatavat taktikat)

Intro

Tootekollektsiooni leheküljed jäetakse kahjuks sageli tähelepanuta nii disainerite kui ka copywriteri poolt. Kuigi palju vaeva tehakse, et luua ülimalt huvipakkuvad toote- ja sihtlehed, jäävad kollektsioonilehed kõrvale ja jäävad kahetsusväärselt ebahuvitavaks.

Vaatleme kuut praktilist viisi, kuidas luua tootekogumiku lehekülgi, mis köidavad, inspireerivad tegutsema ning suurendavad külastatavust ja konversioone.

Veenduge, et esmane tootefoto on kaasahaarav

Esimene disainitakistus, mis tuleb ületada, on tagada, et esmane foto on köitev ja huvitav. Kui te ei püüa ostja tähelepanu praktiliselt kohe, kui ta maandub, või paari kerimise jooksul, olete ta tõenäoliselt kaotanud.

Alustage sellest, et kaalute kõike, mida te oma sihtrühma kohta teate. Mis neile meeldib? Miks neile teie tooted meeldivad? Mis on see, mis neile teie toodete juures meeldib? Kuidas saaksite need omadused esiplaanile seada?

Seejärel hakake kaaluma paigutust. Kas pilte on vaja suurendada? Kas nad vajavad elavat või neutraalset tausta? Kui palju tooteid peaksite näitama järjestikku?

Ideaaljuhul testite A/B-testiga mitmeid kujundusvariante. Mõnikord võivad kõige väiksemad muudatused teha kõige suurema erinevuse.

Vaadake seda beebirõivaste kollektsiooni lehekülge. Tooted ise on armsad ja köitvad, nii et neid ei ole vaja eriti uudsel viisil näidata. Silt "new in" eristab teatavad tooted selgelt ja tagab, et ostja märkab neid.

Meet Ranktracker

Kõik-ühes platvorm tõhusaks SEO-ks

Iga eduka ettevõtte taga on tugev SEO-kampaania. Kuid kuna on olemas lugematu hulk optimeerimisvahendeid ja -tehnikaid, mille hulgast valida, võib olla raske teada, kust alustada. Noh, ärge kartke enam, sest mul on just see, mis aitab. Tutvustan Ranktracker'i kõik-ühes platvormi tõhusaks SEO-ks.

Oleme lõpuks avanud registreerimise Ranktracker täiesti tasuta!

Loo tasuta konto

Või logi sisse oma volituste abil

Selliste toodete asetamine neutraalsele taustale on suurepärane viis, kuidas neid esile tõsta.

mamasandpapas

Allikas: mamasandpapas.com

Teine võimalus muuta esmane foto kollektsiooni lehel atraktiivseks on näidata toodet kasutuses. Kui te vaatate seda lahtise kasvuhoone lehekülge, näete, kuidas seda saab vaevata teha. Iga pilt on täiesti erinev, erinevas värvipaletis ja näitab eset erineva nurga alt. Nad on teinud toote kujutamise oma kodus lihtsaks.

greenhouseemporium

Allikas: greenhouseemporium.com

Meet Ranktracker

Kõik-ühes platvorm tõhusaks SEO-ks

Iga eduka ettevõtte taga on tugev SEO-kampaania. Kuid kuna on olemas lugematu hulk optimeerimisvahendeid ja -tehnikaid, mille hulgast valida, võib olla raske teada, kust alustada. Noh, ärge kartke enam, sest mul on just see, mis aitab. Tutvustan Ranktracker'i kõik-ühes platvormi tõhusaks SEO-ks.

Oleme lõpuks avanud registreerimise Ranktracker täiesti tasuta!

Loo tasuta konto

Või logi sisse oma volituste abil

See on suurepärane taktika, kui soovite, et kliendil oleks lihtsam näha, kuidas lõpptoode välja näeks, ja aidata tal kujutleda tervet elustiili.

Veenduge, et filtrid ei oleks liiga häirivad

Kollektsioonilehed vajavad filtreid, et olla kasulikud. Klientidelt ei saa oodata, et nad sirvivad lehekülgede kaupa tooteid, et leida üks konkreetne toode. Nad ei ole tõenäoliselt teadlikud teie pakkumise laiusest ja neil ei pruugi olla aega pikaks aknast ostlemiseks.

Filtrid peaksid liigitama teie tooted mõttekalt. Hind, suurus ja materjal on vaid mõned kõige levinumad filtrid, mida kasutada. Mõtle toodete endi peale ja sellele, millised on eristavad tegurid.

Mida keerulisem on toode, seda rohkem peaks olema filtreid. Võite pakkuda ka kasulikke, nagu "mitte algajatele" või "ainult professionaalidele", kui need aitavad klientidel õiget toodet valida.

Ka filtrid ei tohiks olla liiga häirivad. Need peaksid olema kergesti ligipääsetavad, kuid ei tohiks võtta suurt osa lehest ega mingil moel häirida sirvimiskogemust.

Vaadake seda komposiitplaatide kollektsiooni lehekülge. Filtrid on esitatud vasakul ja need on sobivas tasakaalus kergesti märgatava ja mitte segava vahel. Pange tähele, et need on ka kokkupandavad, nii et teabe hulk ei lämmataks klienti.

Need on ka loogiliselt järjestatud - enamik inimesi soovib enne täpsemate üksikasjade, nagu suurus, värvide ja materjalide valimist kitsendada.

Ovaeda

Allikas: Ovaeda.com

Saate hõlpsasti rakendada sarnase lahenduse, mis ei võta palju ruumi, kuid mis siiski parandab oluliselt kasutajakogemust ja võimaldab klientidel oma valikut mõne sekundiga kitsendada.

Kuva lühike tootekirjeldus hõljumisel

Mõelge tootekogumiku lehekülgedest kui teabekeskusest. Siin kuvatakse kõik teie tooted teatud kategoorias. Mida abivalmim olete, seda tõenäolisem on, et klient konverteerib.

Püüdke mitte sundida ostjaid kliki peale, lugege toote kirjeldust ja seejärel kliki tagasi. Nad peavad raiskama oma aega, et aru saada, kust nad äsja lahkusid. Või kui nad avavad pidevalt tooteid uutel vahekaartidel, siis on nad peagi ülekoormatud toodete arvust, mida nad püüavad võrrelda.

Mida rohkem kasulikku teavet suudate kollektsiooni lehel kuvada, seda parem. Lisades lihtsa ja lühikese tootekirjelduse, kui keegi viibib toote kohal, saate aidata klientidel tooteid kohe kohapeal võrrelda.

See bariaatriliste kaltsiumipuru kogumisleht teeb head tööd. Saate lühikese tootekirjelduse, mis ütleb teile, milliseid vitamiine ja mineraalaineid leiate tootest. Samuti tuuakse esile kasu: see maitseb hästi, soodustab immuunsüsteemi tervist ja nii edasi.

Bariatricfusion

Allikas: _Source: _Source: _Source: _Source: _Source: Bariatricfusion.com _

Pange tähele, kui lühikesed on kirjeldused. Saate neid lugeda paari sekundiga ja jätkata toodete võrdlemist.

Selle taktika kohaldamisel kaaluge hoolikalt hõljumi kirjeldust. See ei pea olema sama, mis toote lehel olev kirjeldus. See peaks lühidalt käsitlema toote eeliseid või põhiomadusi, eristades seda selgelt teistest lehel olevatest toodetest.

Keskenduge siin pigem informatiivsusele kui müügi edendamisele. Kliendid muutuvad tõenäolisemalt, kui nad on oma valikus kindlad.

Viska mõned sotsiaalsed tõendid

Sotsiaalne tõendusmaterjal on suurepärane vahend lehekülgede atraktiivsemaks ja kasulikumaks muutmiseks. Nad näitavad teie klientidele, et olete usaldusväärne, usaldusväärne ja et teie tooted on hea kvaliteediga. See on eriti oluline uute klientide jaoks, kes ei ole veel teie kaubamärki tundnud ja kes võivad olla kõhklevamad konverteerima.

Sotsiaalne tõestus on mitmel kujul, kuid tärnide hinnangud on kõige kasulikum tõend, mida oma kogumislehtedele panna. Need teenivad mitut eesmärki:

  • hinnata üksiku toote kvaliteeti
  • näidata, kui palju kliente on seda ostnud ja võtnud aega selle läbivaatamiseks.
  • aidata klientidel teha kiiremaid ostuotsuseid

Tähtede reitinguid on lihtne lisada. Tutvu Sephora silmavärvipaleti kollektsiooni lehega. Neid on lihtne märgata ja need näitavad kogu asjakohast teavet: kui palju on kommentaare ja milline on üldine rahulolu tootega. Samuti on selgelt näha, et üks palettidest on teistest palju populaarsem.

sephora

Allikas: sephora.com

Veel üks suurepärane sotsiaalne tõestussignaal, mida oma kollektsioonilehtedel kasutada, on reaalajas müügiteated.

Vaadake seda kohandatud sülearvuti kleebiste lehekülge. Sirvimise ajal ilmub parempoolsesse alumisse nurka tagasihoidlik hüpikaken, mis ütleb teile, kes on veebilehel ostu teinud, kust nad on pärit ja mida nad on ostnud.

See on suurepärane võimalus lisada oma turundustaktikasse natuke FOMO-d. Klientidele näidatakse teisi esemeid, esemeid, mis on selgelt populaarsed, sest keegi on neid just ostnud. See saadab ka tugevaid usalduse ja usaldusväärsuse signaale.

Veenduge, et hüpikaken ei oleks liiga silmatorkav või häiriv. Püüdke neid ka vahedega paigutada, et need ei hakkaks ostjaid häirima.

vinylstatus

Allikas: vinylstatus.com

Mitme toote vaate kuvamine

Mida paremini saavad kliendid toodet näha, seda suurem on nende võimalus, et nad konverteerivad. Mida rohkem pilte toote kohta kollektsiooni lehel kuvatakse, seda rohkem kaasamist ja huvi tekitate.

Saate lisada rohkem kui ühe pildi mitmel viisil. Saate lubada tootegaleriis kerimist või saate kuvada erinevat fotot, kui seda hõljute.

Sellel H&M-ipoiste rõivaste lehel on keritav tootegalerii. Saate näha kõiki fotosid, mis on esitatud üksikutel tootelehekülgedel, otse kollektsiooni lehelt, nii et te ei pea kunagi ära klikkima.

hm

Allikas:hm.com

Kui soovite hõljumisel kuvada lihtsalt teist pilti, vaadake inspiratsiooni saamiseks seda naiste rannarõivaste kollektsiooni lehekülge. Kaubamärk näitab targalt eseme tagakülge hõljumisel, nii et näete kogu detaili, ilma et peaksite avama teist lehekülge. See on suurepärane taktika rõivabrändide jaoks.

simplybeach

Allikas:simplybeach.com

Valides, kas lisada galerii või hõljufoto, kaaluge objekti olemust. Kui palju fotosid peab ostja nägema? Ja millised peaksid need fotod olema?

Võite näidata toodet, mida kasutatakse, või võite näidata klientide fotosid, kui need on tõenäolisemad uue ostja veenmiseks. Võite näidata toodet lähedalt või isegi loetleda toote spetsifikatsioonid.

Hiljuti vaadatud esemete kuvamine

Tootesoovitused on tavaliselt reserveeritud üksikutele tootelehekülgedele. Siia paigutavad kaubamärgid ka "hiljuti vaadatud" karusselli.

Kui aga esitate selle kollektsiooni lehel, saate klientidele õrnalt meelde tuletada, milliseid tooteid nad on juba näinud ja millised on neile meeldinud. Säästa neile aega ja vaeva, et nad saaksid tagasi minna oma ajaloo kaudu, kui neil on korraga avatud mitu vahekaarti.

Vaadake Adidase meeste jooksujalatsite lehekülge. Niipea, kui vaatad üksikut toodet, saad kollektsioonilehe allosas "hiljuti vaadatud" funktsiooni, mis aitab sul jälgida, millised tooted on sinu huvi äratanud.

adidas

Meet Ranktracker

Kõik-ühes platvorm tõhusaks SEO-ks

Iga eduka ettevõtte taga on tugev SEO-kampaania. Kuid kuna on olemas lugematu hulk optimeerimisvahendeid ja -tehnikaid, mille hulgast valida, võib olla raske teada, kust alustada. Noh, ärge kartke enam, sest mul on just see, mis aitab. Tutvustan Ranktracker'i kõik-ühes platvormi tõhusaks SEO-ks.

Oleme lõpuks avanud registreerimise Ranktracker täiesti tasuta!

Loo tasuta konto

Või logi sisse oma volituste abil

Allikas: adidas.com

Sama karussell kuvatakse ka üksikutel tootelehekülgedel, mis võimaldab individuaalselt kohandatud sirvimiskogemust.

Samuti saate klientidele soovitada tooteid nende poolt vaadatud toodete põhjal, nagu te seda teeksite tootelehekülgedel.

Kokkuvõtteks

Mõtle, milliseid neist tootekogumiku lehekülje kujundamise taktikatest saad rakendada oma lehekülgedel. Võib-olla võivad kõik kuus mängida rolli teie konversioonimäära suurendamisel.

Pidage alati silmas oma toote(te) olemust ja sihtrühma valupunkte. Mida nad otsivad ja kuidas teie kujundus aitab neil seda leida?

Felix Rose-Collins

Felix Rose-Collins

Ranktracker's CEO/CMO & Co-founder

Felix Rose-Collins is the Co-founder and CEO/CMO of Ranktracker. With over 15 years of SEO experience, he has single-handedly scaled the Ranktracker site to over 500,000 monthly visits, with 390,000 of these stemming from organic searches each month.

Alusta Ranktracker'i kasutamist... Tasuta!

Uuri välja, mis takistab sinu veebisaidi edetabelisse paigutamist.

Loo tasuta konto

Või logi sisse oma volituste abil

Different views of Ranktracker app