Mu Delivery fa parte del gruppo MU, composto da una costellazione di diversi ristoranti accomunati da un’unica filosofia: proporre una cucina pan-asiatica in grado di incontrare il gusto europeo.
Scontenti del sistema di delivery attuale, basato su una famosa applicazione, si sono rivolti a PaperPlane per la progettazione di un e-commerce di delivery completamente personalizzato basato su WooCommerce. Il risultato è un tema custom per WooCommerce, con alte funzionalità e prestazioni.
Richiesta
Evidenziare la qualità della proposta culinaria e raccontare la cura nel servizio.
Privilegiare la facilità d’uso e la velocità nell’ordinare.
Risultato
Un e-commerce funzionale completamente personalizzato che permette all’utente una navigazione senza stress mirata all’acquisto dei piatti di MU.
User Experience
Il cuore di un sito di delivery è la pagina Menu
La pagina menu e come vengono presentati i prodotti è determinante nell’esperienza di acquisto di un sito di delivery, dove l’utente sceglie per lo più dalla pagina di elenco, senza entrare nella pagina del singolo piatto.
Per questo motivo tutta l’esperienza utente è incentrata sulla possibilità di selezionare le categorie, i piatti e gli ingredienti da escludere nella stessa pagina e nello stesso momento, così da ridurre le distrazioni e muoversi velocemente verso lo step successivo, il pagamento del carrello.
Progettazione mobile first
Un sito responsive che guarda alle app di delivery internazionali
Un servizio di delivery vive sopratutto grazie ai dispositivi mobile. Per questo il nostro team si è concentrato nella progettazione di un’esperienza di navigazione più prossima possibile a quella di una app nativa.
Elemento guida per noi è stato ridurre il carico cognitivo dell’utente nel momento di selezione e aggiunta piatto al carrello.
Abbiamo ridotto il numero di click e diviso al meglio le possibili azioni per l’utente esplicitando le label con dei micro copy ad-hoc, così da non sovraccaricare l’attenzione dell’utente mentre sta compiendo le sue azioni.
Focus
Un flusso d’acquisto alternativo per la proposta di variazioni
La possibilità di personalizzare il piatto variando gli ingredienti doveva essere mantenuta, soprattutto per l’esclusione di allergeni, ma in un ristorante con una chef importante si è deciso di tenerla in secondo piano, fuori dal flusso principale, in modo da mantenere il flusso d’acquisto della maggioranza degli utenti snello. Le variazioni vengono quindi proposte con un micro-copy ad hoc direttamente nella pagina menu, con un’apertura a modal che consente una esperienza di scelta efficace e veloce.
Focus
Upselling in fase di vendita
Per soddisfare la richiesta del cliente di mettere in evidenza la cantina, si è progettato un “sommerlier virtuale”, ovvero un sistema di correlazione piatto – vino tramite il quale è possibile proporre all’utente degli abbinamenti personalizzati sulla base del suo ordine. L’esperienza di acquisto viene proposta direttamente in carrello senza abbandonare la pagina di riepilogo.
Per lanciare l’upselling, in particolare riguardante le proposte della cantina, si è anche progettato un sistema flessibile di sconti, che possono essere applicati al totale del carrello all’aggiunta di un vino.
Development
Un tema WooCommerce completamente customizzato
La progettazione dell’esperienza di acquisto di un sito di food delivery è resa possibile grazie alla competenze del team di sviluppo e ha richiesto un grande lavoro di personalizzazione delle funzionalità di WooCommerce.
Development
Gestione delle spedizioni in base al CAP
Una delle funzionalità principali di cui tenere conto è la necessità di poter gestire le consegne in modo capillare ma limitato ad una specifica area geografica basata su CAP con specifici costi di consegna, relativa scontistica e limitazioni per importo minimo di ordine. Per ottenere questo risultato ci siamo basati in parte sulle funzionalità native di WooCommerce, aggiungendo ad esse un sistema totalmente custom per richiedere al cliente all’inizio della sessione di navigazione il CAP e verificare se la zona è effettivamente servita dal servizio di delivery.
In caso di copertura durante il resto della navigazione al cliente viene indicato, in tempo reale, la spesa necessaria per annullare il costo di consegna ed eventuali limitazioni per importo minimo di ordine.
Development
Customizzazione Mini Cart
La progettazione della user experience durante il processo di acquisto è basata sulla pagina Menu dalla quale è possibile aggiungere i prodotti al carrello. È stato quindi necessario lavorare ad una personalizzazione completa del Mini Cart in modo da renderlo adatto a gestire e mostrare in tempo reale la quantità di ogni prodotto presente nel carrello, le promo e gli avvisi per annullare il costo di consegna ed eventuali limitazioni per importo minimo di ordine.
