Jos liittyit meihin UX-artikkeliomme varten aikaisemmin tässä kuussa, tiedät, että keskustelemme 25 tärkeästä UX-suunnitteluelementistä verkkosivustollesi.

Perusajatus on seuraava: UX-suunnittelun tarkoituksena on päästä kävijän pään sisälle. Kyse on yksinkertaisen, saumattoman ja nautinnollisen kokemuksen luomisesta käyttäjillesi. Ideana on toimittaa tietoa nopeasti ja jopa saada ne hymyilemään.

Hyvä UX-muotoilu herättää kävijöissäsi dopamiinia ja onnea. Ja se tekee heistä todennäköisemmin luottamaan sinuun. Tärkeintä on, että se tekee heistä todennäköisemmin ostamaan sinulta.

Tutkittuaan viimeisen UX-suunnitteluartikkelimme 25 perustietoa, katsotaanpa miten se toimii toiminnassa. Erityisesti tarkastelemme verkkokauppasivustojen UX-muotoilua.

Kuinka nämä sivustot käyttävät fiksuja UX-suunnittel temppuja rohkaistakseen kävijöitään ostamaan?

1. Asos

Käytän paljon Asos-esimerkkiä, mutta siihen on hyvä syy. Heidän UX-suunnittelu on loistava.

Kaikki alkaa poistoarvon ehdotuksesta. Upea kuva, yksinkertainen selittäjä, ilmaisen toimitustakuu ja ilmeiset toimintakehotukset, jotka ohjaavat sinut miesten tai naisten osastoon.

asos2

Yksi heidän erottuvista UX-ominaisuuksistaan ​​on videokatu, joten kävijät voivat todella nähdä, miltä asulta näyttää. Se antaa asiakkaille parhaan mahdollisen kuvan tavaroista ja antaa heille varmuuden ostaa.

Heillä on myös erinomainen uusi ominaisuus, nimeltään ‘pikakuvaus’. Heidän tuotesivulla painat pikakatselua, ja näyttöön tulee pieni ponnahdusikkuna, jossa on ylimääräisiä kuvia ja kaikki tarvitsemasi tiedot. Se säästää asiakkaan napsauttamalla edestakaisin eri sivuille. Yksinkertainen, intuitiivinen suunnittelu.

ASOS

2. Zara

Zaran verkkosivusto on mestariluokka yksinkertaisella tavalla. Puhdas, intuitiivinen ja rajoitettu. Se on oodi Hickin lakiin: suunnitteluperiaate, joka rajoittaa navigoinnin valintaa ja antaa käyttäjälle selkeät mutta rajoitetut vaihtoehdot.

Ajatuksena on, että liian monta vaihtoehtoa hukuttaa kävijän. Tarjoamalla vähemmän valintoja, he tuntevat olonsa varmemmiksi. Tarkastellaan erinomaisempaa navigointia tässä viestissä, mutta Zaran oma on yksi parhaimmista.

Zara

3. Abof

Abof (All About Fashion) käyttää omistavasti taitava UX-temppu verkkosivuillaan. Löydä kotisivu, eikä se näytä perinteiseltä verkkokauppasivustolta. Sen sijaan se näyttää enemmän kuin blogi. Se on täynnä mehukasta sisältöä, joka inspiroi yleisöä.

abof

Sitten tarinoissaan ja artikkeleissaan he korostavat vaatteet näkyvässä osassa nimeltä “Osta tarina”. Edellisessä UX-artikkelissamme puhuimme suhteesi luomisen tärkeydestä yleisöllesi. Abof tekee tämän täydellisesti relatiivisilla tarinoilla ja sisällöllä.

abof 2

Vasta asiakkaan innoittamana he yrittävät myydä jotain.

Tuotesivullaan on hyödyllisiä ‘tyylivihjeitä’, jotka ovat täydellisiä esimerkkejä ‘mikrovuorovaikutuksesta’ – pienistä nuggeista, jotka tavoittavat yleisön ja kiinnostavat sitä.

abof 3

Huomaa, että heillä on myös ”koko-opas”, jonka avulla asiakkaat saavat tarkkoja mittojaan oikein (pelko vaatteiden sopimatta jäämisestä on yksi suurimmista syistä, jonka vuoksi hylkäämme ostoskärryt). He käyttävät myös arvioitua toimitusosaa antaa asiakkaille vielä enemmän tietoa.

4. Berghaus

Berghaus on ulkoiluvaatemerkki, mutta tiedät sen ensimmäisen sekunnin aikana laskeutumisesta heidän sivustolleen.

Berghaus

Tämä on brändi, joka ymmärtää läheisesti kohdeyleisönsä ja varmistaa yhteydenpitoon niihin mahdollisimman nopeasti. Ensimmäinen sankarikuva on inspiroiva kutsu. Se on yhteydessä yhteisöön ja houkuttelee sinut sisään.

Ainoa haittapuoli? Vahvempi toimintakehotus todella sulkee sopimuksen täällä.

5. Apple

Odottaisit, että yritys, joka asettaa suunnittelun ja innovaatioiden ytimeensä, etenee UX-suunnittelussa, ja he tekevätkin. Tarkista heidän tuotesivut aluksi.

He käyttävät parallaksivieritystä kuvan muuttamiseen dynaamiseksi, vetäen käyttäjän sisään ja poistamaan mahdolliset lähtöpisteet. Olet uppoutunut Applen maailmaan.

Näyttökuva 2016-07-28 klo 8.43.00

Älykkäät animaatiot osoittavat sinulle, kuinka tuotteet toimivat, kuten uusi 3D-kosketus. Vierivät galleriat kutsuvat sinut vuorovaikutukseen ja tutkimiseen, ja fiksu kopio kertoo sinulle, kuinka uusi iPhone parantaa elämääsi (pitkän ominaisuusluettelon sijaan).

Heidän navigointi on yksinkertaista ja puhdasta, ja rakastan heidän kuvien käyttöä vaihtoehtojen erottamiseen edelleen (skannaamme verkkoa, joten sanoilla on tapansa sulautua toisiinsa)

omena 2

Kassan aikana ne antavat sinulle mahdollisuuden keskustella asiantuntijan kanssa ostoksen aikana. Se on yksinkertainen mutta hyödyllinen temppu. Se antaa aloittelijoille jonkin verran apua linjan kautta, mutta ei estä luottavaisia ​​ostajia saamasta luottokorttinsa pois.

6. Bellroy

Suhteellisen uudenaikaisena verkkokaupan myyjänä ensimmäinen tehtäväsi on näyttää asiakkaille, kuinka erilainen olet muihin verrattuna. Bellroy tekee tämän täydellisesti ohuiden, pienikokoisten lompakkojen kanssa.

kellotaulu 3

Parempaa vielä, jokaisella lompakolla on tuotesivuillaan oma video, joka näyttää asiakkaille kaikki ainutlaatuiset ominaisuudet.

kellotaulu 4

7. Vuokra kiitotie

Rent The Kiitotiellä on melko ainutlaatuinen konsepti: lainat mekko tai asu muutamalle päivälle sen sijaan, että ostaisit sen. Tämä sopii erinomaisesti häihin tai tapahtumiin, joissa et halua poistua asusta, jota et koskaan koskaan voi käyttää.

Verkkosivusto esittelee konseptin yksinkertaisesti ja kutsuu sitten käyttäjän vuorovaikutukseen ja kehottaa heitä valitsemaan tilanteen.

kiitotien vuokraus

Lisämerkinnät myös toimituskalenteriinsa, jolloin asiakkaat tietävät tarkalleen, milloin asu tulee ja milloin se on palautettava.

kiitotien vuokraus 2

Niin yksinkertaista, mutta niin rauhoittavaa.

8. Amazon

Amazon on maailman suurin sähköisen kaupan verkkosivusto ja rehellisesti sanottuna yksi parhaista. Voit valita minkä tahansa heidän ominaisuuksistaan ​​esimerkkinä UX-suunnittelusta.

Älykkäistä paketeista asiakkaiden suosituksiin he ennakoivat käyttäjien tarpeita ja toimittavat. Kuitenkin korostamme tänään heidän yhden napsautuksen tilausjärjestelmää.

Amazon

Se on edelleen paras esimerkki check-out-tehokkuudesta verkossa. Sähköisen kaupankäynnin ytimessä UX-suunnittelu on kärry- ja kassaprosessi. Mitä tasaisempi, sitä parempi. Ja se ei ole sujuvampaa kuin yhden napsautuksen tilaaminen!

9. laiduntaa

Kuva, joka kertoo kaiken mitä sinun tarvitsee tietää. Sanamuoto ja muotoilu persoonallisuuden kanssa. Välitön alennus uusille käyttäjille ja iso, rohkea toimintakehotus.

laiduntaa

Tämä on yksinkertainen mestarikurssi UX-suunnittelussa.

10. TopShop

Myymälöillä, jotka myyvät paljon tuotteita, on paljon vaikeampaa työtä UX-suunnittelussa. Kuinka järjestät jokaisen farkut ja esität ne?

Onneksi TopShopilla on hieno suunnitelma. Sivulla kelluvalla suurella, paksuisella suodatinkiekolla voit jatkuvasti säätää ja muuttaa tuotteiden tyyliä, väriä, sopivuutta ja hintaa..

Topshop 2

Jopa viileämpi, jokainen tuote vaihtuu kuvaksi mallista, joka käyttää niitä, kun viet hiiren osoittimen päälle. Se rohkaisee vuorovaikutukseen ja antaa asiakkaille paremman käsityksen tuotteista.

11. Protesti

Protestillä saattaa olla vain suurin ja rasvaisin navigointi verkossa.

P

Se on selkeä, lyhyt ja siistinen. Se vähentää myös asiakkaan mahdollisuutta eksyä. Sininen väri pitää asiakkaan huomion siellä, missä he sitä haluavat.

Protest käyttää myös tonnia pieniä animaatioita sivustollaan. Jokainen laukaisee, kun vierität sitä. Se säilyttää asiakkaiden huomion, rohkaisee vuorovaikutukseen ja saa koko sivuston tuntemaan dynaamista.

12. Uusi ilme

New Look saa paikan luettelossa heidän innovatiivisesta koristaan. Se istuu heidän navigointipalkissaan koko ajan lihavoidulla osoittimella, joka muistuttaa sinua siitä.

Uusi ilme 2

Kun napsautat sitä, se ei vie sinua toiselle sivulle. Sen sijaan saat liukuvan paneelin, joka liikkuu sivulta sisään näyttääksesi sinulle, mitä on laukussa. Se tarkoittaa, että asiakkaat eivät koskaan eksy, ja he voivat helposti kassalla milloin tahansa.

Uusi ilme

13. Lyijykynä, kirjoittanut 53

Jos aiot myydä kynä lähes 60 dollarilla, sinun on todella myytävä se! Onneksi ‘Pencil’, 53 mennessä tekee erinomaista työtä käyttämällä useita UX-suunnittel temppuja.

He käyttävät pitkää, rinnakkain vieritettävää sivua selittääksesi kaikki ominaisuudet ja osoittavat sinulle, mitä voit tehdä sillä.

lyijykynä 2

He hyödyntävät myös hyviä arvosteluja selittääkseen miksi ne ovat niin paljon parempia kuin muut siellä olevat vaihtoehdot. Wired-tarjouksen käyttäminen on loistava temppu tuotteen uskottavuuden lisäämiseksi ja sen hyödyn esittelemiseksi.

Lyijykynä

14. Maapöllö

Viimeisessä UX-suunnittelua käsittelevässä artikkelissamme selitettiin, kuinka tärkeää on tuntea kohderyhmäsi kanssa ja olla yhteydessä heihin. Farmdrop tekee tämän asettamalla heidän tehtävänkuvauksensa eteen ja keskelle.

maatila

He ovat “sairaita ja kyllästyneitä näkemään ruokaa, joka on saatu maileilta”. Se on jotain, jonka suurin osa asiakkaista voi saada mukaan. Ennen kuin he yrittävät myydä sinulle mitään, he ottavat sinuun yhteyttä ja antavat sinulle syyn ostaa.

15. Sid Mashburn

Vielä yksi hieno pudotusvalikko, jossa on pienet kuvakkeet. Se on yksinkertainen temppu, joka auttaa meitä ymmärtämään laajan valikon. Lisäksi se antaa verkkosivustolle hieman enemmän persoonallisuutta.

kuvakkeet

16. Hitaat kellot

Tämä on kello vain yhdellä kädellä. Se on melko ainutlaatuinen konsepti, joten se vie jonkin verran selitystä! Hitaat kellot tekevät tämän todella hyvin koko näytön selittävän videon kanssa.

hitaat kellot

Sen lisäksi, että he selittävät konseptin, he puhuvat myös sen luomisen taustalla olevasta filosofiastaan ​​(sopivat hyvin yhteyteen asiakkaaseen) ja käyttävät kauniita kuvia, jotka korostavat ja kohdistavat ihanteellisen yleisön.

17. Firebox

Kun esineesi eivät sovi normaaliin luokkaan, ole luova! Firebox on erikoistunut epätavallisiin lahjoihin ja kunnioittamattomiin esineisiin. Heidän 50 parhainta taulukkoa on täydellinen tapa tutustua suosituimpiin tuotteisiin.

kuvien

Laatikkoasettelu on hieno selaamaan nopeasti tuotteiden läpi, ja monet kuvat ovat dynaamisia, liikkuvia ja vuorovaikutuksessa asiakkaan kanssa.

Koska he ovat erikoistuneet lahjoihin, heillä on myös “lahjahaku” navigointipalkissaan, mikä on loistava tapa kaventaa vaihtoehtoja.

18. Laiska Oaf

Verkkokaupat tuntuvat usein melko samanlaisilta, ja monet menettävät vanhan prosessin selailla lehden tai luettelon läpi.

Lazy Oaf tuo tämän takaisin heidän viileällä “hakukirja” -osiossa. Sen sijaan, että asettaisi vaatteita kerrallaan, ne näyttävät asut eri yhdistelminä kerralla. Loppujen lopuksi näin he katsoivat yleensä luettelossa.

laiska oaf

Napsauta kuvia ja saat ‘pikaosto’ -ruudun valitaksesi kaikki kolme näytössä olevaa kohdetta. Se on entistä vanhempi koulu ja kiehtova tapa tehdä ostoksia.

Mitä ei tehdä!

Emme halua kopioida muita verkkosivustoja paloiksi, mutta siellä on joitain suuria nimiä, joiden avulla kaikki käy väärin … Tässä on yksi tai kaksi pahinta rikoksentekijää.

1. Fraserin talo

Ne ovat yksi suurimmista tavarataloista maailmassa, mutta he tekevät yhden valtavan virheen heti, kun lataat heidän verkkosivustonsa.

Heti, kun olet kokenut kokosivun ponnahdusikkunan, jossa sinua pyydetään tilaamaan heidän uutiskirje.

Fraserin kurssi

Vaikka ne ovat iso nimimyymälä, se on erittäin taipuisa taktiikka, joka vie useimmat ostajat pois. Muista, että tämä on ensimmäinen vaikutelma. On paljon parempi luoda käyttäjän matka, joka kouluttaa ja inspiroi vierailijaasi ennen sähköpostiosoitteen pyytämistä.

Paitsi, että myöskään, ei ole todellista kannustinta ilmoittautua heidän uutiskirjeensä. Alennus tositekoodista olisi tässä erinomainen vaihtoehto, ja se voi auttaa asiakkaita antamaan anteeksi tunkeutuva ponnahdusikkuna.

2. Wal Mart

Wal Martilla on kova haaste. Ne myyvät melkein kaiken, joten miten luokitella se ja tehdä siitä yksinkertaista? No, en ole varma … mutta en näin …

seinä mart

Valitettavasti tämä on vain luokkien sotku, jota on melkein mahdotonta löytää etsimäsi.

Täällä on yksinkertaisesti liian paljon tietoa. Kun esität käyttäjillesi liian monta vaihtoehtoa, he usein paniikoivat ja lähtevät.

3. Ray-Ban

Tämä on hieman keskimääräinen valinta, koska suurin osa Ray-Banin verkkosivuista on erittäin käyttäjäystävällisiä. Itse asiassa siinä on paljon hienoja ominaisuuksia.

He tekevät kuitenkin jotain, mitä monet verkkokauppasivustot tekevät, mikä todella ärsyttää asiakkaita. Tämä:

säteen kielto

Olet todennäköisesti nähnyt tällaisen sivun sata kertaa. Se ei vaikuta siltä niin pahaltä, mutta luo todellisuudessa vielä yhden esteen myynnille.

Jos olet palaava asiakas, mietit nyt kiirettäsi, minkä salasanan olet luonut. Jos et muista sitä, joudut suorittamaan koko unohdetun salasanan prosessin. Voit menettää asiakkaan milloin tahansa …

Jos olet uusi asiakas, siellä on vieraiden kassat, mutta kaikki mitä olet tehnyt, on antaa heille uusi napsautettava painike. Uusi mahdollisuus napsauttaa pois.

Tässä vaiheessa asiakas on täysin irrotettu ostoskoristaan ​​ja ostoprosessistaan. Älä vedä sitä ulos, sulje vain myynti!

Upea UX-suunnittelu on kyse pienistä säädöksistä, jotka helpottavat asiakasta. Nämä 18 verkkosivustoa tekevät sen täydellisesti.

Mitä ominaisuuksia käytät omalla verkkosivustollasi?

Kim Martin
Kim Martin Administrator
Sorry! The Author has not filled his profile.
follow me