Servizi

Cosa faccioDal contesto al codice

Portali B2B, back office, piattaforme di dati, servizi pubblici. Progetto l’esperienza, costruisco l’interfaccia, la porto fino in produzione e ne misuro i risultati.

Di solito sono quattro persone diverse. Tenerle nella stessa testa è ciò che cambia il risultato: niente si perde nel passaggio tra chi disegna, chi sviluppa e chi misura.

Energia · Media · Telco · Pubblica amministrazione · Editoria

Servizio 01

UX/UI DesignArchitettura e interfacce

Progetto portali, back office, dashboard e servizi digitali partendo dai processi reali: chi li usa, cosa deve ottenere, dove oggi si blocca. Il risultato è un’interfaccia che rende semplice una cosa che semplice non è.

Per chi
Aziende e PA
Output
Prototipi e UI kit
Strumenti
Figma, FigJam

Cosa consegno

  • Analisi dei requisiti
  • Architettura informativa
  • User flow
  • Wireframe
  • Prototipi navigabili
  • UI design
  • Design system
  • Accessibilità WCAG
Dal flusso alla schermata Illustrazione: un post-it di ricerca sull’utente, tre schermate in wireframe collegate da un flusso di prototipo, un cursore che lo percorre e le schermate che diventano interfaccia finita, con verifica di accessibilità.Portale servizi · Flusso utente▶ Prototipo01 · AccessoJNAccedi02 · Cruscotto03 · Dettaglio praticaPratica 2026/1141440 × 1024CHI LO USAOperatore di sportello:deve trovare una praticain meno di tre clic.Contrasto AATastiera3 clicVERIFICHE
T.0001WireframeDal flusso alla schermata

Servizio 02

Front-endDal design al codice

Vengo dal design ma leggo e scrivo codice: quando consegno un’interfaccia so già come verrà costruita. Porto i layout fino al browser, responsive e accessibili, oppure affianco il team di sviluppo perché il risultato resti fedele al progetto.

Per chi
Team di sviluppo
Output
Temi e componenti
Strumenti
HTML, CSS, JS

Cosa consegno

  • HTML semantico
  • CSS e layout responsive
  • JavaScript
  • Temi WordPress
  • Componenti riusabili
  • Performance
  • Handoff allo sviluppo
  • Manutenzione
Dal codice alla pagina Illustrazione: a sinistra un editor dove si scrive il codice HTML e CSS, a destra l’anteprima nel browser che si costruisce di pari passo, sotto i punteggi di qualità della pagina.index.htmlstyle.csslocalhost:80801<header class="testata">2 <a class="logo">JN</a>3 <nav>…</nav>4</header>5<section class="apertura">6 <h1>Dal design al codice</h1>7 <a class="btn-primary">Scopri</a>8</section>9<ul class="griglia">10 <li class="scheda">…</li>11</ul>1213.griglia {14 display: grid;15 grid-template-columns:16 repeat(3, 1fr);17 gap: 12px;18}JNDAL DESIGNAL CODICEAUDIT DELLA PAGINA98Prestazioni100Accessibilità100Buone pratiche100SEO
T.0002CodiceIl layout diventa prodotto

Servizio 03

SEO & AnalyticsVisibilità e misura

Un sito che nessuno trova non esiste, uno che non si misura non migliora. Curo la SEO tecnica e on-page e imposto la raccolta dati, perché ogni scelta di progetto abbia un numero che la conferma o la smentisce.

Per chi
Marketing e prodotto
Output
Audit e dashboard
Strumenti
GA4, GTM, Search Console

Cosa consegno

  • Audit SEO tecnico
  • SEO on-page
  • Search Console
  • GA4 e Tag Manager
  • Dashboard Looker Studio
  • Monitoraggio KPI
  • Analisi di traffico e conversioni
  • Check periodici
Dashboard SEO illustrata Illustrazione: clic e impressioni dalla ricerca organica in crescita, CTR e posizione media in miglioramento, query principali che salgono di posizione.Rendimento della ricerca · ultimi 6 mesiLiveCLIC TOTALI12,4K▲ +38%IMPRESSIONI486K▲ +52%CTR MEDIO2,6%▲ +0,4POSIZIONE MEDIA8,2▲ 4,1 posizioniAprMagGiuLugAgoSetTRAFFICO ORGANICOClicImpressioniQUERY PRINCIPALIPOSIZIONEweb designer roma3▲11sviluppo sito wordpress4▲7ux ui designer freelance6▲13
T.0003DashboardTraffico e conversioni

Servizio 04

Visual DesignIdentità e comunicazione

La formazione in grafica è da dove vengo e resta il mio metro per tipografia, colore e composizione. La metto al servizio di identità, materiali corporate e progetti editoriali, sempre dentro un sistema coerente.

Per chi
Brand e comunicazione
Output
Identità e layout
Strumenti
Adobe CC, Figma

Cosa consegno

  • Brand identity
  • Materiali corporate
  • Grafica editoriale
  • Presentazioni
  • Campagne digitali
  • Infografiche
Dal marchio al sistema Illustrazione: una tavola di linee guida di marca. Il marchio nasce dalle linee di costruzione, poi compaiono palette, caratteri tipografici e le applicazioni: biglietto da visita, copertina e post social.Linea Studio · Linee guida del marchiop. 04COSTRUZIONEPALETTETeal#1A6B6BPolvere#4E5F72Nebbia#6D8196Velo#D6E4E4TIPOGRAFIAAaBarlow SemiBoldTitoliAaInterTestoAPPLICAZIONILINEA STUDIOBiglietto da visitaQUADERNIDI PROGETTOCopertinaNuovosito onlinePost socialKit colori
T.0004IdentitàDal marchio al sistema

Come collaboriamoTre modi di lavorare

  • ConsulenzaDecisioni mirate

    Una revisione esperta su interfaccia, SEO o dati, quando serve una scelta e serve farla bene.

  • Nel tuo teamCompetenze che mancano

    Mi integro in un team già operativo e copro UX/UI, front-end o analytics dove servono.

  • Progetto completoDal contesto al codice

    Seguo tutto il percorso: analisi, design, sviluppo front-end e misurazione dei risultati.

Hai un progetto da avviare?Raccontami il contesto.

Obiettivi, vincoli, tempi: troviamo insieme la modalità di collaborazione più adatta.

Parliamo del progetto