Configuratori di prodotto, oggetti e ambienti da ruotare, animazioni leggere. Costruiti per caricarsi in fretta sul telefono e per portare richieste o ordini, non solo effetto.
Lo sviluppo 3D web porta nel browser modelli tridimensionali che il visitatore può ruotare, ingrandire e modificare, senza installare nulla. Il caso più richiesto è il configuratore di prodotto: il cliente sceglie colori, materiali, misure o accessori, vede subito il risultato e poi chiede un preventivo o mette nel carrello la versione scelta. Usiamo WebGL con three.js e modelli in formato glTF compressi, e ogni scena ha un’immagine di riserva per i dispositivi più vecchi.
Il nostro sito usa scene 3D in diverse pagine, come il rack interattivo della pagina infrastruttura IT e cloud. Il prezzo dipende da numero di modelli, opzioni e integrazioni: lo trovi nel preventivo dopo l’analisi gratuita.
Con decine di combinazioni di colori e finiture, nessuna foto mostra proprio quella che vuole.
Le richieste arrivano senza misure o con opzioni incompatibili, e servono tre email per capirsi.
Modelli pesanti che sul telefono impiegano secondi a comparire o scaldano il dispositivo, e il visitatore se ne va.
Animazioni belle ma scollegate da carrello e richieste: il visitatore gioca un minuto e chiude la pagina.
La scheda qui sotto è un piccolo esempio di 3D leggero: niente librerie esterne, solo CSS e poche righe di JavaScript. Toccala o trascinala per girarla, anche dal telefono.
| Tipo | Esempi | A cosa serve |
|---|---|---|
| Configuratore di prodotto | arredi, serramenti, biciclette, macchinari, abbigliamento tecnico | scegliere le varianti e ricevere richieste complete |
| Visualizzazione di oggetti | prodotti da ruotare e ingrandire, esplosi tecnici | mostrare dettagli che le foto nascondono |
| Ambienti e spazi | stand, negozi, showroom, stanze arredate | far capire dimensioni e disposizione |
| Realtà aumentata | il prodotto visto nella propria stanza dal telefono | togliere dubbi prima dell’acquisto |
| Animazioni leggere | sezioni del sito che si muovono con lo scorrimento | dare carattere al sito senza appesantirlo |
Il modello 3D può arrivare dai file del vostro ufficio tecnico, come i CAD, o essere creato da zero. In entrambi i casi va semplificato per il web: un file da progettazione è troppo pesante per un telefono.
Le scelte tecniche che decidono se una scena funziona su un telefono.
glTF compressi, texture ridotte e livelli di dettaglio: pochi megabyte invece di centinaia.
Controlli touch, qualità adattata al dispositivo, immagine di riserva se il 3D non parte.
La scena parte quando entra nello schermo e non rallenta il resto della pagina.
La configurazione scelta va nel carrello di Shopify o WooCommerce, o in una richiesta di preventivo completa.
Colori, finiture e compatibilità letti da un file o dal gestionale, così aggiorni il configuratore senza sviluppatori.
Testi, prezzi e varianti restano nell’HTML: il 3D si aggiunge alla pagina, non la sostituisce.
Una scena 3D fatta bene non rallenta il sito. Il modello si carica dopo il resto della pagina, solo quando il visitatore ci arriva, e la qualità si adatta al dispositivo: su un telefono di fascia media il configuratore deve rispondere al tocco senza scatti. Misuriamo i Core Web Vitals prima e dopo, e se una scena peggiora i numeri la alleggeriamo prima di pubblicarla.
Il 3D non è sempre la risposta: per un prodotto con poche varianti può bastare una buona galleria di foto, che costa meno. Nell’analisi te lo diciamo. Se ti serve anche il negozio, vedi lo sviluppo Shopify e i siti WordPress e WooCommerce.
Prima il modello e le opzioni, poi la scena.
Prodotto, varianti, file disponibili, piattaforma del sito e obiettivo.
Combinazioni possibili, incompatibilità, prezzi o dati da raccogliere.
Modello 3D ottimizzato e prima scena da provare su telefono e computer.
Configuratore, collegamento al carrello o alla richiesta di preventivo, misura delle prestazioni.
Messa online, monitoraggio e nuove varianti quando servono.
Esempi dal vivo sulle nostre pagine.
Indica prodotto, varianti e piattaforma del sito. Ti rispondiamo entro 24 ore lavorative.
Ti scriviamo entro 24 ore lavorative per fissare i 30 minuti. Se è urgente, scrivici su WhatsApp.
Negozi online dove il configuratore porta ordini.
Configuratori collegati al carrello Shopify.
Scene 3D su siti WordPress.
Opzioni e prezzi letti dal gestionale.
Configuratori complessi con logiche di calcolo.
Un sito nuovo con scene 3D dove servono.