Nella nostra rubrica web design della settimana analizziamo progetti digitali che non solo colpiscono per l’impatto visivo, ma dimostrano anche come una buona esperienza utente possa cambiare il modo in cui percepiamo la realtà. Oggi puntiamo i riflettori su Flashlights, un progetto firmato Tubik Studio in collaborazione con la Jailhouse Lawyers Initiative della NYU School of Law.
Flashlights è una sezione interattiva inserita in un sito esistente che racconta la storia e l’impatto dei jailhouse lawyers: persone detenute che, senza una formazione accademica formale, hanno studiato legge da autodidatti diventando punti di riferimento legali all’interno delle carceri. La sfida era enorme: trasformare un contenuto denso, storico e giuridico in un’esperienza chiara, accessibile e profondamente coinvolgente.
Il risultato è una dimostrazione esemplare di ciò che può realizzare un’agenzia di web design quando unisce UI/UX, motion design, grafica e sviluppo sotto una visione narrativa condivisa. Per studi come il nostro a Barcellona, specializzati in web design, branding digitale e storytelling interattivo, Flashlights diventa un riferimento imprescindibile.
Flashlights porta la firma di Tubik Studio, realtà internazionale nota per l’approccio concettuale ai prodotti digitali. Il progetto riunisce un team multidisciplinare che dimostra come il web design di alto livello sia sempre frutto di un lavoro corale.
La scelta di rendere pubblici questi crediti dice molto della cultura dello studio: il progetto non è solo un “bel sito”, ma il risultato di una collaborazione coordinata tra design, contenuti, tecnologia e gestione, elemento chiave in ogni progetto web complesso per enti, ONG o realtà culturali.
La Jailhouse Lawyers Initiative disponeva di una mole enorme di informazioni: date, casi, tappe giuridiche, biografie, citazioni, risorse accademiche… Una narrazione ricca ma difficile da fruire per il pubblico generalista. La richiesta a Tubik era chiara: creare una sezione all’interno del sito che funzionasse come un percorso storico interattivo, senza appesantire l’utente né snaturare il design complessivo.
C’erano inoltre vincoli tecnici: la sezione doveva integrarsi in una struttura preesistente realizzata in Webflow, rispettando l’identità di base ma aggiungendo una personalità visiva distintiva. Il team ha dovuto gestire un grande volume di immagini e risorse, garantendo tempi di caricamento rapidi e compatibilità con i browser moderni.
In termini di strategia digitale, la sfida si riassume in una frase: trasformare l’informazione in esperienza. Ed è proprio qui che Flashlights eccelle.
Il linguaggio visivo di Flashlights si ispira a manifesti vintage, collage, ritagli di giornale, fotografie d’archivio e appunti manoscritti. Questa commistione crea un’estetica che appare insieme documentaristica ed emotiva: non siamo davanti a un sito corporate tradizionale, ma a una sorta di murale digitale in movimento.
La palette cromatica si basa su due colori principali, evidenziati anche da Awwwards: #F1EADA, un avorio caldo che richiama la carta antica, e #DF4359, un rosso intenso usato per titoli, dettagli e accenti. L’abbinamento evoca sia memoria storica che energia attivista.
Anche la tipografia rafforza questa idea: si alternano font dal taglio editoriale a titoli decisi che rimandano alla stampa e ai manifesti di protesta. Il risultato è un sistema grafico coerente, lontano dall’asettico, perfettamente in linea con la causa sociale rappresentata.
Per gestire la complessità dei contenuti, Tubik sceglie una soluzione classica ma estremamente efficace se ben realizzata: una timeline interattiva. Invece di un testo lungo e difficile da seguire, la storia dei jailhouse lawyers viene suddivisa in tappe e momenti chiave che l’utente può esplorare in sequenza o saltando ai passaggi di maggiore interesse.
Ogni blocco della timeline unisce testi brevi, immagini, collage e composizioni tipografiche. Si creano così piccole “capsule” narrative, facili da leggere, scansionare e visivamente distinte. La sensazione generale è di progressione: l’utente sfoglia pagina dopo pagina, senza mai perdere il filo.
Dal punto di vista del UX design, questo approccio riduce il carico cognitivo su temi complessi, consente diversi livelli di approfondimento — dalla lettura veloce all’esplorazione dettagliata — ed evita l’infinito scroll senza struttura, tipico di molti progetti editoriali.
Flashlights non sarebbe lo stesso senza il lavoro di motion design guidato da Ladamyra Kuntysia. Ogni transizione, effetto di apparizione e micro-animazione ha una funzione narrativa precisa. Nessun movimento è superfluo: tutto serve a scandire il ritmo della lettura.
Procedendo lungo la timeline, gli elementi compaiono con animazioni morbide che ricordano il collage fisico: pezzi che scorrono, cornici che si sovrappongono, foto che si stratificano. Questo rafforza la sensazione di sfogliare un archivio vivo.
Lo scroll diventa una vera leva di storytelling. Non serve solo a “scendere” nella pagina: attiva cambi di composizione, mette in risalto dati, riposiziona mappe e fa emergere citazioni. È una soluzione sempre più diffusa nei progetti premiati da Awwwards e perfettamente in linea con il trend dello scroll narrativo.
Anche se il risultato appare leggero, il progetto è tecnicamente sofisticato. Lo sviluppatore Oleksii Dubrov ha dovuto integrare questa sezione in un sito Webflow già esistente, lavorando con numerose immagini ottimizzate in WebP, livelli e blend modes per simulare texture, animazioni personalizzate e compatibilità cross-browser senza sacrificare la ricchezza visiva.
Il bilanciamento tra impatto visivo e performance è uno dei motivi per cui Flashlights ha ottenuto l’Awwwards Developer Award. Un promemoria di come il web design contemporaneo richieda una stretta collaborazione tra designer e sviluppatori, soprattutto quando si tratta di esperienze ricche di contenuti.
Oltre all’aspetto visivo, il successo del progetto si fonda su un tono editoriale calibrato con cura. I contenuti sono rigorosi, con dati, date e contesto storico ben documentati; accessibili, senza tecnicismi giuridici inutili; rispettosi verso le persone raccontate e le loro esperienze; e chiaramente impegnati, nel senso che invitano a riflettere e a prendere posizione.
La grafica di Maryna Solomennykova fa da ponte tra contenuto e utente: ogni elemento visivo rafforza la voce del testo, evitando che il progetto scivoli nella freddezza accademica. Un equilibrio delicato, ma perfettamente riuscito.

Flashlights ha ricevuto numerosi riconoscimenti internazionali che ne attestano l’eccellenza: Awwwards Site of the Day, Awwwards Honorable Mention, Awwwards Developer Award, nomination come Site of the Month su Awwwards e candidatura ai Webby Awards. Non è un caso: racchiude tutto ciò che oggi si ricerca nel web design di alto livello — idea solida, responsabilità sociale, esecuzione visiva impeccabile, attenzione all’esperienza utente e performance tecnica di rilievo.

Flashlights offre diversi insegnamenti che ogni studio di web design o istituzione può applicare ai propri progetti: anche i contenuti complessi diventano fruibili se ben strutturati e supportati da un sistema visivo coerente; il design non deve edulcorare i problemi, ma aiutarci a guardarli in faccia con più contesto ed empatia; la narrazione interattiva è particolarmente efficace per progetti educativi, di memoria storica o giustizia sociale; e l’integrazione tecnica è importante quanto l’estetica.

Flashlights dimostra che il web design con uno scopo può essere bello, emozionante e tecnologicamente avanzato allo stesso tempo. Non è solo una sezione di un sito istituzionale: è un pezzo di memoria digitale, uno strumento didattico e una piattaforma di attivismo.
Per chi lavora in web design, branding ed esperienza digitale, questo progetto conferma che le migliori interfacce non sono quelle che urlano più forte, ma quelle che fanno luce su storie che raramente trovano spazio. In questo senso, il lavoro di Tubik Studio con Jailhouse Lawyers Initiative rende davvero onore al nome del progetto: vere e proprie torce accese in un sistema che preferisce lasciare molte cose nell’ombra.
Analizziamo la tua situazione attuale e definiamo il prossimo passo.
Contatta oraEsamineremo la tua attuale situazione digitale. Ti contatteremo per comprendere il tuo contesto e valutare insieme quali aree analizzare, e successivamente prepareremo un audit con i punti chiave e le raccomandazioni.