18 websteder med e-handel med fejlfri UX-design (& 3 store navne, der sutter)

Hvis du kom med til vores UX-artikel tidligere i denne måned, ved du, at vi diskuterede de 25 væsentlige UX-designelementer til dit websted.


Den grundlæggende idé er dette: UX-design handler om at komme inde i hovedet på din besøgende. Det handler om at skabe en enkel, problemfri og fornøjelig oplevelse for dine brugere. Ideen er at levere information hurtigt og endda få dem til at smile.

Godt UX-design gnister dopamin og lykke hos dine besøgende. Og det gør dem mere tilbøjelige til at stole på dig. Af afgørende betydning gør det dem mere tilbøjelige til at købe hos dig.

Efter at have gennemgået de 25 grundlæggende i vores sidste UX-designartikel, lad os se på, hvordan det fungerer i handling. Specifikt ser vi på UX-designet af e-handelswebsteder.

Hvordan bruger disse websteder smarte UX-designtricks for at tilskynde deres besøgende til at købe?

1. Asos

Jeg bruger Asos eksempel meget, men der er en god grund til det. Deres UX-design er strålende.

Det hele starter med et forslag til knock-out-værdi. Fantastisk billede, enkel forklarende, ‘gratis levering’ -garantien og de åbenlyse opfordringer til handling, der leder dig til mænds eller kvindesektion.

asos2

En af deres fremtrædende UX-funktioner er video catwalk, så besøgende faktisk kan se, hvordan et tøj ser ud. Det giver kunderne den bedst mulige visning af varerne og giver dem tillid til at købe.

De har også en fremragende ny funktion kaldet ‘hurtig visning’. På deres produktside rammer du ‘hurtig visning’, og en lille pop-up vises med ekstra billeder og al den information du har brug for. Det gemmer kunden ved at klikke frem og tilbage til forskellige sider. Enkelt, intuitivt design.

Asos

2. Zara

Zaras websted er en mesterklasse i enkelhed. Ren, intuitiv og begrænset. Det er en ode til Hicks lov: et designprincip, der begrænser navigationsvalg og giver brugeren klare, men begrænsede muligheder.

Tanken er, at for mange muligheder vil overvælde din besøgende. Ved at tilbyde færre valg, føler de sig mere tillid. Vi ser på mere fremragende navigation i dette indlæg, men Zara’s er en af ​​de bedste.

Zara

3. Abof

Abof (All About Fashion) bruger et uhyggeligt smart UX-trick på deres hjemmeside. Klik på startsiden, og den ligner ikke et traditionelt e-handelswebsted. I stedet ligner det en blog. Det er fuld af saftigt indhold, der inspirerer sit publikum.

abof

Inden for deres historier og artikler fremhæver de tøjet i et fremtrædende afsnit kaldet ‘Handle historien’. I vores tidligere UX-artikel talte vi om vigtigheden af ​​at skabe et forhold til dit publikum. Abof gør dette perfekt med relatable historier og indhold.

abof 2

Først når kunden er inspireret prøver de at sælge noget.

På deres produktside har de nyttige ‘stil tip’ noter, som er perfekte eksempler på ‘mikro-interaktioner’ – små nuggets, der når ud og engagerer dit publikum.

abof 3

Bemærk, at de også har en ‘størrelsesguide’, der hjælper kunderne med at få deres nøjagtige målinger rigtige (frygt for, at tøj ikke passer, er en af ​​de største grunde til, at vi opgiver indkøbsvogne). De bruger også et afsnit med ”estimeret levering” for at give kunderne endnu mere information.

4. Berghaus

Berghaus er et udendørstøjmærke, men du ved det inden for det første sekund efter landing på deres websted.

Berghaus

Dette er et brand, der intimt forstår sin målgruppe, og sørger for at oprette forbindelse med dem så hurtigt som muligt. Det første helteskud er en inspirerende invitation. Det forbinder med samfundet og lokker dig ind.

Den eneste ulempe? En stærkere opfordring til handling ville virkelig forsegle aftalen her.

5. Apple

Du kan forvente, at et firma, der sætter design og innovation i centrum for at udmærke sig i UX-design, og det gør de. Tjek deres produktsider for en start.

De bruger parallax-rulning for at gøre billederne dynamiske, tegne brugeren ind og fjerne eventuelle udgangspunkter. Du er fordybet i Apple’s verden.

Skærmbillede 2016-07-28 kl. 8.43.00

Smarte animationer viser dig nøjagtigt, hvordan produkterne fungerer, som det nye 3D-touch. Rullende gallerier inviterer dig til at interagere og udforske, og smart kopi fortæller dig nøjagtigt, hvordan den nye iPhone vil forbedre dit liv (snarere end en lang specieliste over funktioner).

Deres navigation er enkel og ren, og jeg elsker deres brug af billeder til yderligere at differentiere indstillingerne (vi scanner på nettet, så ord har en vane at blande sig ind i hinanden)

æble 2

Under kasseprocessen giver de dig muligheden for at chatte med en specialist, mens du køber. Det er et enkelt, men nyttigt trick. Det giver nybegynder en vis hjælp over linjen, men hindrer ikke tillidsfulde købere i at få deres kreditkort ud.

6. Bellroy

Som en relativt ny e-handelssælger er din første opgave at vise kunder, hvordan du er anderledes end alle andre. Bellroy gør dette perfekt med deres sortiment af slanke, kompakte tegnebøger.

bellroy 3

Endnu bedre er det, at hver eneste tegnebog på sine produktsider har sin egen video, der viser kunderne alle de unikke funktioner.

bellroy 4

7. Lej landingsbanen

Rent The Runway har et temmelig unikt koncept: du låner en kjole eller tøj til et par dage i stedet for at købe den. Dette er dejligt til bryllupper eller begivenheder, hvor du ikke ønsker at tage ud til et tøj, som du måske aldrig vil bære igen.

Hjemmesiden introducerer konceptet simpelthen og inviterer derefter brugerinteraktion, der får dem til at vælge lejlighed.

landingsbane leje

Ekstra mærker til deres leveringskalender, der fortæller kunderne nøjagtigt, hvornår tøjet kommer, og hvornår det skal returneres.

baneudlejning 2

Så enkel, men så betryggende.

8. Amazon

Amazon er verdens største e-handelswebsted og helt ærligt en af ​​de bedste. Du kan vælge en af ​​deres funktioner som et eksempel på UX-design.

Fra deres smarte bundter til deres kundeanbefalinger foregriber de brugernes behov og leverer. Det er dog deres ordresystem med et enkelt klik, som vi fremhæver i dag.

amazon

Det er stadig det bedste eksempel på effektivitet ved udtjekning på nettet. I kernen i e-handel er UX-design indkøbs- og udtjekningsprocessen. Jo glattere jo bedre. Og det bliver ikke glattere end bestilling med et enkelt klik!

9. Græs

Et billede, der fortæller dig alt hvad du har brug for at vide. Ordspil og design med en personlighed. En øjeblikkelig rabat for nye brugere og en stor, fed opfordring til handling.

græsse

Dette er en simpel masterclass i UX design.

10. TopShop

Butikker, der sælger en masse produkter, har et meget hårdere job, når det kommer til UX-design. Hvordan organiserer du hvert andet par jeans og præsenterer dem?

Heldigvis har TopShop en fantastisk plan. Med et stort, tykt filterhjul, der flyder med siden, kan du konstant finjustere og ændre stil, farve, pasform og pris på dine produkter.

Topshop 2

Endnu køligere skifter hvert produkt til et billede af modellen, der bærer dem, når du svæver over med musen. Det tilskynder til interaktion og giver kunderne et bedre kig på varerne.

11. Protest

Protest har måske bare den største, fedeste navigation på nettet.

P

Det er klart, kortfattet og uklart. Det reducerer også chancen for, at kunden vandrer væk. Den blå farve holder kundens opmærksomhed lige, hvor de vil have den.

Protest bruger også et væld af små animationer på tværs af deres websted. Hver udløser, når du ruller over den. Det bevarer kundens opmærksomhed, tilskynder til interaktion og får hele webstedet til at føle sig dynamisk.

12. Nyt look

New Look får et sted på listen for deres innovative kurv. Den sidder på deres navigationslinje på alle tidspunkter med en fed indikator for at minde dig om, at den er der.

Nyt look 2

Når du klikker på det, trækker det dig ikke væk til en anden side. I stedet får du et skydepanel, der bevæger sig ind fra siden for at vise dig, hvad der er i din taske. Det betyder, at kunder aldrig går tabt, og at de nemt kan tjekke, når de vil.

Nyt udseende

13. Blyant, ved 53

Hvis du vil sælge en styluspen til næsten $ 60, skal du virkelig sælge den! Heldigvis er ‘blyant’ af 53 et fremragende stykke arbejde ved hjælp af et antal UX-designtricks.

De bruger en lang, parallax rulleside til at forklare alle funktionerne og vise dig nøjagtigt, hvad du kan gøre med det.

blyant 2

De drager også fordel af gode anmeldelser for at forklare, hvorfor de er så meget bedre end de andre muligheder derude. Brug af et tilbud fra ‘Wired’ er et strålende trick for at give produktet troværdighed og skitsere dets fordel.

Blyant

14. Farmdrop

I vores sidste artikel om UX-design forklarede vi, hvor vigtigt det er at være empatisk med din målgruppe og få forbindelse til dem. Farmdrop gør dette ved at sætte deres mission statement foran og centrum.

gård

De er ‘syge og trætte af at se mad hentet fra miles væk’. Det er noget, som de fleste kunder kan få om bord med. Før de prøver at sælge dig noget, forbinder de dig og giver dig en grund til at købe.

15. Sid Mashburn

Bare en anden stor dropdown-menu komplet med små ikoner. Det er et simpelt trick, der hjælper os med at give mening om en omfattende menu. Plus, det giver webstedet lidt mere personlighed.

ikoner

16. Langsomte ure

Dette er et ur med kun en hånd. Det er et temmelig unikt koncept, så det kræver nogle forklaringer! Slow Watches gør dette virkelig godt med en forklaringsvideo på fuld skærm.

langsomme ure

Udover at forklare konceptet snakker de også gennem deres filosofi bag oprettelsen af ​​det (fantastisk til forbindelse med kunden), og de bruger smukke billeder, der fremhæver og målretter deres ideelle publikum.

17. Brændkammer

Når dine varer ikke passer ind i normale kategorier, skal du blive kreativ! Firebox er specialiseret i usædvanlige gaver og irreverente genstande. Deres top 50-diagram er den perfekte måde at udforske deres mest populære produkter på.

billeder

Kasselayoutet er fantastisk til hurtigt at gennemsøge produkter, og mange af billederne er dynamiske, bevægelige og interagerer med kunden.

Da de har specialiseret sig i gaver, har de også en ‘gave finder’ på deres nav-bar, en fantastisk måde at indsnævre mulighederne på.

18. Lazy Oaf

Online-shopping føles ofte ret ens, og mange vil gå glip af den gamle proces med at bladre gennem et magasin eller et katalog.

Lazy Oaf bringer dette tilbage med deres cool ‘lookbooks’ sektion. I stedet for at lægge tøjet ad gangen viser de tøjene i forskellige kombinationer på én gang. Når alt kommer til alt var det sådan, de plejede at se ud i et katalog.

doven oaf

Klik på billederne, så får du et ‘hurtigt køb’-felt for at vælge hvert af de tre elementer, der vises. Det er en mere gammel skole og fordybende måde at shoppe på.

Hvad man ikke skal gøre!

Vi kan ikke lide at rippe andre websteder i stykker, men der er nogle store navne derude, der får det hele galt … Her er en eller to af de værste lovovertrædere.

1. House of Fraser

De er et af de største stormagasiner i verden, men de laver en enorm fejltagelse, så snart du indlæser deres websted.

Straks væk er du ramt af en pop-up på fuld side, der beder dig om at abonnere på deres nyhedsbrev.

Fraser på time

Selvom de er en butik med store navne, er det en meget påtrængende taktik, der vil udsætte de fleste shoppere. Husk, at dette er det første indtryk. Det er meget bedre at oprette en brugerrejse, der uddanner og inspirerer din besøgende, før du beder om en e-mail-adresse.

Ikke kun det, men der er ikke noget reelt incitament til at tilmelde sig deres nyhedsbrev. En rabat på voucher-kode ville være en god mulighed her og kan muligvis hjælpe kunder med at tilgive den invasive popup.

2. Wal Mart

Wal Mart har en hård udfordring. De sælger stort set alt, så hvordan kan man gå i gang med at kategorisere det og gøre det enkelt? Jeg er ikke sikker … men kan ikke lide denne …

væg mart

Desværre er dette bare et rod af kategorier, der næsten er umuligt at finde det, du leder efter.

Her foregår simpelthen for meget information. Når du præsenterer dine brugere for mange muligheder, får de ofte bare panik og forlader.

3. Ray-Ban

Dette er et lidt middel valg, fordi det meste af Ray-Ban’s websted er meget brugervenligt. Faktisk har det et væld af smarte funktioner.

De gør dog noget, som en masse e-handelswebsteder gør, der virkelig irriterer kunderne. Det her:

Ray Ban

Du har sandsynligvis set en side som denne hundrede gange. Det virker ikke så dårligt, men det skaber faktisk endnu en barriere for salget.

Hvis du er en tilbagevendende kunde, er du nu travlt med at undre dig over, hvilken adgangskode du har oprettet. Hvis du ikke kan huske det, bliver du nødt til at gennemgå hele ‘glemt adgangskode’-processen. Du kan miste denne kunde på ethvert tidspunkt …

Hvis du er en ny kunde, er der en gæstecheck, bestemt, men alt hvad du har gjort er at give dem en anden knap, der skal klikkes på. En anden chance for at klikke væk.

På dette tidspunkt er din kunde helt afbrudt fra deres indkøbsvogn og købsprocessen. Træk ikke det ud, bare lås salget!

Fantastisk UX-design handler om de små justeringer, der gør tingene lettere for dine kunder. Disse 18 websteder gør det perfekt.

Hvilke funktioner vil du bruge på dit eget websted?

Kim Martin Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map