Quando un sito web ha bisogno del 3D?
Una scena in tempo reale vale il suo costo quando l'azione del visitatore cambia ciò che impara: ruotare un prodotto per capire come è assemblato, muoversi in un edificio o in un paesaggio, confrontare luoghi fianco a fianco o esplorare un sistema più facile da comprendere nello spazio. Se il punto di vista e l'ordine sono fissi, un filmato renderizzato o una sequenza di immagini è più semplice da produrre e testare, e può comunque risultare cinematografico.
Il 3D tende a adattarsi a vetrine di prodotto, racconti spaziali e architettonici, comunicazione scientifica e di ricerca e mondi immersivi di brand per un lancio. Se movimento e scrollytelling bastano senza una scena navigabile, il creative development è la strada più leggera; mappe e dashboard basate sui dati rientrano nella data visualization.
Cosa include un progetto di sito web 3D
La proposta indica quali deliverable sono inclusi, chi crea o fornisce gli asset 3D e come viene accettata ogni voce.
- Brief di narrazione e interazione: cosa esplorano i visitatori, in che ordine e cosa fanno dopo
- Piano degli asset 3D, che comprende modelli forniti da te, asset con licenza o nuova modellazione, preparati come file glTF compressi
- Prototipo nel browser con controlli mouse, touch e tastiera su un telefono e un desktop concordati
- Contenuti HTML leggibili e un percorso a movimento ridotto attraverso la stessa storia
- Accettazione di prestazioni, dispositivi e fallback, più la consegna dei file sorgente e delle licenze degli asset
Janus Observatory: un'interfaccia 3D per dieci possibili futuri
Janus Observatory è un progetto sviluppato con Blue Marble Space in cui Dardo ha trasformato una struttura di ricerca speculativa in un viaggio cinematografico nel browser. Dieci futuri pongono subito un problema di navigazione: un semplice elenco perderebbe l'impostazione spaziale, mentre un'unica lunga sequenza 3D renderebbe difficile il confronto. Per questo l'esperienza è a livelli. Un'apertura cinematografica crea l'atmosfera, un atlante mostra l'insieme completo e un osservatorio permette una lettura più ravvicinata, con percorsi di ritorno che non riproducono di nuovo l'introduzione.
Il livello 3D stabilisce la scala e la differenza tra i mondi, mentre etichette, stato della navigazione e spiegazioni scritte portano i fatti fuori dalla scena renderizzata. L'accettazione verifica se un visitatore sa dire in quale mondo si trova, tornare all'atlante e proseguire dopo un fallback di rendering; il solo frame rate non può rispondere a questo. La build rispetta budget di bundle e QA sui browser, e le release vengono controllate per regressioni visive. Gli scenari sono esplorativi, non previsioni, e non si dichiara alcun apprendimento o coinvolgimento misurato.
Prestazioni e SEO per i siti web 3D
I motori di ricerca non leggono ciò che è disegnato dentro un canvas, perciò titolo, testi, link e metadati vengono renderizzati come HTML prima del caricamento della scena. Un'immagine poster tiene il posto della scena, il suo spazio è riservato in modo che nulla si sposti e il codice 3D si carica dopo la comparsa del primo contenuto. Quando uno stato dell'esperienza merita di essere trovato nella ricerca, ottiene un URL tutto suo.
Le prestazioni si misurano sugli asset reali e sui dispositivi di destinazione, invece di promettere un frame rate universale. Registriamo la sequenza di caricamento, un'interazione rappresentativa, l'uso della memoria dove rilevante e ogni degrado visivo accettabile sui telefoni meno potenti, lavorando per rispettare le soglie dei Core Web Vitals di Google. Non garantiamo posizionamenti; ci assicuriamo che il livello 3D non si metta mai tra i tuoi contenuti e il crawler.
Fallback, movimento ridotto e accessibilità
Un visitatore deve poter capire l'offerta anche quando il movimento è ridotto, il contesto grafico è perso o un dispositivo non regge la scena. Il fallback può essere un'immagine statica, un breve video o un normale layout di contenuti, e deve mantenere disponibile la decisione invece di mostrare un errore. Con il movimento ridotto, i voli di camera diventano stacchi o passaggi controllati dal visitatore, e le parti interattive hanno controlli da tastiera e focus visibile.
Da cosa dipende il costo di un sito web 3D?
Il costo di un sito 3D dipende dalla produzione di asset originali, dal numero di scene e stati di interazione distinti, dall'animazione, dalla programmazione grafica, dal supporto dei dispositivi e dai test. Un modello di prodotto fornito e un ambiente personalizzato sono punti di partenza molto diversi anche se finiscono entrambi su una sola pagina, perciò il preventivo separa direzione artistica, modellazione o asset con licenza, animazione, programmazione, contenuti, audio e supporto al lancio.
La prima milestone è una piccola porzione funzionante su un telefono e un browser desktop concordati, con testo reale, un asset rappresentativo e l'interazione effettiva. Fa emergere problemi di navigazione, peso dei file e tempi di frame prima che il resto venga prodotto. La proposta indica anche chi può sostituire contenuti e modelli dopo il lancio. Dardo è un team di tre persone a Bogotá guidato dal fondatore Nicolás Cerón, che lavora in inglese o spagnolo negli orari della costa orientale e del centro degli Stati Uniti.
Domande prima di scegliere
Quanto costa un sito web 3D?
Dipende soprattutto dalla produzione degli asset e dal numero di scene. Il preventivo per un progetto 3D arriva quando sappiamo se i modelli esistono già, quante scene distinte e quali stati di interazione servono e quali dispositivi vanno supportati. Le fasce di budget del modulo di richiesta, da meno di 5.000 USD fino a 60.000 USD e oltre, aiutano a dimensionare la prima proposta.
I siti web 3D penalizzano la SEO?
Non se i contenuti sono in HTML. I motori di ricerca non riescono a leggere ciò che viene disegnato dentro un canvas WebGL, quindi titolo, testi, link e metadati devono essere resi come normale contenuto della pagina, caricando la scena in un secondo momento. Costruita così, una pagina 3D viene scansionata come qualsiasi altra; restano i rischi di caricamento lento e di spostamenti del layout, che testiamo prima del lancio.
I siti con Three.js funzionano sugli smartphone?
Possono funzionare, se la scena è pensata per gli smartphone e non ridimensionata a partire da una demo per desktop. Significa modelli e texture compressi, una risoluzione di rendering limitata, rendering solo quando qualcosa cambia e una versione più leggera per i dispositivi meno potenti. Testiamo su uno smartphone concordato fin dalla prima porzione funzionante, così i limiti del mobile guidano il design invece di sorprenderti al lancio.
Un sito web 3D interattivo ha sempre bisogno di WebGL?
No. La tecnica segue l'obiettivo. Se le persone devono cambiare il punto di vista o manipolare un oggetto, la grafica WebGL in tempo reale è di solito la scelta giusta. Una narrazione fissa può usare fotogrammi renderizzati o video con un livello di contenuti più leggero, più economico da produrre e più facile da mantenere veloce. A volte bastano immagini a livelli e un movimento curato.
Chi crea i modelli 3D?
Può farlo l'una o l'altra parte, e la proposta lo specifica. Potresti fornire modelli di prodotto già esistenti da preparare per il web, potremmo usare asset con licenza, oppure il progetto potrebbe includere nuova modellazione. Ogni strada cambia costi e tempi. Qualunque sia l'origine, concordiamo formati dei file, limiti di poligoni e texture e a chi spettano i file sorgente finali e le licenze.
Quanto tempo serve per realizzare un sito web 3D?
Non c'è una durata fissa: dipende dalla produzione degli asset, dal numero di scene e dai giri di revisione. Definiamo le tempistiche nella proposta dopo aver delimitato la prima porzione funzionante, perché è lì che emerge ciò che di solito sposta le date, come modelli pesanti o interazioni da ripensare per il touch. Comunica subito un'eventuale data di lancio, così il lavoro può essere organizzato in fasi di conseguenza.
Potete aggiungere una scena 3D al nostro sito esistente?
Spesso sì. Una singola sezione 3D, come un visualizzatore di prodotto o una scena di apertura, può essere aggiunta a un sito esistente se la sua tecnologia permette di caricare la scena dopo il contenuto della pagina. Prima analizziamo la versione attuale, poi definiamo la scena, il suo fallback e il budget di prestazioni come un lavoro circoscritto, approvabile a sé stante.
