CASE STUDY / PORTFOLIO 2026
Dal dettaglio
all’esperienza.
Digital Web Designer è il mio portfolio. L’ho usato come banco di prova: ogni scelta che propongo a un cliente, qui ho dovuto prenderla per me, dall’identità al codice.
La domanda.
Un portfolio di solito elenca competenze. Volevo che questo le facesse vedere: chi lo apre deve capire come lavoro usando il sito, prima ancora di leggere.
Sono partito da due cose che avevo già: il logo e la mia faccia. Nella hero un ritratto illustrato sta dentro una composizione vettoriale, e un tracciato Bézier lo collega a un frammento di interfaccia.
Un’identità che genera il sito.
Il logo non l’ho toccato. Dalla sua inclinazione, dai tratti arrotondati e dal punto blu ho ricavato allineamenti e proporzioni. Montserrat e i blu dell’identità reggono tutto il sito; il pixel torna in pochi punti come unità di composizione, senza nostalgia retrò.
La logica dell’esperienza.
Esplorazione, poi approfondimento.
La homepage presenta ruolo e progetto, poi invita ad approfondire il profilo. Competenze, percorso e formazione hanno spazio nella pagina dedicata. I percorsi verso team e clienti restano distinti nel contatto.
Un’interazione che spiega.
Il controllo della hero rivela i quattro nodi e le maniglie del Bézier, mantenendo il ritratto fermo e il volto libero da sovrapposizioni. L’anteprima del progetto permette di cambiare larghezza: testo e immagine si dispongono in relazione allo spazio. Le interazioni restano volontarie, senza scroll obbligato.
Il menu, parte del progetto.
Il campo blu riprende l’identità, mentre una tavola grafite richiama la hero. Ogni voce ha un percorso chiaro; con puntatore o focus la tavola mostra lo schema corrispondente. Il segno indica l’esplorazione, il numero evidenziato identifica la pagina o la sezione corrente.
Il dialogo nativo contiene il focus. Escape e Chiudi restituiscono il controllo al pulsante di apertura; i link interni portano il focus alla destinazione. Il movimento ridotto rende immediati apertura e chiusura.
Il frontend.
Niente framework e nessuna libreria: PHP per i template, SCSS, JavaScript senza dipendenze. Il ritratto è servito in AVIF con ripiego WebP, in tre larghezze; forme e tracciati sono SVG. Il sito non carica risorse di terze parti e non usa cookie. L’anteprima del progetto risponde alla larghezza del suo contenitore, non a quella dello schermo.
Testi e link sono disponibili nell’HTML. I controlli interattivi si attivano con JavaScript; il controllo dei tracciati comunica il proprio stato anche alla tastiera. La preferenza di movimento ridotto disattiva ingresso e transizioni.
Prova il layout responsiveStrumenti e limiti.
In questo progetto l’AI mi ha aiutato a confrontare alternative di concept, nello sviluppo frontend e nella creazione del ritratto illustrato, generato da mie fotografie. Le scelte, le correzioni e la rifinitura sono mie.
Cosa non trovi qui: numeri. Il sito è nuovo e non ho ancora dati d’uso da mostrare. Quando ci saranno, li aggiungo.