Caso studio

Graffico Office

L'ufficio ideale di Graffico, immaginato in 3D e da visitare in prima persona dal browser: si cammina tra le scrivanie, si accende la radio, si scrive codice su uno schermo.

Parliamo del tuo progetto Visita il sito

Settore: Studio digitale
Cosa abbiamo fatto: Esperienza 3D
Sito: office.graffico.it (si apre in una nuova scheda)

Il sito di Graffico Office su smartphone

L'obiettivo

L'ufficio che immaginiamo.

Non è la copia di una stanza vera: è il nostro modo di lavorare, diventato uno spazio da girare a piedi. Si toccano gli oggetti, senza installare niente.

01
In prima persona
Si cammina con WASD e ci si guarda intorno con il mouse.
02
Oggetti da usare
Quello che si illumina si usa con un tasto, la E.
03
Nel browser
Modellato in Blender, gira in tempo reale nella pagina.

Cosa abbiamo fatto

Ogni oggetto fa qualcosa.

Il codice che diventa sito.

Su una scrivania lo schermo di sinistra mostra HTML e CSS, quello di destra il sito che ne esce. Si cambia il codice e il sito si aggiorna subito, con GSAP già installato per animarlo.

Ci si avvicina alla scrivania: a sinistra il codice HTML, a destra il sito con il cubo che gira

Una radio che suona davvero.

La radio sulla scrivania si accende e cambia stazione: sono radio vere, in diretta, con il volume da regolare.

La radio in legno sulla scrivania si accende e passa da una stazione all'altra

Il piano, sulla lavagna.

Sulla lavagna c'è la nostra missione, il sito perfetto: la squadra, le cose da fare e qualche nota scritta a mano. Ci si racconta senza una pagina di testo.

La lavagna “Operation: the perfect website” con le foto di Andrea e Lorenzo e la lista delle cose da fare

I nostri lavori, sui monitor.

Sull'altra scrivania due monitor fanno scorrere alcuni dei siti che abbiamo realizzato per i clienti.

Due monitor sulla scrivania mostrano i siti di ALMA Energia e IMG Rettifica

La spina da non staccare.

Accanto alla presa un biglietto chiede di non staccarla. Chi non resiste può farlo davvero: cosa succede si scopre solo lì.

La presa a muro con le due spine e il biglietto “Do NOT unplug these”

Fatto con

Three.js
React Three Fiber
Rapier
Blender
GSAP
Next.js

Il sito

Angolo per angolo.

Apri un'immagine per vederla in grande.

L'ufficio, dall'ingresso
Le due postazioni
La bacheca dei premi
L'angolo del divano
Il tavolino
Una foto in libreria

Riconoscimenti

Parola alle giurie.

Un progetto nostro non ha un cliente che lascia la recensione. A giudicarlo sono stati GSAP, Awwwards, CSS Design Awards e CSS Winner.

Tutti i riconoscimenti

Site of the Week
GSAP Showcase
Selezionato nello showcase ufficiale di GSAP per l'esperienza 3D interattiva costruita con Three.js, WebGL, Next.js e GSAP.
Vedi il riconoscimento GSAP Showcase (si apre in una nuova scheda)
Website of the Day
CSS Design Awards
La giuria internazionale ha dato un punteggio finale di 8.30, con 8.68 nell'innovazione.
Vedi il riconoscimento CSS Design Awards (si apre in una nuova scheda)
Honorable Mention
Awwwards
Assegnata il 30 agosto 2026, la seconda per lo studio dopo quella del sito Graffico.
Vedi il riconoscimento Awwwards (si apre in una nuova scheda)
Site of the Day
CSS Winner
Scelto come Site of the Day il 20 agosto 2026, il riconoscimento editoriale più importante della piattaforma.
Vedi il riconoscimento CSS Winner (si apre in una nuova scheda)