Vai al contenuto

Web 3D

Da Wikipedia, l'enciclopedia libera.

Web 3D è un termine usato per indicare i contenuti 3D interattivi inseriti in una pagina HTML, visualizzabili da un comune browser attraverso un particolare Web 3D viewer[1]. Si utilizza il concetto di Web 3D anche per indicare una possibile evoluzione del Web in cui viene abbandonata l'idea di pagina e ci si immerge in uno spazio tridimensionale interattivo.

Il primo linguaggio specificamente progettato per la descrizione di ambienti tridimensionali destinati al Web fu VRML (Virtual Reality Modeling Language). Introdotto nella metà degli anni Novanta, era un linguaggio testuale che consentiva di definire scene 3D, includendo geometrie, materiali, luci, punti di vista e semplici interazioni. Esso rappresentò il primo standard ampiamente adottato per la pubblicazione e la visualizzazione di contenuti tridimensionali sul World Wide Web, ponendo le basi per il successivo sviluppo delle tecnologie Web 3D[2]. Era il 1994 quando Tim Berners-Lee e Dave Raggett, durante la prima conferenza annuale sul World Wide Web tenutasi a Ginevra, iniziarono a pensare ad un linguaggio comune che descrivesse gli scenari 3D e i relativi collegamenti con il Web. Nacque così la prima versione di VRML, un linguaggio di programmazione con l'obiettivo di consentire agli utenti di esplorare ambienti virtuali interattivi direttamente attraverso il browser, introducendo una nuova modalità di fruizione dei contenuti basata sulla navigazione in tre dimensioni[3][4].

Nonostante l'interesse iniziale e le elevate aspettative, la diffusione di VRML non raggiunse i risultati auspicati. Nella seconda metà degli anni Novanta numerose aziende investirono nello sviluppo di strumenti, browser plug-in e applicazioni basate su questa tecnologia, con l'obiettivo di favorire l'affermazione del Web tridimensionale. Tuttavia, tali iniziative non ebbero il successo previsto e molti progetti furono progressivamente abbandonati, determinando una fase di sostanziale stagnazione nello sviluppo del Web 3D. Le principali cause di questo insuccesso sono riconducibili a fattori di natura tecnologica, economica e industriale. Dal punto di vista tecnologico, gli ambienti tridimensionali richiedevano capacità di elaborazione grafica superiori a quelle comunemente disponibili nei personal computer dell'epoca. Le limitate prestazioni dell'hardware, unite alla ridotta larghezza di banda delle connessioni Internet, rendevano spesso difficoltosa la fruizione di contenuti tridimensionali complessi[5].

Un ulteriore ostacolo era rappresentato dall'assenza di un supporto nativo nei browser Web. La visualizzazione dei contenuti VRML richiedeva generalmente l'installazione di plug-in dedicati, condizione che costituiva una significativa barriera all'adozione della tecnologia da parte degli utenti e ne limitava l'integrazione con il Web tradizionale. A questi aspetti si aggiungevano la complessità degli strumenti di sviluppo e la necessità di competenze specialistiche, ancora poco diffuse tra i progettisti Web. Infine, la frammentazione del mercato e la limitata convergenza tra i principali produttori di software rallentarono la definizione e l'adozione di standard aperti e condivisi, contribuendo ulteriormente alla scarsa diffusione del Web tridimensionale nel corso degli anni Novanta[6].

Inoltre, a causa di quest'ultima condizione, molte aziende leader come Macromedia (successivamente assorbita da Adobe) hanno sviluppato un proprio standard sul quale basare le proprie applicazioni, introducendo quindi una competizione tra standard proprietari e quelli open source come VRML[7].

Alla luce delle difficoltà incontrate e della limitata diffusione della tecnologia, VRML sembrava destinato a un progressivo declino nel panorama delle tecnologie tridimensionali per il Web. Tuttavia, tale previsione non si concretizzò. L'interesse della comunità scientifica e degli organismi di standardizzazione contribuì infatti all'evoluzione del linguaggio, che costituì la base per lo sviluppo di nuovi standard destinati al Web 3D[8]. Grazie alla nascita di un nuovo gruppo nel 1996, il VRML Consortium, successivamente denominato Web 3D Consortium si promosse l'uso di tale linguaggio in modo che fosse orientato verso il mercato. VRML venne successivamente evoluto in X3D (Extensible 3D), uno standard progettato per superare alcuni limiti del predecessore e garantire una maggiore interoperabilità con le tecnologie Web. Sviluppato dal Web3D Consortium e successivamente ratificato come standard ISO[9], X3D introdusse, tra le diverse possibilità di codifica, una rappresentazione basata su XML, pensata per favorire lo scambio dei dati tridimensionali e l'integrazione con gli ambienti software già diffusi nel Web.[10]

La contrapposizione tra l'esigenza di definire uno standard aperto e interoperabile e gli interessi commerciali delle aziende, orientate allo sviluppo di soluzioni proprietarie (closed source), contribuì alla frammentazione del settore. La competizione tra differenti tecnologie e piattaforme impedì l'affermazione di un unico standard dominante, determinando la coesistenza di numerose soluzioni proprietarie sviluppate da aziende diverse. Numerose società iniziarono infatti a offrire servizi e applicazioni basati sulla grafica tridimensionale per il Web, spesso accompagnati da propri ambienti di visualizzazione (player) e formati proprietari. Questa frammentazione rese più complessa l'interoperabilità tra le diverse piattaforme e rappresentò uno degli ostacoli alla diffusione di un ecosistema Web 3D unificato[3]. Ad esempio Adobe Flash (obsoleto dal 31 dicembre 2020[11]) era in grado di creare animazioni 3D anche interattive[12] con il plug-in Flash Player.

Di conseguenza, l'utente si trovava spesso nella necessità di installare numerosi plug-in e applicazioni client dedicate alla visualizzazione di contenuti tridimensionali, poiché la mancanza di uno standard unico per la rappresentazione e la fruizione del 3D sul Web comportava la dipendenza da differenti player proprietari.

Strumenti per la creazione di scenari 3D

[modifica | modifica wikitesto]
Image Lo stesso argomento in dettaglio: Grafica 3d e Rendering.

Attualmente esistono diversi strumenti utilizzati per la creazione di scenari 3D. Tuttavia, sin dal principio furono utilizzati i linguaggi di Markup per la creazione di scenari 3D adattabili ad una pagina HTML.

Alcuni dei linguaggi di marcatura più noti sono: VRML, X3D, KML, 3DMLW, COLLADA e Burster (Blender Web Plugin). Questi formati sono visualizzabili da una pagina HTML attraverso dei plugin appositi.

Oltre a questi standard di modellazione usati per descrivere gli scenari 3D, questo settore presenta tecnologie dotate di altre caratteristiche: stiamo parlando delle librerie e in alcuni casi di veri e propri software in grado di realizzare ambienti 3D che si basano su OpenGL, la libreria grafica di base, senza tuttavia fare uso di linguaggi di markup standard[13].

Con lo scopo di sfruttare le caratteristiche multi-linguaggio e multi-piattaforma di OpenGL, sono stati sviluppati molti binding per questa libreria, in molti linguaggi. Tra i più importanti troviamo la libreria OpenSceneGraph, e l'innovativa libreria Java 3D che si appoggia su OpenGL per sfruttarne l'accelerazione hardware. Inoltre Sun Microsystems ha pubblicato una libreria Open source, che fornisce binding ai comandi OpenGL in Java. Questa libreria si chiama JOGL.

Esempio di OpenGL
Esempio di OpenGL

Anche Google ha creato una libreria per costruire scenari 3D su Web. Si tratta di O3D, realizzata con l'intenzione di diventare in breve tempo uno dei principali standard 3D su Web.

La tecnologia Blend4Web si sta affermando come potente strumento di esportazione di scene realizzate in Blender in applicazioni basate su WebGL[14] (tecnologia basata su HTML5 Canvas che non richiede plugin, dal 2019 circa supportata da tutti i browser[15]), integrabili in una pagina web. Tale tecnologia dispone di un add-on di Blender, che permette l'esportazione della scena in un canvas della pagina, e di un framework completo di sviluppo JavaScript ed API avanzate che permettono di creare interazioni utente complesse, animazioni, simulazioni fisiche, integrazione di elementi 2D/3D, supporto di dispositivi per la realtà virtuale, il tutto destinato a realizzare applicazioni web per la visualizzazione scientifica, navigazione di ambienti virtuali, cultural-heritage research, showcasing.

Anche la proprietà CSS3 3D transform è in grado di creare alcuni basilari animazioni e oggetti 3D interattivi[16].

Alcuni software di modellazione 3D possono esportare creazioni per il web 3D come WebGL senza scrivere il codice da zero[17].

Foto in sequenza di un cellulare che, unite dal codice JQuery, danno l'illusione di movimento tridimensionale
Foto in sequenza di un cellulare che danno l'illusione di movimento tridimensionale

Web 3D simulato

[modifica | modifica wikitesto]

JS 360° degree

[modifica | modifica wikitesto]

Con JQuery è possibile creare un 3D simulato[18], ossia scattare più fotografie di un oggetto in diverse posizioni che poi attraverso il codice JavaScript permettere all'utente di ruotarlo di 360 gradi con il mouse o il dito creando un effetto tridimensionale. Si può anche fare con un paesaggio o un interno (di un edificio, un automobile, ecc.). Non serve installare plugin ed è un metodo che supportano tutti i browser, anche Internet Explorer 8[19][20]. Si usa in pratica la stessa tecnica delle animazioni video, GIF e Adobe Flash (un frame dopo l'altro che creano l'illusione di movimento, esattamente come la pellicola cinematografica).

Con SVG e JavaScript integrati si possono creare animazioni ed effetti che creano l'illusione della tridimensionalità con alcune possibilità di interazione con l'utente[21][22][23][24].

Immagini prospettiche

[modifica | modifica wikitesto]

Content management system

[modifica | modifica wikitesto]
Image Lo stesso argomento in dettaglio: Content management system.

Esistono plugin per CMS che permettono di integrare tecniche di Web 3D nei CMS[25][26][27].

Image Lo stesso argomento in dettaglio: Visita virtuale.

Spesso la tecnologia 3D viene impiegata nel World Wide Web con lo scopo di visualizzare terreni e mappe geografiche tridimensionali. L'uso di scenari 3D rende molto realistica la consultazione della mappa e ne facilita quindi la sua comprensione agli utilizzatori. Questo tipo di applicazione prende il nome di Geo-Viewers (ma anche Map-Viewers o Terrain-Viewers)[28].

Anche in campo medico\scientifico, architettonico e videogaming viene fatto ricorso al 3D[29][30][31]. Viene inoltre utilizzato per presentare vari prodotti[32].

3D-mobile-desktop
Limiti di accessibilità e usabilità di una pagina web 3D sui dispositivi mobili. Se si mantenesse la dimensione desktop delle aree cliccabili su mobile esse si accavallerebbero

Jacob Nielsen e Hoa Loranger (esperti di usabilità e accessibilità del web) hanno criticato l'uso del 3D nel web per le seguenti ragioni[33][34][35]:

  • Con la nascita dei dispositivi mobili non è sempre possibile adattare una pagina web 3D ad essi, o comunque anche se ci si riesce la navigabilità non è la stessa che su desktop, poiché il dito ha un'area più ampia di click rispetto al puntatore del mouse[36]
  • Una pagina web 3D può causare problemi di usabilità ad utenti che hanno problemi fisici alle mani e quindi una navigabilità più limitata[37]
  • Spesso non è possibile utilizzare tag accessibili come ALT, TITLE, LONGDESC, e nemmeno fornire un'alternativa testuale a contenuti multimediali[38]. Quindi potrebbero risultare penalizzati gli utenti che utilizzano gli screen reader
  • Il costo di una pagina 3D è solitamente molto superiore a una pagina HTML standard[39], quindi non è detto che la spesa iniziale sia proporzionata al guadagno successivo
  • Nel caso l'utente non sia esperto, può avere problemi a capire ed interpretare la navigazione di una pagina 3D che è solitamente più complessa di una pagina HTML standard
  • Molte tecnologie 3D richiedono l'installazione di plugin aggiuntivi[40] e ciò può infastidire l'utente
  • Se l'utente non ha una connessione veloce e dispositivi ad alta risoluzione, le pagine 3D possono apparire lente e sgranate
  • Nel caso la pagina 3D voglia vendere un prodotto o servizio, l'utente sarà concentrato sull'interfaccia tridimensionale anziché sul prodotto presentato[35]
  • Aggiornare e\o modificare una pagina 3D richiede molto spesso un intervento notevole e il più delle volte si è costretti a rivolgersi al suo creatore, non come ad esempio nel caso di pagine fatte in HTML o in CMS come Wordpress che sono solitamente strumenti più semplici e veloci da imparare ed utilizzare
Queste due animazioni in 3D hanno un testo che segue la tridimensionalità degli oggetti su cui è posizionato quindi è difficilmente leggibile, soprattutto se gli oggetti si muovono.
Queste due animazioni in 3D hanno un testo che segue la tridimensionalità degli oggetti su cui è posizionato quindi è difficilmente leggibile, soprattutto se gli oggetti si muovono.
  • Se la tecnologia 3D utilizzata dovesse cambiare e\o diventare obsoleta[41][42], il cliente sarebbe costretto a dover farsi rifare da zero la pagina o chiuderla come successe negli anni in cui Adobe Flash iniziò a cadere in disuso a favore di HTML5-CSS3
  • Nel caso l'azienda a cui ci si è appoggiati per costruire la pagina 3D chiuda, consegnare il progetto ad una nuova azienda non è facile come effettuare il passaggio di un progetto standard in HTML, CSS o Wordpress.
  • Il pulsante "indietro" e "avanti" del browser spesso non funziona su una pagina 3D. Cioè l'utente, cliccando questi tasti, si ritrova la pagina precedente o successiva visitata nella cronologia, non la pagina precedente o successiva dello stesso sito web
  • Il testo e le immagini di una pagina 3D a volte non possono essere selezionati dall'utente ne quindi copiati e salvati
  • Le tempistiche per costruire pagine 3D sono generalmente più lunghe di quelle che richiedono le pagine HTML o Wordpress
Solo la prima pagina in alto a sinistra è SEO-friendly rispetto alle altre create solo con tecniche di Web 3D
Solo la prima pagina in alto a sinistra è SEO-friendly rispetto alle altre create solo con tecniche di Web 3D
  • Non tutte le nuove tecnologie sono a passo con i browser e viceversa. Internet Explorer (obsoleto dal 2020) ad esempio non supportava WebGL quando Chrome e Safari si. Sono passati anni prima di poter usare WebGL su tutti i browser, quindi se si usava questa tecnologia si escludevano dall'esperienza 3D gli utenti di Internet Explorer[43][44].
  • Molti prodotti (ad esempio una maglietta, un profumo, una crema, un pennarello) non guadagnano valore aggiunto con un'interfaccia 3D poiché gli utenti non hanno bisogno di vederli nei minimi particolari da varie angolazioni e dimensioni[45]
  • Spesso gli utenti vogliono trovare informazioni nel più breve tempo possibile sul web e alcune interfacce 3D hanno bisogno di tempo per impararne la navigazione, non avendo quella classica delle pagine HTML[37]
  • Il codice di una pagina 3D è molto diverso, più complesso e lungo di una pagina HTML-CSS standard e ciò può influire sulla SEO. Il Web 3D infatti andrebbe integrato in pagine HTML standard ma non utilizzato da solo per creare l'intera pagina, a meno che il sito web che ospita tale pagina sia già indicizzato molto bene di per sé.

Google Chrome Experiments

[modifica | modifica wikitesto]

Google Chrome Experiments è uno showroom online di esperimenti basati su browser web, programmi interattivi e progetti artistici. Lanciato il 1º marzo 2009, Google Chrome Experiments è un sito web ufficiale di Google che originariamente doveva testare i limiti di JavaScript e le prestazioni e le capacità del browser Google Chrome. Con il progredire del progetto, ha assunto il ruolo di mostrare e sperimentare le più recenti tecnologie open source basate sul web, come JavaScript, HTML5, WebGL, Canvas, SVG, CSS e altri. Tutti i progetti vengono inviati dagli utenti e realizzati utilizzando tecnologie open source.

WebGL è una delle tecnologie più comunemente utilizzate sul sito. La tecnologia ha anche guadagnato un uso attivo in app online famose e utili come Google Maps, e Zygote Body (ex Google Body)[46][47][48].

  1. ↑ interactivelab.it, https://www.interactivelab.it/web-3d-in-tempo-reale/.
  2. ↑ X3D & VRML, The Most Widely Used 3D Formats | Web3D Consortium, su www.web3d.org. URL consultato il 25 luglio 2026.
  3. 1 2 Recommended Standards | Web3D Consortium, su web3d.org. URL consultato il 3 febbraio 2021.
  4. ↑ Platform Independent Virtual Reality, su w3.org. URL consultato il 3 febbraio 2021.
  5. ↑ Ames, A. L., Nadeau, D. R., & Moreland, J. L. (1997). VRML 2.0 Sourcebook. John Wiley & Sons
  6. ↑ Hartman, J., & Wernecke, J. (1996). The VRML 2.0 Handbook: Building Moving Worlds on the Web
  7. ↑ Pesce, M. (1995). VRML: Browsing and Building Cyberspace. New Riders.
  8. ↑ Carey, R., & Bell, G. (1997). The Annotated VRML 2.0 Reference Manual. Addison-Wesley
  9. ↑ (EN) ISO/IEC 19776-2:2015, su ISO. URL consultato il 25 luglio 2026 (archiviato dall'url originale il 1º ottobre 2025).
  10. ↑ x3d, su news.zdnet.co.uk. URL consultato il 3 febbraio 2021 (archiviato dall'url originale il 12 novembre 2009).
  11. ↑ Flash & The Future of Interactive Content, su theblog.adobe.com, Adobe. URL consultato il 19 settembre 2018 (archiviato dall'url originale il 2 dicembre 2017).
  12. ↑ 3d flash, su youtube.com.
  13. ↑ OpenGL Extensions Viewer for Mac: Free Download + Review [Latest Version], su macupdate.com. URL consultato il 3 febbraio 2021.
  14. ↑ (EN) Giles Thomas, Paul Lewis15 March 2017, 20 amazing examples of WebGL in action, su Creative Bloq. URL consultato il 3 febbraio 2021.
  15. ↑ (EN) Unity Technologies, Unity - Manual: WebGL Browser Compatibility, su docs.unity3d.com. URL consultato il 3 febbraio 2021.
  16. ↑ CSS3 3D Transforms, su www-db.deis.unibo.it. URL consultato il 3 febbraio 2021.
  17. ↑ (EN) Alexander Kovelenov, Blender to WebGL in 4 Simple Steps - a quick start guide to 3D web technology, su Soft8Soft, 9 agosto 2018. URL consultato il 3 febbraio 2021.
  18. ↑ 10 Best 360 Degree Product View Plugins In JavaScript | jQuery Script, su jqueryscript.net. URL consultato il 5 febbraio 2021.
  19. ↑ (EN) Aram Vardanyan, 8 Javascript tools to create 360 degree Photosphere viewers, su Medium, 26 gennaio 2021. URL consultato il 5 febbraio 2021.
  20. ↑ (EN) jQuery Foundation- jquery.org, Browser Support in jQuery 1.12 and Beyond | Official jQuery Blog, su blog.jquery.com. URL consultato il 5 febbraio 2021.
  21. ↑ jQuery SVG 3D Tag Cloud Plugin Example, su jqueryscript.net. URL consultato il 18 febbraio 2021.
  22. ↑ three.js docs, su threejs.org. URL consultato il 18 febbraio 2021.
  23. ↑ seen.js, su seenjs.io. URL consultato il 18 febbraio 2021.
  24. ↑ (EN) Lucamug, Basic 3D rendering in SVG: elm-playground-3d, su Medium, 19 novembre 2019. URL consultato il 18 febbraio 2021.
  25. ↑ (EN) 13 Best 3D WordPress Themes for Websites - [2020 Updated], su webCREATE, 14 dicembre 2020. URL consultato il 18 febbraio 2021.
  26. ↑ (EN) 5 Best WordPress 360 panorama view plugins in 2018, su wpestate.org, 13 aprile 2018. URL consultato il 18 febbraio 2021.
  27. ↑ (EN) Thomas Scholl, canvasio3D Light, su WordPress.org. URL consultato il 18 febbraio 2021.
  28. ↑ 3d, su webgis.arpa.piemonte.it. URL consultato il 3 febbraio 2021 (archiviato dall'url originale l'8 febbraio 2021).
  29. ↑ Simple 3D interactive Human Skeleton in WebGl - YouTube, su youtube.com. URL consultato il 3 febbraio 2021.
  30. ↑ palazzo 3d, su artstation.com.
  31. ↑ (EN) PlayCanvas - The Web-First Game Engine, su PlayCanvas.com. URL consultato il 3 febbraio 2021.
  32. ↑ (EN) Best WebGL Websites | Web Design Inspiration, su awwwards.com. URL consultato il 5 febbraio 2021.
  33. ↑ Jacob Nielsen e Hoa Loranger, Web Usability 2.0, Apogeo.
  34. ↑ (EN) World Leaders in Research-Based User Experience, Prioritizing Web Usability: Book by Jakob Nielsen and Hoa Loranger, su Nielsen Norman Group. URL consultato il 5 febbraio 2021.
  35. 1 2 (EN) World Leaders in Research-Based User Experience, 2D is Better Than 3D, su Nielsen Norman Group. URL consultato il 5 febbraio 2021.
  36. ↑ (EN) World Leaders in Research-Based User Experience, Mouse vs. Fingers as Input Device, su Nielsen Norman Group. URL consultato il 5 febbraio 2021.
  37. 1 2 (EN) 3D Model Accessibility, su Scott Vinkle. URL consultato il 5 febbraio 2021.
  38. ↑ Accessibilità multimediale - Impara il web | MDN, su developer.mozilla.org. URL consultato il 5 febbraio 2021 (archiviato dall'url originale il 22 ottobre 2020).
  39. ↑ (EN) How Much Does It Cost To Build an Awesome 3D Website, su IIH Global, 3 aprile 2019. URL consultato il 5 febbraio 2021.
  40. ↑ X3D Resources, su web3d.org. URL consultato il 5 febbraio 2021.
  41. ↑ VRML - NoskeWiki, su andrewnoske.com. URL consultato il 5 febbraio 2021.
  42. ↑ È tempo di dire addio per sempre a Flash Player, su Wired, 12 gennaio 2021. URL consultato il 5 febbraio 2021.
  43. ↑ Does Internet Explorer 10 support WebGL?, su Super User. URL consultato il 5 febbraio 2021.
  44. ↑ (EN) Unity Technologies, Unity - Manual: WebGL Browser Compatibility, su docs.unity3d.com. URL consultato il 5 febbraio 2021.
  45. ↑ (EN) 5 Fancy (But Useless) Web Components You Should Avoid - SitePoint, su sitepoint.com. URL consultato il 5 febbraio 2021.
  46. ↑ Step inside the map with Google MapsGL, su googleblog.blogspot.in, Google official blog. URL consultato il 15 dicembre 2012.
  47. ↑ MapsGL, su support.google.com, Google Maps. URL consultato il 15 dicembre 2012.
  48. ↑ Roni Zeiger, Google Body becomes Zygote Body; built on open source 3D viewer, in Google Open Source blog, Google, 9 gennaio 2012. URL consultato il 27 gennaio 2012.
  Portale Informatica: accedi alle voci di Wikipedia che trattano di informatica