Per Hostinato
Ho rifatto la home di Invidia 1973. Non per rubarvi il cliente: per farvi vedere come potete farlo voi.
La home di Invidia l'avete rinnovata voi: è il primo intervento del vostro caso studio sul redesign dello shop su PrestaShop, quello con la testimonianza video del cliente, di settembre 2024. Dietro c'è un negozio vero, che vende e funziona: il ritiro in negozio con la scelta del punto vendita, le gift card, il programma fedeltà, le recensioni certificate, i pagamenti a rate. E la parte che firmate nel caso studio, l'acquisto rapido con la taglia (nel codice si chiama ancora «quick-view-hostinato»), lo Shop by look, l'aggiornamento di PrestaShop, l'avete fatta dentro i vincoli di un tema commerciale e di un costruttore di pagine.
Sono partito da lì: le collezioni in primo piano, come deve essere, le vostre idee migliori, l'acquisto rapido e i look già abbinati, e dal sito di oggi il leone sopra i titoli. Quello che pesa oggi sulla home non è il disegno: sono i 23 servizi esterni che partono da soli all'apertura, compresi quelli del negozio come le recensioni e i pagamenti a rate, le cinque diapositive del carosello, i titoli principali per Google, nascosti nel carosello e rimasti alla collezione 2024-25. Succede a quasi ogni negozio online vivo.
Foto, video, frasi, prezzi e negozi vengono dal sito di oggi e dai video di Invidia: non ho aggiunto fatti che non fossero già loro.
Il prima e il dopo, dal telefono
- Il contenuto principale, in 4G
- 0,8 sinvece di 18,4 s
- In una rete lenta
- 1,9 sinvece di 61,3 s
- Peso al primo caricamento
- 474 KBinvece di 10,2 MB
- Servizi esterni caricati da soli
- 0invece di 23
- Lighthouse, telefono
- 96-99 su 100invece di 2-3
- Quanto salta la pagina mentre carica (CLS)
- 0invece di 1,5
Il prima l'ho misurato sul sito pubblicato il 20 ottobre 2026 fra le 21:37 e le 21:44; il dopo la stessa sera, fra le 23:33 e le 23:35, su questa anteprima pubblicata. Stessi due strumenti: Lighthouse 12 e una sonda che apre la pagina come un telefono senza cache, tre volte, con la rete rallentata davvero (la mediana dei tre giri). Il punteggio Lighthouse lo rifate in un minuto su PageSpeed; la differenza, col telefono, la sentite aprendo le due pagine.
Che cosa ho cambiato, e perché
Lo slogan diventa un gesto
La campagna dice «Diventa stilista di te stesso» e «Lo stile lo sceglie chi lo indossa». In apertura adesso c'è un figurino fatto con le loro foto prodotto, tagliate alla cintura e portate alla stessa scala: sopra un capo, sotto un pantalone, e si cambiano col pollice. Uomo o Donna, Mescola, Prova il marrone (la novità della stagione, dice la stilista), il totale del look coi prezzi veri, e un tocco sul capo apre l'acquisto rapido, la vostra idea, che porta alla scheda vera per la taglia. È il principio con cui lavoro, feel, don't tell: la pagina fa provare la promessa invece di scriverla.
Il materiale vero, al centro
La foto di Parigi in apertura e l'immagine dell'anteprima del link sono generate, e il sito stesso lo dice: restano fuori. Al loro posto le foto prodotto, che sono uniformi e ottime (è per questo che il figurino sta in piedi), i gesti veri della campagna e del chino TECNO dai video su TikTok, il leone ricalcato dal loro PNG, la scritta dai tracciati del loro SVG. Nelle foto ho reso uniforme solo il grigio del fondo dello studio: i capi restano come sono, come promette la loro policy sull'intelligenza artificiale.
La pagina per chi arriva dal telefono
Chi arriva da un video vuole vedere i vestiti. Qui l'informativa dei cookie non serve, perché non c'è nessun servizio esterno: la prima schermata è la stagione indosso, e niente si muove sotto il dito. Il ritiro gratuito in negozio sta sotto il prezzo, nell'acquisto rapido; il negozio più vicino è a un tocco (la posizione resta nel telefono), la ricerca trova i capi mentre scrivi, l'indice delle sezioni è sotto il pollice. Le fasce del figurino scorrono di lato solo con un gesto di lato: in verticale la pagina scorre come sempre.
Google e la condivisione
Un titolo principale solo (oggi sono quattro, nascosti nel carosello e fermi alla collezione 2024-25), titolo e descrizione con le parole di chi cerca, i dati strutturati dell'azienda e dei 29 punti vendita con indirizzi, telefoni e orari presi dal loro localizzatore, e un'anteprima del link fatta col figurino vero al posto di quella generata.
La velocità
Nessun servizio esterno che si carica da solo, le foto nelle misure che servono a ogni schermo, i due caratteri serviti dal sito stesso, i video che si caricano solo quando li guardi. Per questo la pagina pesa un ventesimo di prima, anzi meno, e si vede subito anche in una rete lenta.
Per tutti, anche con la tastiera
Lo zoom con due dita torna (oggi è bloccato), i comandi sono alti 44 pixel e i testi non scendono sotto i 14, i contrasti sono misurati; il figurino si usa con le frecce, e Uomo e Donna funzionano anche senza JavaScript.
Ogni numero con la sua fonte
Nomi e prezzi portano la data in cui li ho letti, le date della storia vengono dalla pagina «Chi siamo», i negozi dal localizzatore: 28 negozi e l'outlet. Il marchio, in punti diversi, dice oltre 50, oltre 40, trenta: nella pagina ho scritto il numero che si può contare, e la domanda va al cliente.
Quanto tempo, e con che cosa
Una sera: il 20 ottobre 2026, dalle 21:17. L'ha costruita un agente di intelligenza artificiale (Claude) che lavora con Linus, il metodo con cui faccio i siti: prima ha smontato e misurato la home di oggi, poi ha scritto l'analisi e il progetto, poi le prove, giudicate sugli scatti nella chat da cui coordino il lavoro, prima della grafica finita. Un secondo agente, che non l'ha costruita, la collauda e rilegge ogni fatto sulla fonte.
Next.js, pubblicata su Vercel: nessun tema, nessun plugin, nessun servizio esterno. Il negozio resta PrestaShop: questa home gli sta davanti, e ogni capo porta alla sua scheda vera. Il tempo vero, adesso, sta nelle scelte: quali capi stanno meglio in piedi nel figurino, che cosa togliere dalla prima schermata, quali parole di Invidia tenere.
Che cosa potete portare a Invidia
- Una home veloce davanti al negozio PrestaShop, che resta com'è: schede, carrello, ritiro in negozio e gift card non si toccano.
- Il figurino come Shop by look fatto dai clienti, coi capi della stagione e i prezzi letti dal catalogo.
- I 28 negozi e l'outlet su Google, coi dati strutturati e gli orari del localizzatore: un aiuto in più a chi cerca Invidia e la sua città.
- I video che Invidia gira già per TikTok, in home, muti e leggeri, al posto delle immagini generate.
- Una pulizia dei servizi esterni: ognuno è un pezzo di secondo per chi compra, e una riga in più nell'informativa.
Se volete vedere come si lavora così
Giovedì 29 ottobre, dalle 14 alle 17, sono alla 24ORE Business School di Milano, in via Monte Rosa 91, con Marco Santonocito e un gruppo piccolo di agenzie. Organizza Alleniamo Imprese, la scuola ci ospita.
Il pomeriggio per le agenzie (si apre in un'altra scheda)
Federico Vitiello