La guida definitiva alla progettazione di siti Web di e-commerce

Le vendite di eCommerce negli Stati Uniti continuano a raggiungere nuove vette nel 2018. In tutto il mondo, l'eCommerce continuerà a registrare solidi guadagni per un importo di $ 2,3 trilioni. Ma cosa fa trionfare un sito di eCommerce su un altro?

Diversi fattori determinano il successo generale di un sito Web di eCommerce, tra cui la qualità del prodotto, il riconoscimento del marchio, i costi di spedizione, le politiche di restituzione, l'affidabilità e il servizio clienti. Tuttavia, un'attenta progettazione dell'esperienza utente è anche la chiave per fornire ai clienti un'esperienza soddisfacente e senza attriti. Non solo convertirà potenziali clic in effettive transazioni di eCommerce, ma farà tornare i clienti più e più volte.

Ecco una guida completa alla progettazione di eCommerce UX per creare fantastici siti Web di eCommerce, completa di esempi.

Progetta eCommerce per fiducia e sicurezza

Innanzitutto, è importante progettare un sito Web di cui gli acquirenti sentano di potersi fidare. La maggior parte degli acquirenti è preoccupata per la privacy e se il sito proteggerà i propri dati personali fornendo una transazione sicura. Se il sito web non si sente affidabile, sceglieranno semplicemente di fare acquisti altrove.

Ecco alcuni metodi che comunicheranno l'affidabilità:

• Includere una panoramica dell'attività:

  • Fornire informazioni generali
  • Fotografie di persone dietro l'azienda
  • Informazioni sui contatti
  • Collegamenti ai social media
  • Una pagina delle domande frequenti (FAQ).

• Pubblica le politiche del negozio e assicurati che non siano troppo difficili da trovare:

  • Politiche di spedizione e restituzione
  • Descrivi la procedura di reso e quali prodotti possono essere restituiti
  • Fornire un facile accesso a una politica sulla privacy che copre le informazioni personali e finanziarie degli acquirenti (questo è fondamentale)

Scrivi in ​​un linguaggio semplice ed evita il gergo legale o politico interno.

• Condividi le recensioni dei prodotti. Fornire recensioni sui prodotti per aiutare gli acquirenti a capire di più sul prodotto; questo aiuterà ad alleviare eventuali preoccupazioni che potrebbero avere e fornirà un'ottima UX di eCommerce. Fai un ulteriore passo avanti offrendo recensioni di prodotti insieme a informazioni aggiuntive sui revisori o riassumendo le recensioni. Questo passaggio può aiutare gli acquirenti a ottenere il massimo vantaggio dalle opinioni degli altri.
• Usa un server sicuro. Gli acquirenti si aspettano che le loro informazioni personali rimarranno al sicuro durante l'acquisto online. I certificati SSL (Secure Sockets Layer) autenticano l'identità di un sito Web e crittografano le informazioni che devono rimanere al sicuro. È un segno essenziale che indica che le casse sono sicure. Assicura agli acquirenti che i loro dati sono protetti implementando SSL e visualizzando i badge dei certificati SSL.

• Aggiungi sigilli di fiducia riconosciuti. Un sigillo di fiducia verifica la legittimità e la sicurezza di un sito web. Alcune società fiduciarie aggiungono anche un ulteriore livello di protezione offrendo un'assicurazione se la transazione si rivela fraudolenta. L'uso di sigilli di fiducia riconosciuti assicura ai potenziali acquirenti un processo di transazione sicuro, che porta a un aumento delle vendite e fornisce una migliore esperienza utente di eCommerce.
• Mostra attenzione ai dettagli. Rendi il sito Web legittimo e professionale evitando errori di battitura, immagini mancanti, collegamenti interrotti, errori 404 (pagina non trovata) o altri errori che uccidono l'esperienza utente dell'eCommerce.

Considerazioni sulla progettazione dell'interfaccia utente di eCommerce

L'aspetto grafico di un sito Web è il principale motore delle prime impressioni. La ricerca conclude che le persone determineranno se gli piace o meno un sito Web in soli 50 millisecondi.

Ecco alcuni suggerimenti essenziali per la progettazione dell'interfaccia utente:

• Segui l'identità del marchio. Il marchio dovrebbe essere evidente in tutto il sito web. Scegli i colori che rispecchiano il marchio e imposta lo stile in modo da chiarire che tipo di prodotti vengono venduti. Assicurati che l'esperienza del marchio sia coerente su tutti i canali: online, in negozio o su un dispositivo mobile. Ciò contribuirà a costruire un forte rapporto marchio-cliente.
• Adotta la gerarchia visiva. Il contenuto più critico dovrebbe essere visualizzato above the fold. In alcuni casi, utilizzare meno spazio bianco per avvicinare gli elementi è meglio che spingere i contenuti critici sotto la piega.
• Non esagerare con il design. Limita i formati dei caratteri come il carattere, le dimensioni e i colori. Quando il testo assomiglia troppo alla grafica, verrà scambiato per un annuncio. Usa testo e colori di sfondo ad alto contrasto per rendere il contenuto il più chiaro possibile.
• Attenersi ai simboli conosciuti. Utilizzare icone o simboli facili da identificare. Icone sconosciute confonderanno solo gli acquirenti. Un buon modo per evitare ogni possibile confusione è fornire etichette per le icone.
• Evita le finestre popup. Le finestre popup sono una distrazione. Anche se contengono informazioni preziose, è più che probabile che gli acquirenti le licenzino immediatamente: una volta che se ne sono andati, anche se lo desiderano, è difficile per gli acquirenti ritrovare le informazioni.

L'importanza della navigazione del sito eCommerce senza attriti

Senza attrito è il modo di essere. La navigazione riguarda quanto sia facile per le persone spostarsi all'interno del sito Web, trovare ciò che stanno cercando e infine agire. L'esperienza di acquisto eCommerce dovrebbe essere perfetta in modo che gli acquirenti non abbandonino a metà del processo.

Alcuni aspetti chiave dellaprogettazione di siti Web di eCommerce per una facile navigazione includono:

Categorie di prodotti ben definite

Il livello superiore di navigazione dovrebbe mostrare l'insieme di categorie offerte dal sito. Raggruppa i prodotti in categorie e sottocategorie che hanno senso. Le etichette delle categorie funzionano meglio come singole parole che descrivono la gamma di prodotti, in modo che gli acquirenti possano esaminarle e capire immediatamente cosa rappresentano. È meglio testare il più possibile la navigazione del sito da parte dell'utente per un'esperienza utente di e-commerce eccezionale in quanto è una caratteristica fondamentale del sito.

Ricerca prodotti

In poche parole, se gli acquirenti non riescono a trovare il prodotto, non possono acquistarlo: crea una funzione di ricerca che li aiuti a trovare facilmente ciò che stanno cercando:

• Rendi la ricerca onnipresente. Metti la casella di ricerca su ogni pagina e in luoghi familiari. La scatola dovrebbe essere visibile, rapidamente riconoscibile e facile da usare. Le posizioni standard per implementare la casella di ricerca sono in alto a destra o in alto al centro delle pagine o nel menu principale.
• Supporta tutti i tipi di query. Le ricerche devono supportare tutti i tipi di query come nomi di prodotti, categorie e attributi di prodotti, nonché informazioni relative al servizio clienti. È buona norma inserire nel campo di input una query di ricerca di esempio per suggerire agli acquirenti l'utilizzo delle varie funzioni.
• Avere una funzionalità di completamento automatico della ricerca. La funzionalità di completamento automatico rende più facile per gli acquirenti trovare ciò che stanno cercando e aumenta il potenziale di vendita suggerendo cose all'interno dell'area che stanno già cercando.
• Consenti l'ordinamento e il filtraggio dei risultati. Consenti agli acquirenti di ordinare i risultati della ricerca in base a vari criteri (migliori venditori, prezzo più alto o più basso, valutazione del prodotto, articolo più recente, ecc.), nonché di eliminare gli articoli che non rientrano in una determinata categoria.

Prodotti filtranti

Più scelte vengono date, più difficile è scegliere. Aiuta gli acquirenti a trovare i prodotti giusti implementando i filtri. Li aiuterà a restringere le loro scelte e passare direttamente alla gamma di prodotti desiderati.

Visualizzazione rapida del prodotto

Una "visualizzazione rapida" riduce il tempo necessario agli acquirenti per trovare il prodotto giusto eliminando i caricamenti di pagina non necessari. In genere, i dettagli del prodotto vengono visualizzati in una finestra modale sopra la pagina visualizzata. Non cercare di mostrare tutti i dettagli del prodotto, ma includi un collegamento alla pagina completa del prodotto per visualizzare i dettagli completi. Inoltre, assicurati di includere un pulsante "Aggiungi al carrello" posizionato in modo ben visibile e una funzionalità "Salva nella lista dei desideri".

Offerte speciali

Gli acquirenti cercano sempre offerte speciali, sconti o migliori offerte. Rendi visibili le offerte esclusive in modo che gli acquirenti ne siano a conoscenza. Anche se le differenze di prezzo non sono così grandi, il senso psicologico di risparmiare un po' di soldi crea l'illusione di avere un sopravvento.

Progettazione della pagina del prodotto e-commerce

Per un'esperienza utente di eCommerce eccezionale quando gli acquirenti trovano con successo il prodotto che desiderano, lascia che scoprano il prodotto. Progetta una pagina del prodotto che crei un'esperienza il più possibile simile a un'esperienza di acquisto di persona, includendo molte immagini, descrizioni dettagliate e qualsiasi altra informazione utile e correlata al prodotto. Diamo uno sguardo approfondito a cosa significa.

Fornisci fantastiche immagini del prodotto

Con l'eCommerce, gli acquirenti non possono toccare, sentire o provare il prodotto. Invece, tutto dipende da ciò che vedono online. Questo è il motivo per cui è fondamentale fornire immagini del prodotto che mostrino chiaramente tutti gli aspetti del prodotto. Ecco una lista di controllo per immagini perfette del prodotto:

• Usa uno sfondo bianco. Lo sfondo delle immagini dei prodotti non deve distrarre o entrare in conflitto con il prodotto stesso. Uno sfondo bianco funziona meglio perché consente al prodotto di risaltare e funziona con quasi tutti gli stili o combinazioni di colori.
• Usa immagini grandi e di alta qualità. Le buone immagini vendono il prodotto. Immagini di alta qualità catturano l'interesse degli acquirenti e mostrano loro esattamente cosa stanno acquistando. Avere immagini di grandi dimensioni consente agli acquirenti di ingrandire ed esaminare un prodotto nei minimi dettagli.

• Usa una varietà di immagini. Visualizza il prodotto da diverse angolazioni e includi primi piani per fornire un'idea più completa del prodotto. Una vista a 360 gradi, in cui possono spostare il prodotto, è un buon modo per fornire un'esperienza simile all'entrare fisicamente nel negozio e al coinvolgimento con esso. L'eCommerce VR è la prossima ondata di questa esperienza.
• Usa video. I video hanno la capacità di fornire molte informazioni in un breve lasso di tempo. Utilizzare un video per mostrare il prodotto in uso e per fornire quante più informazioni funzionali possibili.
• Sii coerente. Utilizza immagini coerenti su più pagine e che siano anche in linea con l'aspetto grafico del resto del sito web. Ciò manterrà tutto pulito e ordinato. L'immagine principale del prodotto dovrebbe essere la stessa in tutte le aree del sito, come i punti salienti del prodotto o nella sezione degli articoli in primo piano.

Fornisci la giusta quantità di informazioni sul prodotto

Fornisci agli acquirenti informazioni dettagliate sul prodotto in modo che possano prendere una decisione di acquisto informata. Mostra disponibilità, opzioni per taglie o colori diversi, dimensioni, tabella taglie, materiali utilizzati, costo totale, garanzie e altro ancora. Meno domande rimanenti hanno su un prodotto, più è probabile che effettuino un acquisto.

Impiega un design persuasivo

Secondo il principio di scarsità, gli esseri umani attribuiscono un valore più alto a un oggetto che è scarso e un valore inferiore a quelli che sono abbondanti. Crea un senso di urgenza nel processo di vendita mostrando la scarsità: mostra quanti prodotti sono rimasti, le taglie in grigio che sono esaurite o mostra le scadenze di vendita. La scarsità motiverà i potenziali acquirenti ad agire.

Sempre più spesso, le aziende utilizzano la ricerca psicologica avanzata e, al fine di aumentare il coinvolgimento e gli acquisti, hanno trasformato quella che era un'arte in una scienza. Il design persuasivo nell'eCommerce è un modo molto efficace per ottenere più acquisti.

Mostra prodotti correlati e consigliati

Mostra prodotti simili che potrebbero piacere anche agli acquirenti e che funzionano bene con il prodotto corrente o con i prodotti acquistati da altri. Questo può essere visualizzato nella pagina dei dettagli di un prodotto o nel carrello degli acquisti e aiuterà a guidare gli acquirenti verso i prodotti che soddisfano le loro esigenze, incoraggiandoli potenzialmente a continuare gli acquisti, un ottimo modo per effettuare il cross-sell di prodotti correlati.

Design del carrello della spesa

Il carrello è essenziale in quanto è il luogo in cui gli acquirenti esaminano i prodotti selezionati, prendono la decisione finale e procedono al pagamento. L'obiettivo principale del carrello è guidare gli acquirenti alla cassa. Di seguito sono riportati suggerimenti su come progettare un carrello della spesa che sia intuitivo e incoraggerà gli acquirenti ad acquistare ulteriormente.

• Utilizzare un chiaro invito all'azione (CTA). L'invito all'azione principale nella pagina del carrello degli acquisti dovrebbe essere il pulsante di pagamento. Usa colori vivaci, numerose aree cliccabili e un linguaggio semplice per rendere il pulsante di pagamento visibile, diretto e facile da usare.
• Fornire un feedback adeguato. Assicurati che quando un prodotto viene aggiunto al carrello sia immediatamente e chiaramente confermato. Gli acquirenti vengono confusi da un feedback inadeguato, ad esempio mostrando un testo di conferma poco appariscente. Una buona idea è usare le animazioni, poiché il movimento attira l'occhio umano.
• Usa un widget mini carrello. Consenti agli acquirenti di aggiungere prodotti al carrello senza uscire dalla pagina in cui si trovano, utilizzando un mini carrello. Consente inoltre loro di navigare, scoprire e aggiungere altri prodotti. I widget del mini carrello devono sempre essere collegati al carrello degli acquisti a pagina intera.

• Visualizza i dettagli del prodotto. La visualizzazione di dettagli come nomi di prodotti, immagini, dimensioni, colori e prezzi nel carrello aiuta gli acquirenti a ricordare ogni prodotto e a confrontare i prodotti. Collega i prodotti nel carrello alle loro pagine di prodotto complete, in modo che gli acquirenti possano rivedere maggiori dettagli quando necessario.
• Rendi il carrello facilmente modificabile. La possibilità di rimuovere, salvare per dopo o modificare dettagli come dimensioni, colore o quantità dovrebbe essere di facile accesso.
• Evita la sorpresa di costi di spedizione e tasse imprevisti. I costi di spedizione imprevisti sono uno dei motivi principali per cui gli acquirenti abbandonano il carrello. Inserisci le opzioni di spedizione e le tasse con un calcolo preciso dei costi e una data di consegna prevista in anticipo.

Progettazione di cassa e-commerce

Un design elegante e alla moda non determina un sito di eCommerce di successo né fornisce necessariamente un'ottima UX di eCommerce. Il successo dell'eCommerce si misura solo dal numero di acquisti completati. Ecco alcuni modi per creare una pagina di pagamento ben progettata, che contribuirà a una conversione di successo:

• Offri varie opzioni di pagamento. Acquirenti diversi hanno preferenze diverse quando si tratta di effettuare pagamenti. Soddisfa il maggior numero possibile di opzioni di pagamento (a seconda del pubblico di destinazione) per espandere la base di clienti e consentire agli acquirenti di completare facilmente il loro ordine.
• Mantieni la semplicità. Riduci al minimo il numero di campi e passaggi per completare l'acquisto. L'utilizzo dell'indirizzo di spedizione come indirizzo di fatturazione per impostazione predefinita è un buon modo per ridurre al minimo il numero di campi: idealmente, progettare una singola pagina di pagamento in cui gli acquirenti possono visualizzare il carrello e inserire le informazioni di consegna e pagamento.

• Rendi la registrazione facoltativa. Forzare gli acquirenti a creare un account prima del loro primo acquisto allontanerà gli acquirenti. Offri loro la possibilità di registrarsi al termine dell'acquisto ed evidenzia i vantaggi della registrazione quando chiedi loro di registrarsi. I vantaggi includono un checkout più rapido grazie a informazioni personali come l'indirizzo di spedizione salvato o le informazioni di pagamento e l'accesso a offerte esclusive disponibili solo per i membri registrati.
• Utilizzare chiare indicazioni di errore. Non c'è niente di più frustrante che non essere in grado di effettuare un acquisto o capire perché. Invece di mostrare gli errori dopo l'invio di un modulo, fai in modo che le notifiche di errore vengano visualizzate in tempo reale. Inserisci messaggi di errore chiari e concisi direttamente sopra o accanto all'articolo che richiede la correzione, in modo che gli acquirenti li notino e li capiscano.

• Tieni le persone in carreggiata. Quando utilizzi un checkout su più pagine, includi una barra di avanzamento che mostra quanti passaggi mancano per completare l'acquisto. Ciò eliminerà qualsiasi ambiguità e assicurerà agli acquirenti che sono sulla strada giusta. Al termine dell'acquisto, visualizzare una conferma d'ordine e lo stato dell'ordine con il monitoraggio della spedizione.
• Offri supporto. Includi una chat dal vivo o un numero di contatto durante il processo di pagamento, così quando gli acquirenti hanno domande, possono ottenere rapidamente risposte piuttosto che dover lasciare il sito e andare altrove.

Sommario

Gli acquirenti online si aspettano esperienze senza attriti, qualunque cosa accada. Quando si progetta un sito di eCommerce, non si tratta solo di creare un sito Web, ma di creare un'esperienza di acquisto online che converta gli acquirenti passivi in ​​clienti paganti.

Si spera che questa guida allaprogettazione di siti Web di eCommerce ti aiuti a prendere decisioni di progettazione essenziali al fine di creare un'esperienza utente di eCommerce eccezionale che sia professionale, attraente, facile da usare e che faccia tornare gli acquirenti più e più volte. La rapida crescita e la quota di mercato relativamente bassa significano che c'è ancora un'enorme opportunità per i nuovi attori di superare i leader del settore tradizionale.

Ulteriori letture sul blog di Toptal Design:

• eCommerce UX - Strategie e principi di progettazione essenziali
• UX di eCommerce per l'esperienza mobile
• Come agganciare gli acquirenti di eCommerce tramite UX Design
• eCommerce ridisegnato: come modifiche minori hanno apportato importanti miglioramenti alla UX