PROGETTO PERSONALE / UX/UI & FRONTEND
Il mio portfolio.
Dal wireframe al browser.
Ho progettato e sviluppato Digital Web Designer per rendere visibile il legame tra le mie competenze UX/UI e frontend. Il sito che stai esplorando è il progetto e la prima dimostrazione del mio lavoro.
Il problema e l’obiettivo.
Chi valuta un designer deve poter capire rapidamente cosa sa fare, quale contributo porta e come lavora. Una descrizione delle competenze, da sola, non mostra come un’idea diventa un’esperienza funzionante.
L’obiettivo è mostrare questa continuità prima della presentazione: struttura, interfaccia e codice diventano parti esplorabili dello stesso progetto. Il percorso conduce al case study, al profilo o al contatto, secondo ciò che serve a chi visita.
I vincoli del progetto.
Ho mantenuto il logo, il blu e la base grafite dell’identità. Il progetto doveva funzionare anche su mobile e da tastiera, senza rendere le animazioni un passaggio obbligatorio per leggere i contenuti. Il case study pubblicato riguarda il portfolio personale: non attribuisce risultati a clienti.
Le scelte UX/UI.
Il lavoro prima della biografia.
La homepage presenta il ruolo e permette subito di esplorare il progetto. Profilo e servizi rispondono a domande diverse: cosa posso portare a un team e come posso contribuire a un sito web.
Tre prospettive, una composizione.
Il wireframe mostra la gerarchia, l’interfaccia introduce tipografia e colore, il codice rappresenta la realizzazione. Il cambio di prospettiva mantiene lo stesso spazio e aggiorna una breve spiegazione: l’interazione serve a raccontare una decisione.
La realizzazione frontend.
Un layout che puoi provare.
L’anteprima del portfolio è costruita con elementi HTML. Una container query cambia la composizione quando il contenitore si restringe: testo e immagine passano da affiancati a verticali. Pulsanti e controllo di larghezza permettono di confrontare i due comportamenti.
Contenuti prima delle funzionalità aggiuntive.
PHP rende disponibili testi e collegamenti nell’HTML. Il JavaScript aggiunge il menu dialog, il confronto delle prospettive e l’anteprima responsive. Un font variabile locale, asset minificati e nessuna libreria JavaScript nell’interfaccia pubblica limitano le dipendenze.
Verifica e limiti.
La verifica riguarda collegamenti, metadati e contenuti renderizzati, oltre al comportamento di menu, controlli e layout a larghezze diverse. Il menu gestisce la chiusura con Escape e il ritorno del focus; i contenuti principali restano disponibili senza JavaScript.
Questi controlli non equivalgono a una certificazione di accessibilità né a dati di utilizzo reale. Non sono ancora pubblicati risultati di test con utenti, Core Web Vitals sul traffico reale o misure sull’effetto del redesign sui contatti.
Il risultato che puoi esplorare.
Un portfolio in italiano e inglese che collega competenze, servizi e una dimostrazione funzionante. Il risultato documentabile oggi è il sito: puoi confrontare il wireframe con l’interfaccia, cambiare la larghezza dell’anteprima e seguire le scelte spiegate in questo progetto.