E-commerce con Next.js per Bevy, l’azienda green di bevande a domicilio .

CLIENTE

Bevi Friendly Technologies S.r.l. si posiziona come un'innovativa piattaforma di consegna a domicilio di Milano specializzata nella distribuzione di bevande, prodotti per la persona e per la casa, con un forte impegno verso la sostenibilità ambientale. Attraverso il sito web www.bevy-express.com, l’azienda offre una vasta gamma di prodotti, in vetro e PET. Sugli ordini non ci sono limiti né di peso, né di quantità e la consegna viene effettuata sempre al piano, anche in giornata, in fasce orarie da due ore.
Un aspetto distintivo dell’azienda è la sua filosofia del "vuoto a rendere": le bottiglie possono essere riutilizzate fino a 50 volte, riducendo significativamente l'impatto ambientale. Il ritiro dei recipienti vuoti viene gestito direttamente durante la consegna del prossimo ordine, semplificando il processo per i clienti e promuovendo pratiche di consumo responsabile.

Il modello di business di Bevy è basato su facilità d'uso e convenienza, permettendo ai clienti di ordinare online e ricevere le loro bevande entro poche ore, scegliendo la fascia oraria di consegna che meglio si adatta alle loro esigenze. Questo approccio, unito all’impegno verso la sostenibilità, rende l’azienda il partner ideale per chi cerca non solo comodità ma anche un'opzione più ecologica per l'acquisto di bevande.

OBIETTIVO

Sostituire l’attuale sito e-Commerce, realizzato su Shopify, con una nuova soluzione personalizzata composta da un back-end realizzato con il CMS Magento, sviluppato internamente dall’azienda, e un front-end completamente disaccoppiato, realizzato con Next.js, oggetto della nostra collaborazione.
 

grafica next js

Esperienza di acquisto innovativa e funzionalità avanzate

La user interface del sito doveva essere ricostruita in modo assolutamente fedele a quella del precedente sito web. L’esperienza di acquisto doveva riproporre le medesime funzionalità avanzate del precedente backend di Bevy, quali:

  • la gestione degli ordini e la funzionalità “ordina di nuovo”
  • il tracciamento delle consegne
  • il monitoraggio delle scorte
  • il sistema di vuoto a rendere

La sfida consisteva nell'integrare queste componenti in modo fluido, assicurando che le modifiche apportate al front-end rispecchiassero accuratamente la logica e le capacità del sistema backend esistente, senza compromettere la velocità o la sicurezza del sito.
In aggiunta, l'obiettivo includeva l'implementazione di un sistema di personalizzazione per gli utenti, consentendo loro di ricevere dei prodotti consigliati sulla base di preferenze e di acquisti precedenti, migliorando così l'engagement e la fidelizzazione del cliente.

 

Il ruolo di Next.js nello sviluppo della piattaforma

funzionalità bevy
 

Abbiamo utilizzato Next.js per lo sviluppo del front-end del nuovo sito e-Commerce. Questo framework, che si basa su React, è stato selezionato per diversi motivi chiave che si allineano perfettamente con le esigenze del progetto, inclusi miglioramenti della performance, ottimizzazione per i motori di ricerca (SEO), e la capacità di creare esperienze utente (UX) dinamiche e interattive.

Ecco i motivi per cui è stato scelto Next.js:

  • Server-Side Rendering (SSR) e Static Site Generation (SSG): il framework offre flessibilità nel rendering delle pagine, permettendo sia SSR che SSG. Questo consente di ottimizzare il caricamento dal punto di vista della velocità ed efficienza, migliorando la visibilità sui motori di ricerca e garantendo un'esperienza utente fluida, anche con una connessione internet lenta.
  • Scalabilità: Il sito di Bevy può facilmente scalare per gestire un aumento del traffico, mantenendo alte prestazioni senza compromettere la velocità o la qualità dell'esperienza utente. Questo è fondamentale per una piattaforma e-Commerce in continua crescita.
  • Ottimizzazione SEO: Next.js assicura che i contenuti siano prontamente indicizzabili dai motori di ricerca. Essenziale per aumentare la visibilità online di Bevy e attrarre nuovi clienti.
  • Ecosistema e Supporto: La vasta comunità di sviluppatori e il sostegno continuo da parte di Vercel, l'azienda dietro il framework, assicura l’accesso a una vasta gamma di risorse, plugin, e integrazioni, facilitando lo sviluppo e la manutenzione del sito.

 

Sinergia tecnologica: Integrare Next.js, Magento e Algolia per rivoluzionare l'e-commerce

La sfida principale del progetto era integrare il frontend Next.js con il backend Magento esistente fornito dal cliente. Magento è una piattaforma e-commerce potente, responsabile della gestione di aspetti critici come l'inventario, la gestione degli ordini e la logistica. La nostra soluzione ha dovuto garantire una connessione fluida e affidabile, permettendo al sito di sfruttare le avanzate funzionalità dell’e-commerce con l'interfaccia utente moderna e reattiva fornita da Next.js.

Per realizzare questa integrazione, abbiamo adottato un approccio che prevede l'utilizzo di API RESTful di Magento per collegare i dati del backend con il frontend Next.js. Questo metodo assicura che tutte le interazioni tra il sito e il sistema di gestione degli ordini, l'inventario e la logistica siano sincronizzate in tempo reale, offrendo agli utenti una esperienza di acquisto senza interruzioni.

Per migliorare ulteriormente la user experience, è stata realizzata l’integrazione con Algolia, per fornire funzionalità di ricerca istantanea e personalizzata. La piattaforma di search e discovery, consente agli utenti di trovare rapidamente i prodotti che desiderano, con suggerimenti in tempo reale, filtraggio, e classificazione dei risultati di ricerca. Questa integrazione garantisce che gli utenti possano navigare facilmente nell'ampio catalogo di prodotti di Bevy, migliorando l'engagement e potenzialmente aumentando le conversioni.

In sintesi, la combinazione di Next.js, Magento, e Algolia fornisce una soluzione tecnologica completa che soddisfa le esigenze di business di Bevy, migliorando l'efficienza operativa, l'esperienza del cliente, e la visibilità del brand nel mercato digitale.


Sei alla ricerca di un partner tecnologico che comprenda le tue esigenze specifiche e sia capace di trasformarle in realtà digitale all'avanguardia? Sei nel posto giusto. 
Contattaci per scoprire come possiamo aiutarti a realizzare il tuo progetto.
 

 

Scopri i nostri lavori

Ascoltare le tue esigenze è il primo passo per comprendere un progetto. Il secondo? Lavorare insieme per dargli una forma! Scopri i nostri lavori.

Visita il nostro Portfolio