Real shipped codeE-commercePiano mensile

Checkout ricostruito da zero: carrelli abbandonati dimezzati in un mese.

Il 70% del traffico arrivava da mobile, ma il checkout era pensato per desktop e impiegava 6 secondi ad arrivare al pagamento. L'abbiamo riscritto mobile-first: -48% di abbandoni.

ClienteE-commerce D2C (placeholder)
RuoloProduct Engineer
Durata4 settimane
StackNext.js · Stripe · Shopify API
01 · Contesto

Un negozio che cresceva, un checkout che frenava.

Il cliente è un e-commerce D2C con un catalogo consolidato e campagne social che funzionavano: il traffico cresceva trimestre su trimestre, soprattutto da Instagram e TikTok, quindi da mobile.

Ma la crescita del traffico non si traduceva in ordini. Il carrello si riempiva, il checkout lo svuotava. Il tasso di abbandono al pagamento era il doppio del benchmark di settore.

02 · Problema

Un checkout desktop-first in un business mobile-first.

Ho instrumentato ogni step del checkout e registrato sessioni reali. Tre colli di bottiglia, tutti evitabili:

1

6 secondi per arrivare al form di pagamento. Il checkout caricava l'intero bundle del sito, più tre script di terze parti bloccanti, prima di mostrare qualsiasi cosa.

2

5 schermate, 23 campi, zero autofill. Su mobile significava minuti di digitazione. Ogni campo in più era una percentuale di utenti in meno.

3

Errori di rete = carrello perso. Su connessioni mobili instabili un timeout buttava via l'intero stato del checkout. L'utente ricominciava da capo. O più spesso, non ricominciava.

Funnel di checkout prima dell'intervento
Carrello
100%
Inizio checkout
64%
Dati di spedizione completati
38%
Pagamento completato
21%

Dati da tracking lato client su 30 giorni. (Numeri placeholder, da sostituire con i dati reali.)

03 · Risultati

I numeri, prima di tutto.

-0% carrelli abbandonati al checkout
1.2s dal tap sul carrello al form di pagamento
+0% conversione checkout da mobile
Prima / dopo l'intervento
Tempo al pagamento · prima
6s
Tempo al pagamento · dopo
1.2s
Campi da compilare · prima
23
Campi da compilare · dopo
7
04 · Soluzione

Una pagina, due tap, niente da perdere.

Invece di ottimizzare il checkout esistente, l'ho sostituito con un flusso nuovo e brutalmente ridotto: una sola pagina, progettata per il pollice, non per il mouse.

One-page checkout mobile-first. Un'unica schermata con i 7 campi davvero necessari, autofill nativo del browser e wallet (Apple Pay / Google Pay) come prima scelta: pagamento in 2 tap.

Stato persistente e offline-friendly. Ogni campo salvato localmente man mano: un timeout o un refresh non buttano via niente. Il carrello sopravvive alla metropolitana.

Payment element isolato dal resto del sito. Il checkout carica solo il codice che gli serve: 1.2 secondi al form di pagamento anche su rete 4G, misurati sul percentile 75.

🖥️ Screenshot del checkout one-page, da sostituire con immagine reale
05 · Sfide

Cosa poteva andare storto (e come l'abbiamo evitato).

Non puoi fermare la cassa di un negozio aperto. Il nuovo checkout è andato in produzione dietro feature flag, prima sul 10% del traffico mobile, con il vecchio flusso come fallback istantaneo. Nessun ordine perso durante la transizione.

Il secondo rischio era contabile: ogni modifica al checkout tocca pagamenti veri. Ogni release è stata accompagnata da riconciliazione automatica ordini-transazioni, così qualsiasi discrepanza sarebbe emersa in ore, non a fine mese.

06 · Prima / Dopo

Cosa è cambiato davvero.

Prima
Abbandono al checkout 79%
  • 5 schermate e 23 campi da compilare
  • 6 secondi di caricamento prima del form
  • Timeout di rete = carrello perso
  • Wallet mobile non supportati
Dopo
Abbandono al checkout 41%
  • Una pagina, 7 campi, autofill nativo
  • 1.2 secondi al form di pagamento
  • Stato persistente: niente si perde
  • Apple Pay e Google Pay in 2 tap
07 · Il cliente
Pensavamo servisse un redesign del sito. Omar ci ha mostrato che il problema era un imbuto rotto in fondo al funnel, e l'ha sistemato senza toccare il resto. Testimonial placeholder, da sostituire con quote reale.
GB
Nome Cognome Founder, Nome Brand

Il tuo checkout perde ordini?

Parliamone: 30 minuti per capire il problema e dirti onestamente se posso aiutarti.

Prenota una call di 30 min   Altri casi studio
Review gratuita del tuo prodotto.  Prenota 30 minuti →