Design av brukergrensesnitt for e-handel: Hvordan lage engasjerende produktsamlingssider (6 handlingsbare taktikker)

Intro

Produktsamlingssider blir dessverre ofte oversett av både designere og tekstforfattere. Mens det legges ned mye arbeid i å skape svært engasjerende produktsider og destinasjonssider, faller kolleksjonssider utenfor og forblir sørgelig uinteressante.

La oss se på seks praktiske måter å lage produktsamlingssider på som engasjerer, inspirerer til handling og driver trafikk og konverteringer.

Sørg for at det primære produktbildet er engasjerende

Det første designhinderet produktsamlingssider må overvinne, er å sikre at det primære bildet er engasjerende og interessant. Hvis du ikke fanger kundens oppmerksomhet praktisk talt så snart de lander eller i løpet av et par skrollinger, har du sannsynligvis mistet dem.

Begynn med å vurdere alt du vet om målgruppen din. Hva liker de? Hvorfor liker de produktene dine? Hva er det ved produktene dine de liker? Hvordan kan du sette disse egenskapene i sentrum?

Deretter kan du begynne å vurdere layouten. Må bildene zoomes inn? Trenger de en levende eller nøytral bakgrunn? Hvor mange produkter skal du vise på rad?

Ideelt sett bør du A/B-teste flere designvarianter. Noen ganger kan de minste endringene utgjøre den største forskjellen.

Se på denne kolleksjonssiden for babyklær. Produktene i seg selv er søte og engasjerende, så de trenger ikke å vises på noen spesielt ny måte. "New in"-etiketten skiller tydelig ut enkelte produkter og sikrer at kunden legger merke til dem.

En nøytral bakgrunn er en fin måte å få produkter som dette til å skille seg ut på.

Kilde: mamasandpapas.com

En annen måte å gjøre det primære bildet på en samleside engasjerende på, er å vise varen i bruk. Hvis du ser på denne siden med lean-to-greenhouses, ser du hvordan dette kan utføres uten problemer. Hvert bilde er helt forskjellig, i en annen fargepalett og viser gjenstanden fra en annen vinkel. De har gjort det enkelt å forestille seg produktet i ditt eget hjem.

Kilde: greenhouseemporium.com

Dette er en god taktikk hvis du vil gjøre det enklere for kunden å se hvordan det endelige produktet vil se ut, og hjelpe dem med å forestille seg en hel livsstil.

Sørg for at filtrene ikke er for distraherende

Kolleksjonssider krever filtre for å være nyttige. Det kan ikke forventes at kundene skal bla gjennom side opp og side ned med produkter for å finne én bestemt vare. Det er lite sannsynlig at de er klar over bredden i tilbudet ditt, og det er ikke sikkert at de har tid til å bruke lang tid på vindusshopping.

Filtrene bør kategorisere produktene dine på en meningsfull måte. Pris, størrelse og materiale er bare noen av de vanligste filtrene å bruke. Tenk på selve produktene og hva som er de differensierende faktorene.

Jo mer komplekst produktet er, desto flere filtre bør det være. Du kan også tilby nyttige filtre som "ikke for nybegynnere" eller "kun for proffer", hvis de kan hjelpe kundene med å velge riktig vare.

Filtre bør heller ikke være for distraherende. De bør være enkle å få tilgang til, men ikke ta opp en stor del av siden eller på noen måte forstyrre surfeopplevelsen.

Ta en titt på denne siden med kolleksjoner av kompositt terrassebord. Filtrene er plassert til venstre, og de har den rette balansen mellom å være lett synlige og ikke i veien. Legg merke til at de også er sammenleggbare, slik at kunden ikke blir overveldet av den store mengden informasjon.

De er også ordnet på en logisk måte - de fleste vil ønske å avgrense seg til farger og materialer før de dykker ned i mer spesifikke detaljer, som størrelse.

Kilde: Ovaeda.com

Du kan enkelt implementere en lignende løsning som ikke tar så mye plass, men som likevel vil forbedre brukeropplevelsen betydelig og gjøre det mulig for kundene å avgrense valget sitt i løpet av sekunder.

Vis korte produktbeskrivelser når du holder musepekeren over produktet

Tenk på produktsamlingssider som et informasjonsnav. Det er her du viser alle produktene dine i en bestemt kategori. Jo mer hjelpsom du er, desto mer sannsynlig er det at en kunde konverterer.

Prøv å unngå at kundene klikker på en vare, leser produktbeskrivelsen og deretter klikker tilbake. Da må de kaste bort tid på å bla for å finne ut hvor de nettopp slapp. Eller hvis de fortsetter å åpne produkter i nye faner, kommer de snart til å bli overveldet av antallet varer de prøver å sammenligne.

Jo mer nyttig informasjon du kan vise på kolleksjonssiden, desto bedre. Ved å legge til en enkel, kort produktbeskrivelse når noen holder musepekeren over et produkt, kan du hjelpe kundene med å sammenligne produkter der og da.

Denne samlingssiden for kalsiumtygger for overvektige gjør en god jobb. Du får en kort produktbeskrivelse som forteller deg hvilke vitaminer og mineraler du kan finne i produktet. Fordelene fremheves også: det smaker godt, det fremmer immunforsvaret, og så videre.

_Kilde: Bariatricfusion.com _

Legg merke til hvor korte beskrivelsene er. Du kan lese dem på et par sekunder og fortsette å sammenligne produkter.

Når du bruker denne taktikken, bør du tenke nøye gjennom beskrivelsen du legger inn. Den trenger ikke å være den samme som beskrivelsen på produktsiden. Den bør kort beskrive fordelene eller de viktigste funksjonene ved produktet, slik at det skiller seg tydelig fra andre produkter på siden.

Fokuser på å være informativ i stedet for å presse frem et salg. Det er mer sannsynlig at kundene konverterer hvis de er trygge på valget sitt.

Legg til litt sosialt bevis

Sosiale bevis er et godt verktøy for å gjøre sidene mer engasjerende og nyttige. De viser kundene dine at du er til å stole på, at du er pålitelig og at produktene dine er av god kvalitet. Dette er spesielt viktig for nye kunder som ennå ikke er kjent med merkevaren din, og som kan være mer tilbakeholdne med å konvertere.

Det finnes mange former for sosialt bevis, men stjernerangeringer er den mest nyttige typen bevis å legge ut på samlingssidene dine. De vil tjene flere formål:

• vurdere kvaliteten på det enkelte produkt
• vise hvor mange kunder som har kjøpt den og tatt seg tid til å vurdere den
• hjelpe kundene med å ta raskere kjøpsbeslutninger

Det er enkelt å innarbeide stjernevurderinger. Ta en titt på Sephoras kolleksjonsside for øyenskyggepaletter. De er lette å få øye på og viser all relevant informasjon: hvor mange anmeldelser det er, og hvor fornøyd man er med produktet generelt. Du kan også tydelig se at en av disse palettene er mye mer populær enn de andre.

Kilde: sephora.com

Et annet godt signal om sosial bekreftelse som kan integreres på kolleksjonssidene dine, er salgsvarsler i sanntid.

Ta en titt på denne siden med klistremerker til bærbare datamaskiner. Mens du surfer, kommer det en diskret popup nederst i høyre hjørne som forteller deg hvem som har gjort et kjøp på nettstedet, hvor de kommer fra og hva de har kjøpt.

Dette er en flott måte å legge til litt FOMO i markedsføringstaktikken din. Kundene vil bli vist andre varer, varer som tydeligvis er populære fordi noen nettopp har kjøpt dem. Det vil også sende sterke signaler om tillit og troverdighet.

Sørg for at popup-vinduet ikke er for prangende eller distraherende. Prøv også å plassere dem med mellomrom, slik at de ikke begynner å irritere kundene.

Kilde: vinylstatus.com

Vis flere produktvisninger

Jo bedre kundene kan se et produkt, desto større er sjansen for at de konverterer. Jo flere bilder av en vare du viser på kolleksjonssiden, desto mer engasjement og interesse vil du skape.

Du kan integrere mer enn ett bilde på flere måter. Du kan tillate rulling gjennom et produktgalleri, eller du kan vise et annet bilde når du holder musepekeren over produktet.

Denne siden med gutteklær fra H&M har et rullbart produktgalleri. Du kan se alle bildene som vises på den enkelte produktsiden direkte fra kolleksjonssiden, slik at du aldri trenger å klikke deg bort.

Kilde:hm.com

Hvis du foretrekker å bare vise et annet bilde når du holder musepekeren over siden, kan du ta en titt på denne kolleksjonssiden med badetøy for kvinner for inspirasjon. Merket viser på en smart måte baksiden av plagget når du holder musepekeren over siden, slik at du kan se hele plagget uten å måtte åpne en ny side. Dette er en flott taktikk for klesmerker.

Kilde:simplybeach.com

Når du skal velge om du vil legge til et galleri eller et svevebilde, bør du vurdere varens art. Hvor mange bilder trenger kunden å se? Og hva skal disse bildene være?

Du kan vise produktet i bruk, eller du kan vise kundens bilder hvis det er mer sannsynlig at de vil overbevise en ny kunde. Du kan vise varen på nært hold, eller til og med liste opp produktspesifikasjoner.

Vis nylig viste elementer

Produktanbefalinger er vanligvis forbeholdt individuelle produktsider. Det er også her merkevarer vil plassere "nylig sett"-karusellen.

Men ved å vise den på kolleksjonssiden kan du forsiktig minne kundene på varene de allerede har sett og likt. Da slipper de å bruke tid og krefter på å gå tilbake i historikken sin og ha mange faner åpne samtidig.

Ta en titt på siden med Adidas løpesko for menn. Så snart du ser på et individuelt produkt, får du en "nylig sett"-funksjon nederst på kolleksjonssiden, slik at du kan holde øye med de produktene som har vekket din interesse.

Kilde: adidas.com

Den samme karusellen vises også på de enkelte produktsidene, noe som gir en individuelt tilpasset surfeopplevelse.

Du kan også anbefale produkter til kundene basert på hvilke varer de har sett på, akkurat som på produktsider.

Avslutning

Tenk over hvilke av disse designtaktikkene du kan implementere på dine egne produktsamlingssider. Kanskje kan alle seks spille en rolle i å øke konverteringsfrekvensen.

Ha alltid produktets/produktenes natur og målgruppens smertepunkter i tankene. Hva er de ute etter, og hvordan kan designarbeidet ditt hjelpe dem med å finne det?