L'obiettivo è quello di sviluppare una 3D-WebApp usando tecnologie quali HTML5, CSS3, contesto WebGL e linguaggi Javascript e GLSL. Il progetto A glimpse of city permette all'utente di interagire con un ambiente 3D immersivo. L'esperienza interattiva 3D dev'essere composta da almeno un oggetto principale di tipo mesh poligonale caricato da file (OBJ Wavefront), inserito in una scenografia con illuminazione e texture ad hoc. Per questa specifica applicazione, il focus principale è stato quello di offrire un'esperienza visiva che permetta agli utenti di esplorare e interagire con un modello 3D di una città virtuale attraverso un'interfaccia utente responsive. Questo progetto è stato originariamente pensato per essere utilizzato da differenti tipologie di dispositivi ed è stato testato in particolare in ambito desktop e mobile.
Richieste obbligatorie soddisfatte
-
Geometria 3D visualizzata in proiezione prospettica;
-
Input utente: l'utente può interagire usando indipendentemente tastiera e mouse;
-
Gli oggetti 3D devono essere illuminati da una luce;
-
Texture mapping: nel progetto sono inseriti molteplici oggetti 3D che hanno una propria texture applicata ed è stato aggiunto un banner con la foto dell'autore del progetto;
-
È stato creato ad hoc un pannello su schermo che prevede tramite slider e checkbox di attivare o disattivare metodi avanzati di rendering e di modificare il posizionamento della luce;
-
La piattaforma è fruibile anche da un dispositivo mobile tramite dei bottoni che possono essere cliccati dall'utente per potersi muovere nello spazio, cambiare direzione e ripristinare posizione iniziale e luce;
Richieste opzionali soddisfatte
-
Input utente: l'utente può interagire usando un gamepad (testato nello specifico con controller PS4);
-
Rendering avanzati: Da menù è possibile attivare/disattivare le tecniche di rendering avanzato trasparenze, riflessioni, normal mapping.
Per maggiori informazioni, leggere la documentazione del progetto.