Una piccola introduzione Cosa imparerai nel corso web design e UX
Il corso web design e UX è un percorso formativo per chi progetta o supervisiona siti web aziendali (designer interni, marketing manager con responsabilità progetto, agenzie con team prodotto) e vuole imparare il processo completo: user research, information architecture, wireframe, UI con design system, accessibilità WCAG, prototipazione su Figma. Gli esercizi vengono fatti su Figma con progetti reali del partecipante.
Differenza dai corsi generici di web design: qui non ci concentriamo sulla "creatività" ma sul **processo che porta a un sito che converte**. Research vera prima di disegnare, gerarchie di informazione che riflettono i bisogni dell'utente, design system riusabile che regge nel tempo, accessibilità integrata da subito (non aggiunta dopo), prototipo testato prima di scrivere codice.
Da Vicenza dal 2008 con oltre 200 allievi formati e oltre 180 progetti seguiti: progettiamo siti per PMI italiane, e-commerce, portali B2B, siti istituzionali. Il design senza UX è solo decorazione, l'UX senza accessibilità è incompleta: il corso integra tutto in un processo unico testato sul campo.
Esempi tipici Tre esempi di intervento, in settori diversi
Esempio · settore servizi B2B Marketing manager di una società di servizi (settore consulenza)
Percorso 1-to-1 di 14 ore con focus su redesign del sito istituzionale. Research interna con interviste a clienti chiave, wireframe della home e dell'area download, design system di base, verifica accessibilità WCAG sui componenti critici. Prototipo testato con 3 utenti reali.
14 ore redesign completato
Esempio · settore e-commerce moda Designer interno di un produttore B2C (settore tessile)
Percorso 1-to-1 di 12 ore con focus su design system per WooCommerce: token coerenti col brand, componenti riusabili per scheda prodotto e checkout, accessibilità WCAG dei form. Riduzione del tempo di progettazione di nuove pagine del 50% grazie al design system.
12 ore design system completato
Esempio · settore enti e istituzioni Team comunicazione di un ente con obbligo AGID (settore culturale)
Academy aziendale di 20 ore per 5 persone (designer + redazione) con focus AGID + WCAG. Linee guida di design system con accessibilità integrata, manuale interno con checklist pre-rilascio, wireframe testati con utenti reali screen reader.
5 persone formate
Cosa includiamo I 4 moduli del corso web design e UX
Programma operativo, esercizi su Figma e sul caso reale.
User research
Capire l'utente prima di disegnare.
Come fare interviste a clienti reali (script, conduzione, codifica), come leggere i dati GA4 esistenti per capire i flussi reali, come fare osservazione in punto vendita o customer care, come costruire personas operative (non personaggi inventati) basate sui dati. Niente pareri di ufficio: il design parte da quello che l'utente fa davvero.
- Script di intervista a cliente reale
- Lettura dati GA4 e flussi
- Osservazione in punto vendita
- Personas operative basate sui dati
- Mappa journey con dolori e leve
Wireframe e flussi
Information architecture e prototipo low-fi.
Come costruire la gerarchia di contenuto del sito (information architecture), come disegnare wireframe a bassa fedeltà su Figma per testare le scelte prima di disegnare, come gestire navigazione, footer, breadcrumb, ricerca interna, gerarchie pagina pillar/categoria/dettaglio. Il wireframe è il momento per discutere e cambiare, prima di disegnare.
- Information architecture del sito
- Wireframe low-fi su Figma
- Navigazione, footer, breadcrumb
- Gerarchie pillar/categoria/dettaglio
- Test del wireframe con utenti
UI e design system
Riusabilità che regge nel tempo.
Come progettare con un design system: token (colori, tipografia, spaziature, ombre), componenti riusabili (button, card, form), griglie e layout, varianti per stato (default, hover, active, disabled). Niente progetti che si scollano dopo 3 sezioni: il design system è il vero asset di lungo periodo del sito.
- Token (colori, tipografia, spaziature)
- Componenti riusabili
- Griglie e layout
- Varianti per stato
- Documentazione del design system
Accessibilità WCAG integrata
Niente fix dopo, integrata da subito.
Come progettare considerando l'accessibilità WCAG 2.1 AA fin dal wireframe: contrasti minimi 4.5:1, dimensioni testo, gestione del focus, ordine TAB logico, etichette form esplicite, alt text per immagini significative, navigazione da tastiera, compatibilità con screen reader. Integrarla da subito costa zero, aggiungerla dopo costa molto.
- Contrasti WCAG dal wireframe
- Focus visibile su tutti i componenti
- Ordine TAB logico nelle pagine
- Etichette form esplicite
- Alt text per immagini significative
- Verifica con NVDA prima del rilascio
Il problema Errori tipici nel web design aziendale
Pattern che vediamo prendendo in carico siti progettati senza processo:
- Progettazione partita dal mood board: bello, ma non risponde a un bisogno utente
- Niente user research: il design riflette i pareri dell'azienda, non i comportamenti dei clienti
- Niente wireframe: si va direttamente in UI, modificare diventa costoso
- Niente design system: dopo 3 sezioni il sito si scolla, ogni nuova pagina è un'invenzione
- Accessibilità aggiunta dopo: contrasti sbagliati, focus invisibile, etichette mancanti, costo di fix moltiplicato
- Componenti senza varianti per stato: tutto si scopre quando si scrive codice
- Niente prototipo testato: gli errori escono dopo il go-live, quando costano dieci volte tanto
Il nostro corso: research vera, wireframe prima di UI, design system riusabile, accessibilità integrata, prototipo testato prima di codice.
I vantaggi Cosa ti porti a casa dal corso
Quello che ti porti a casa
Risultati per designer, marketing manager con progetto, team prodotto:
- Processo completo di progettazione testato
- Skill di research: interviste, GA4, osservazione
- Wireframe e prototipo su Figma
- Design system riusabile
- Accessibilità WCAG integrata dal wireframe
- Capacità di valutare proposte di agenzie esterne
- Materiali e checklist per il team o per i prossimi progetti
Come lavoriamo Le 4 fasi del percorso
1. Research
Sessioni 1-2.
- Interviste a cliente reale
- Lettura dati GA4
- Osservazione in punto vendita
- Personas e journey
2. Wireframe
Sessioni 3-4.
- Information architecture
- Wireframe low-fi su Figma
- Test con utenti
- Iterazione e validazione
3. UI e design system
Sessioni 5-6.
- Token (colori, tipografia, spaziature)
- Componenti riusabili
- Varianti per stato
- Documentazione
4. Accessibilità + prototipo
Sessioni 7-8.
- Verifica contrasti e focus
- Ordine TAB e tastiera
- Etichette form ed alt
- Prototipo finale testato
Strumenti Stack che usiamo nel corso
Strumenti reali per chi progetta siti aziendali:
- Figma per wireframe, UI, prototipo, design system
- Maze / UserTesting per i test con utenti
- Google Analytics 4 per la lettura dei flussi reali
- Strumenti di analytics comportamentale per heatmap e replay di sessione
- axe DevTools per la verifica accessibilità
- NVDA + VoiceOver per la prova screen reader
- Stark per i contrasti WCAG su Figma
Tecnologie Stack tecnico del corso
WordPress
Astro
WordPress
Astro Risultati Cosa garantiamo a fine corso
Quello che il partecipante porta a casa:
- Processo di progettazione end-to-end
- Wireframe e prototipo su Figma
- Design system riusabile
- Accessibilità WCAG integrata dal wireframe
- Materiali e checklist
- Capacità di valutare proposte esterne
Quanto costa il corso web design e UX? +
Il percorso è dimensionato sul tuo team: formato (1-to-1 o academy aziendale), numero di ore, livello strategico e modalità (remoto o in sede) cambiano il quadro. Niente listini standard: prima cosa che facciamo è una call discovery per capire obiettivi e profili in aula, poi mandiamo un preventivo scritto entro 48 ore.
Quante ore servono? +
Per la versione completa (research + wireframe + UI + accessibilità): 10-16 ore. Per chi è già operativo e vuole solo un modulo specifico (es. design system): 4-6 ore. Per academy aziendali con team designer + comunicazione: 16-24 ore distribuite su mezze giornate.
Mi serve già usare Figma? +
Sapere usare Figma a livello base aiuta. Se sei completamente nuovo, il primo modulo include una mezza giornata di base Figma. Se sei già fluente, partiamo direttamente dal processo di research.
Vale anche se non sono un designer? +
Sì, è un buon corso anche per marketing manager con responsabilità progetto e per imprenditori che vogliono valutare proposte di agenzie esterne. La parte UI di dettaglio è più tecnica, ma il processo (research, wireframe, prototipo, accessibilità) è strategico e utile a chi prende decisioni.
Imparo a scrivere codice HTML/CSS? +
No, questo è un corso di progettazione su Figma, non di sviluppo. Per chi vuole scrivere codice ci sono percorsi 1-to-1 dedicati su WordPress sviluppo o su frontend Astro. Il prototipo che produciamo è in Figma e poi va passato al team dev.
Il corso copre l'accessibilità? +
Sì, è uno dei 4 moduli principali. L'accessibilità WCAG va integrata dalla progettazione, non aggiunta dopo. Il modulo include verifica contrasti, focus, ordine TAB, etichette, alt, prova con NVDA. Per percorsi dedicati solo accessibilità ci sono i corsi specifici del cluster.
Cosa NON fate? +
Niente trend per i trend (parallax inutili, animazioni gratuite). Niente design senza research. Niente UI senza wireframe. Niente accessibilità aggiunta dopo. Niente sostituzione di un designer professionista per casi enterprise complessi: per quei casi conviene un'agenzia di design dedicata.