E-commerce moda: tema Shopify personalizzato

Il contesto

Il cliente gestiva un e-commerce su WooCommerce con un tema acquistato anni prima, mai aggiornato in modo sostanziale. Il sito era lento su mobile (LCP sopra i 4 secondi), aveva un checkout frammentato e un tasso di abbandono carrello del 78%.

La decisione di migrare su Shopify era già presa quando sono stato coinvolto. Il mio lavoro era sviluppare un tema Liquid completamente personalizzato invece di acquistarne uno generico.

Approccio

Ho iniziato con un audit completo dell'analytics esistente: quali pagine perdevano più utenti, dove si bloccava il funnel di acquisto, quali categorie di prodotto performavano meglio. I dati mostravano un problema chiaro: il 74% del traffico veniva da mobile ma il tema precedente non era mai stato ottimizzato per schermi piccoli.

Ho costruito il tema partendo da mobile-first: ogni componente progettato prima per 375px, poi adattato ai breakpoint superiori. Il checkout è stato configurato per ridurre al minimo i campi e usare Shopify Pay per velocizzare il processo.

Ottimizzazioni tecniche

Per le performance ho lazy-loadato tutte le immagini prodotto con le dimensioni corrette per ogni viewport (Shopify CDN genera le varianti automaticamente). Il JavaScript è stato ridotto al minimo — nessun jQuery, logica scritta in vanilla JS dove necessario.

La scheda prodotto è stata ridisegnata con un focus sul social proof: recensioni visibili above the fold, badge di disponibilità limitata, gallery con zoom nativa.

Risultati

Nei tre mesi successivi al lancio il tasso di conversione è cresciuto del 22% rispetto al periodo equivalente dell'anno precedente. L'abbandono carrello è sceso dal 78% al 47%. Il Largest Contentful Paint su mobile è passato da 4.2s a 2.4s.