Smoky Candle
Smoky Candle è il mio marchio: candele di soia che colo a mano con mio cugino. Ho rifatto il suo negozio attorno a una candela che si apre, si accende e si spegne.
Il progetto
Il mio marchio di candele di soia. Ho rifatto il negozio attorno a una candela 3D che si apre, si accende e si spegne, con il pagamento su Stripe.
Visita il sitoUn prodotto vero, in un garage.
Cera di soia, stoppino in legno, due fragranze: Butter e Berry. Ne abbiamo vendute una trentina a mano, a persone che potevamo guardare in faccia.
Coin, la catena di grandi magazzini, le ha viste e le sono piaciute. Poi il budget si è messo di mezzo. Lo stock è vero, ed è nel mio garage.
Il primo sito non vendeva niente.
La prima versione, a febbraio 2026, sembrava a posto. Il bottone del checkout non faceva niente.
Una candela si compra per come sta in una stanza. Una griglia di foto questo non te lo dà.
Una candela che ti segue lungo la pagina.
- Una candela in WebGL modellata sul vasetto vero: l'etichetta di stampa, il tappo a vite nero o dorato, la scatola a tubo bianca.
- Apri la scatola, sviti il tappo e la accendi. Quaranta ore di fiamma passano in due minuti, e la cera cala.
- Passi veloce sopra la fiamma e si spegne, come con un soffio. Dallo stoppino sale un filo di fumo.
- Il crepitio, il pop della scatola e gli scatti del tappo sono generati con Web Audio. Nessun file audio.
- Scorrendo, i cofanetti si compongono da soli: la seconda candela, la scatola nera con velina e nastro, la busta col biglietto scritto a mano.
- Pagamento su Stripe. I prezzi li legge il server, la spedizione è gratuita da 50 euro.
Tre cose imparate a spese mie.
- Una tela 3D fissa che insegue lo scroll su iOS arriva sempre un fotogramma dopo, e la candela sobbalza. Adesso la tela vive dentro ogni sezione e la fa scorrere Safari con la pagina.
- Safari ignora i filtri sulle tele 2D: il logo grigio della scatola veniva dorato. Adesso è un'immagine già pronta.
- I browser fanno suonare solo dopo un tocco vero, e lo scroll non conta. Il bottone del suono è sempre in vista, e ogni tocco riprova.
- Prestazioni
- 78
- prima 92
- Accessibilità
- 100
- prima 91
- Buone pratiche
- 100
- SEO
- 100
Lighthouse 12, mobile, misurato in locale il 23 settembre 2026. Il numero di prima è quello della prima versione, statica. Il motore 3D pesa circa 250 KB compressi, quindi parte a pagina pronta e la candela entra in dissolvenza.
Vuoi che il tuo prodotto si senta così?
Lavoro su un sito alla volta. Dimmi cosa vendi.
Parliamone
