18 llocs de comerç electrònic amb disseny impecable UX (i 3 grans noms que xuclen)

Si ens vau incorporar per al nostre article sobre UX a principis d’aquest mes, sabreu que hem discutit els 25 elements essencials de disseny d’UX per al vostre lloc web..


La idea bàsica és la següent: el disseny UX consisteix a posar-se al cap del vostre visitant. Es tracta de crear una experiència senzilla, perfecta i agradable per als usuaris. La idea és proporcionar informació ràpidament i fins i tot fer-los somriure.

Un bon disseny UX produeix dopamina i felicitat als vostres visitants. I això els fa més propensos a confiar en vosaltres. De manera crucial, els fa més propensos a comprar.

Després de superar els 25 conceptes bàsics del nostre darrer article sobre disseny de UX, fem un cop d’ull a com funciona. Concretament, estem mirant el disseny UX de llocs web de comerç electrònic.

Com fan que aquests llocs web utilitzin hàbils trucs de disseny d’UX per animar els visitants a comprar?

1. Asos

Utilitzo molt l’exemple d’Asos, però hi ha una bona raó. El seu disseny UX és brillant.

Tot comença amb una proposta de valor eliminatòria. Una gran imatge, un simple explicador, la garantia de “lliurament gratuït” i les obvies crides a l’acció dirigint-vos a la secció d’homes o dones..

asos2

Una de les seves funcions més destacades UX és la passarel·la del vídeo, de manera que els visitants poden veure com és un vestit. Ofereix als clients la millor visió possible dels articles i els confia per comprar.

També tenen una excel·lent nova funció anomenada “vista ràpida”. A la pàgina de productes, feu clic a “Vista ràpida” i apareix una petita finestra emergent amb imatges addicionals i tota la informació que necessiteu. Estalvia al client clicant cap enrere i cap a les pàgines diferents. Disseny senzill i intuïtiu.

asos

2. Zara

El lloc web de Zara és una masterclass en simplicitat. Net, intuïtiu i limitat. És una oda a la llei de Hick: un principi de disseny que limita l’elecció de la navegació i que ofereix a l’usuari opcions clares, però restringides.

La idea és que massa opcions aclaparen al vostre visitant. Al oferir menys opcions, se senten més segurs. Veurem una navegació més excel·lent en aquesta publicació, però Zara és una de les millors.

zara

3. Abof

Abof (Tot sobre la moda) utilitza un truc UX desenvolupant del seu lloc web. Vés a la pàgina principal i no sembla un lloc tradicional de comerç electrònic. En canvi, s’assembla més a un bloc. Està ple de contingut suculent que inspira al seu públic.

abof

Dins de les seves històries i articles, destaquen la roba en una secció destacada anomenada “Comprar la història”. Al nostre article anterior sobre UX, vam parlar de la importància de crear una relació amb el públic. Abof ho fa perfectament amb històries i contingut relatables.

abof 2

Només una vegada inspirat el client, intenten vendre alguna cosa.

A la pàgina de productes, tenen notes útils de “consells sobre l’estil”, que són exemples perfectes de “microinteraccions”: petites nuggets que permeten arribar i atraure al vostre públic.

abof 3

Observeu que també tenen una “guia de mida” per ajudar els clients a fer les mesures exactes correctes (la por a la roba que no s’adeqüi és una de les raons més importants per les quals abandonem els carretons de la compra). També utilitzen una secció “lliurament estimat” per proporcionar encara més informació als clients.

4. Berghaus

Berghaus és una marca de roba per a exteriors, però sabràs que al primer segon del desembarcament al seu lloc.

berghaus

Aquesta és una marca que entén íntimament el seu públic objectiu i s’assegura de connectar-se amb ells el més ràpidament possible. El primer tret d’heroi és una invitació inspiradora. Es connecta amb la comunitat i t’atrapa.

L’únic inconvenient? Una crida més forta a l’acció realment segellaria l’acord aquí.

5. Poma

Vostè espera que una empresa que posa el disseny i la innovació en el seu cor excel·lent en el disseny d’UX, i que ho facin. Consulteu les pàgines de productes per començar.

Utilitzen el desplaçament de paralaxis per fer dinàmiques les imatges, atraient l’usuari i eliminant els punts de sortida. Ets immers en el món d’Apple.

Captura de pantalla 2016-07-28 a les 8.43.00 AM

Les animacions intel·ligents us mostren exactament el funcionament dels productes, com el nou toc 3D. Les galeries de desplaçament us conviden a interactuar i explorar, i una còpia intel·ligent us indica exactament com millorarà la vostra vida el nou iPhone (més que una llarga llista de funcions).

La seva navegació és senzilla i neta, i m’encanta l’ús d’imatges per diferenciar encara més les opcions (escanejem la web, de manera que les paraules tenen el costum de barrejar-se les unes amb les altres)

poma 2

Durant el procés de facturació, us donen l’opció de xerrar amb un especialista durant la compra. És un truc senzill però útil. Dóna ajuda als novells per ajudar a la línia, però no impedeix que els compradors segurs puguin treure la targeta de crèdit.

6. Bellroy

Com a venedor de comerç electrònic relativament nou, la vostra primera tasca és mostrar als clients la diferència de tots els altres. Bellroy ho fa perfectament amb la seva gamma de carteres compactes i primes.

bellroy 3

Millor encara, a les seves pàgines de productes, cada cartera té el seu propi vídeo, on es mostra als clients totes les funcions úniques.

bellroy 4

7. Lloga la pista

Rent The Runway té un concepte prou únic: es presta un vestit o un vestit durant uns dies, en lloc de comprar-lo. Això és fantàstic per a casaments o esdeveniments en què no vulgueu obsequiar-vos amb un vestit que mai no podreu tornar a portar.

El lloc web introdueix el concepte de manera senzilla i, a continuació, convida a la interacció dels usuaris, fet que els demana que triïn l’ocasió.

lloguer de pista

Marques addicionals també per al seu calendari d’entrega, permetent als clients saber exactament quan arribarà el vestit i quan haurà de ser retornat.

lloguer de pista 2

Tan senzill, però tan tranquil·litzador.

8. Amazon

Amazon és el lloc web de comerç electrònic més gran del món i, francament, un dels millors. Podeu triar qualsevol de les seves funcions com a exemple de disseny d’UX.

Des dels seus paquets intel·ligents fins a les recomanacions dels seus clients, anticipen les necessitats dels usuaris i n’ofereixen. Tot i això, és el seu sistema de comandes d’un clic que destacem avui.

amazon

No deixa de ser el millor exemple d’eficiència de revisió al web. El disseny fonamental del comerç de comerç electrònic és el procés de compra i check-out. Com més suau millor. I no resulta més suau que la comanda d’un clic!

9. Pasturar

Una imatge que t’explica tot el que has de saber. Redacció i disseny amb personalitat. Un descompte immediat per als usuaris nous i una crida a l’acció àmplia i atrevida.

pasturar

Es tracta d’una senzilla masterclass en disseny d’UX.

10. TopShop

Les botigues que venen molts productes tenen un treball molt més difícil quan es tracta de disseny d’UX. Com s’organitzen cada parella de texans diferents i els presenta?

Per sort, TopShop té un gran pla. Amb un marc de filtre fort i gran que flueix amb la pàgina, podeu ajustar i canviar l’estil, el color, l’ajust i el preu dels vostres productes de forma constant..

Topshop 2

Encara més fresc, tots els productes canvien a una imatge del model que els porta quan passa el ratolí amb el ratolí. Afavoreix la interacció i permet als clients un millor aspecte dels articles.

11. Protesta

La protesta pot tenir només la navegació més grossa i grassa a la xarxa.

Pàg

Està clar, succí i no destrossat. També redueix la possibilitat que el client es desvangui. El color blau manté l’atenció del client allà on el desitgi.

Protest també utilitza diverses animacions minúscules a tot el lloc. Cadascun s’activa quan es desplaça per sobre. Manté l’atenció al client, fomenta la interacció i fa que tot el lloc se senti dinàmic.

12. New Look

New Look aconsegueix un lloc a la llista per a la seva cistella innovadora. Es troba en tot moment a la barra de navegació amb un indicador en negreta per recordar-vos que hi és.

New Look 2

Quan hi feu clic, no us arrossegarà cap a una pàgina diferent. En lloc d’això, obteniu un tauler lliscant que es desplaça cap al costat per mostrar-vos què hi ha a la bossa. Significa que els clients no es perden mai i poden fer la teva comanda sempre que vulguin.

Nou estil

13. Llapis, per 53

Si voleu vendre un bolígraf gairebé 60 dòlars, haureu de vendre realment! Afortunadament, el “Llapis”, de 53 anys, fa un treball excel·lent amb diversos trucs de disseny d’UX.

Utilitzen una pàgina de desplaçament paral·lela llarga per explicar totes les funcions i mostrar-vos exactament què podeu fer amb ella.

llapis 2

També aprofiten els comentaris excel·lents per explicar per què són molt millors que les altres opcions que hi ha. Utilitzar una cotització de “Wired” és un truc brillant per donar credibilitat al producte i perfilar els seus beneficis.

Llapis

14. Granja

Al nostre darrer article sobre disseny d’UX, vam explicar quina importància és empatitzar amb el vostre públic objectiu i connectar-vos amb ells. Farmdrop ho fa posant la seva declaració de missió al davant i al centre.

granja

Estan “malalts i cansats de veure menjar proveït de quilòmetres de distància”. Això és el que poden accedir a la majoria de clients. Abans que intentin vendre-vos res, es connecten amb vosaltres i us donen una raó per comprar.

15. Sid Mashburn

Simplement un altre menú desplegable excel·lent, completat amb petites icones. És un truc senzill que ens ajuda a donar sentit a un menú extens. A més, proporciona personalitat una mica més al lloc web.

icones

16. Rellotges lents

Aquest és un rellotge amb una sola mà. Es tracta d’un concepte força únic, de manera que cal tenir algunes explicacions. Slow Watches ho fa molt bé amb un vídeo explicatiu de pantalla completa.

rellotges lents

A més d’explicar el concepte, també parlen a través de la seva filosofia darrere de crear-lo (ideal per connectar-se amb el client), i utilitzen belles imatges que ressalten i orienten el seu públic ideal.

17. Llar de foc

Quan els vostres articles no entren en categories normals, sigueu creatius! Firebox està especialitzat en regals inusuals i articles irreverents. El seu top 50 top és la forma perfecta d’explorar els productes més populars.

imatges

El disseny de la caixa és ideal per navegar ràpidament per productes i moltes de les imatges són dinàmiques, en moviment i interactuen amb el client.

Com que s’especialitzen en regals, també tenen un “cercador de regals” a la barra de navegació, una manera fantàstica per restringir les opcions.

18. Lazy Oaf

Les compres en línia solen sentir-se bastant iguals, i molts es perdran l’antic procés de trepitjar una revista o catàleg.

Lazy Oaf torna a portar-ho amb la seva secció “llibres de llibres”. En lloc de posar-se la roba de una en una, es mostren els vestits en diverses combinacions alhora. Al cap i a la fi, així és com solien mirar en un catàleg.

mandrós mandrós

Feu clic a les imatges i obtindreu un quadre de compra ràpida per triar cadascun dels tres elements que es mostren. És una manera més antiga i immersiva de fer compres.

Què no fer!

No ens agrada divulgar altres llocs web a trossos, però hi ha alguns grans noms que no ho fan bé … Aquí hi ha un o dos dels pitjors infractors..

1. Casa de Fraser

Són un dels grans magatzems del món, però cometen un error enorme tan aviat com carregueu el lloc web.

Immediatament, tindreu la impressió amb una llista emergent de pàgina completa que us demana que us subscriviu al butlletí.

Hourse de Fraser

Tot i que són una gran botiga de noms, és una tàctica molt empenta que posarà la majoria dels compradors. Recordeu, aquesta és la primera impressió. És molt millor crear un viatge d’usuari que eduqui i inspiri al vostre visitant abans de demanar una adreça de correu electrònic.

No només això, però no hi ha un incentiu real per inscriure’s al seu butlletí. Un descompte del codi de vals seria una opció fantàstica aquí i podria ajudar els clients a perdonar la finestra emergent.

2. Wal Mart

Wal Mart té un repte dur. Venen pràcticament tot, i així com es tracta de categoritzar-lo i de fer-lo senzill? Bé, no estic segur … però no així …

mur mart

Malauradament, això és només un embolic de categories que és gairebé impossible trobar el que buscaves.

Simplement hi ha massa informació. Quan es presenta als usuaris amb massa opcions, sovint només es fan pànics i se’n van.

3. Ray-Ban

Es tracta d’una opció lleugerament mitjana, ja que la majoria del lloc web de Ray-Ban és molt fàcil d’utilitzar. De fet, té un munt de funcions excel·lents.

Tanmateix, fan alguna cosa que fan molts llocs de comerç electrònic que molesten realment els clients. Això:

Ray Ban

Probablement heu vist una pàgina com cent vegades. No sembla tan dolent, però en realitat crea una barrera més per a la venda.

Si sou un client retornant, ara us preguntareu quina contrasenya heu creat. Si no ho podeu recordar, haureu de passar per tot el procés de “contrasenya oblidada”. Podríeu perdre aquell client en qualsevol moment …

Si sou un client nou, segur que hi ha una revisió de convidats, segur, però tot el que heu fet és donar-los un altre botó per fer clic. Una altra oportunitat de fer clic fora.

En aquest moment, el vostre client es desconnecta completament del seu carretó i del procés de compra. No el traieu, només bloquegeu la venda!

El disseny excel·lent d’UX és dels petits ajustaments que faciliten les coses als vostres clients. Aquests 18 llocs web ho fan perfectament.

Quines funcions utilitzareu al vostre propi lloc web?

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