LIUMAR
UX/UI Design
Prototipazione web per un hub di intrattenimento
Intro interattiva
Biliardo come strumento immersivo
CONCEPT
Volevo che l'intro non fosse un loading screen, ma già parte del prodotto. Ho scelto il biliardo perché era coerente con l'hub di intrattenimento che stavo costruendo, e la meccanica della palla in buca mi dava un pretesto narrativo per la transizione alla home — la telecamera zooma, il canvas svanisce, il sito parte. Da lì in poi ho cercato di mantenere la stessa logica: ogni sezione doveva giustificare la sua forma di navigazione, non usarne una di default.
VISUAL DESIGN
Ho tenuto una palette ridotta — cream e nero, con i colori solo sulle palline — perché il sito ha già molta complessità interattiva e non volevo aggiungere rumore visivo. La tipografia è tutta Roboto Mono, scelta più per coerenza con l'estetica tecnica che per un motivo di brand preciso. L'effetto glitch sul titolo l'ho usato per dare movimento alla hero senza dover mettere video o immagini di sfondo. Il footer riprende gli stessi elementi dell'intro — il cream, le palline in fisica — come chiusura del cerchio.
La navigazione verticale scroll-driven era la scelta più naturale per un sito a sezioni: ogni pannello entra dal basso, niente routing, niente cambio di pagina. Per il Game Room ho usato un accordion orizzontale hover-driven perché avevo otto attività da mostrare e non volevo un carosello — così l'utente esplora senza cliccare. Il booking del cinema l'ho costruito con una seat map generata dinamicamente perché era il modo più diretto per simulare un'esperienza reale, anche se è tutto finto. Per game room e ristorante ho optato per un form più semplice con selezione di persone, dato che non ha senso una mappa posti per un tavolo da biliardo.
STRUMENTI E PROCESSO
Ho usato solo HTML, CSS e JavaScript vanilla. La fisica — sia nel biliardo intro che nei palloni del footer — è scritta da zero. Non ho usato librerie perché volevo capire come funzionava ogni pezzo, e onestamente su un progetto di queste dimensioni un framework avrebbe aggiunto più overhead che valore. Il lato negativo è che il codice è diventato abbastanza monolitico — è tutto in un file — e con il senno di poi avrei strutturato meglio la separazione tra logica e rendering.
