Revisore AI UI/UX: critica del design alla radice a partire dagli screenshot
2026-08-28
Revisore UI/UX ti aiuta a creare interfacce più chiare e usabili leggendo uno screenshot come farebbe un responsabile senior del design: gerarchia, spaziatura, stati mancanti, accessibilità e convenzioni della piattaforma inclusi. Mentre la maggior parte dei feedback si limita a cercare difetti nei pixel o a riversare una checklist automatizzata, questa AI diagnostica le cause principali e ti indica cosa correggere per prima cosa.
✅ Legge la gerarchia visiva, i sistemi di spaziatura e la coerenza dei componenti da un'immagine statica ✅ Segnala gli stati vuoti, di errore, caricamento e disabilitato che gli screenshot nascondono ✅ Verifica contrasto, dimensione delle aree interattive e indipendenza dal colore rispetto agli standard di accessibilità ✅ Calibra il feedback per designer, sviluppatori, product manager e principianti
Un'incoerenza nella spaziatura raramente è un caso isolato. Di solito significa che non esiste un sistema di spaziatura. Un'etichetta secondaria sbiadita raramente è solo «un grigio da scurire»: spesso è un problema di scala tipografica e contrasto che si ripeterà su ogni schermata. Questa è la differenza tra una revisione che elenca interventi puntuali e una revisione condotta da un responsabile del design.
Per capire perché questa distinzione sia importante, è utile osservare come i prodotti deludono concretamente gli utenti oggi e perché la maggior parte dei processi di revisione non intercetta mai i problemi che hanno il costo più elevato.
Risposta rapida: cos'è il Revisore UI/UX?
Il Revisore UI/UX è un critico del design basato sull'AI che analizza gli screenshot per diagnosticare gerarchia, spaziatura, stati mancanti e problemi di accessibilità, prescrivendo poi correzioni alla radice. Valuta la schermata rispetto al suo obiettivo, non in base a una preferenza estetica generica.
Funzionalità principali:
- Diagnosi della gerarchia visiva, della tipografia, del colore e della spaziatura basata su una griglia da 8 px
- Chiarezza delle interazioni: affordance, CTA e insieme completo degli stati dei componenti
- Revisione dell'accessibilità allineata ai principi WCAG, non a una checklist aggiunta a posteriori
- Critica consapevole della piattaforma per le convenzioni di iOS, Android, web e desktop
- Risultati classificati per gravità, con passaggi successivi concreti a livello di sistema
Perché la maggior parte delle revisioni UI non individua i problemi che gli utenti incontrano davvero
Le interfacce diventano sempre più dense. La valutazione del 2026 di WebAIM su un milione di home page ha rilevato una media di 1.437 elementi per pagina, con un aumento del 22,5% in un solo anno. Più elementi significano più punti in cui la gerarchia può crollare, le etichette possono scomparire e il contrasto può fallire.
L'accessibilità è la versione più misurabile di questo cedimento:
56,1 errori per pagina — media degli errori di accessibilità rilevati, con un aumento del 10,1% rispetto al 2025
83,9% — di quelle home page falliva esclusivamente a causa del testo a basso contrasto
I sei tipi di errore ricorrenti — contrasto insufficiente, alternative testuali mancanti per le immagini, campi di input senza etichetta, link vuoti, pulsanti vuoti e lingua del documento mancante — rappresentano ancora la maggior parte degli errori rilevati automaticamente. WebAIM riferisce che il 96% degli errori rilevati rientra in queste categorie. I verificatori automatizzati sono utili in questo ambito. Ma sono anche incompleti.
Il framework sui metodi di ricerca del Nielsen Norman Group traccia una netta distinzione tra ciò che le persone fanno e ciò che uno strumento può contare. Gli scanner quantitativi rispondono alla domanda «quanti problemi di contrasto ci sono?». Non possono dire se l'azione principale è visivamente più debole di un chip secondario, se uno stato vuoto non è mai stato progettato o se i filtri di una dashboard competono con i dati che dovrebbero servire. Questa è una critica qualitativa e consapevole dell'intento: il tipo di analisi per cui vengono assunti i revisori senior e che la maggior parte dei team riceve una sola volta, tardi e sotto pressione.
Il costo umano non è teorico. Si stima che 1,3 miliardi di persone vivano con una disabilità, mentre le cause legali relative all'accessibilità negli Stati Uniti continuano a rappresentare un rischio concreto di non conformità. Nel frattempo, le WCAG 2.2 hanno aggiunto criteri di successo dedicati alle aree interattive su mobile, alla visibilità del focus, alle alternative al trascinamento e a un'autenticazione che non blocchi i gestori di password: standard che molti prodotti rilasciati non hanno ancora assimilato.
Eppure ottenere una revisione che migliori davvero il prodotto resta frustrantemente difficile:
- Il feedback arriva troppo tardi. La critica spesso arriva quando l'ingegneria è già a metà dello sviluppo, in un momento in cui modificare un sistema di spaziatura o un modello di navigazione è costoso.
- Le checklist confondono i sintomi con i sistemi. «Riduci questo spazio di 8 px» non risolve le 40 schermate successive se non esiste una baseline da 4/8 px.
- Gli screenshot nascondono la UX. Gli stati vuoti, di errore, caricamento, disabilitato e overflow sono i punti in cui i prodotti falliscono, ma raramente compaiono nel mockup del percorso ideale.
- Strumenti e gusto parlano linguaggi diversi. Gli sviluppatori ricevono note estetiche che non possono implementare; i designer ricevono rapporti di contrasto senza una diagnosi della gerarchia; i PM ricevono un mare di osservazioni tutte con la stessa priorità.
È esattamente questo lo scopo di una revisione del design senior, nativa degli screenshot.
Perché scegliere il Revisore UI/UX
Il Revisore UI/UX considera ogni upload una critica del design, non un semplice controllo lint. Prima legge l'intento — che cos'è la schermata, a chi è destinata e cosa deve portare a termine l'utente — poi valuta l'esecuzione rispetto a quell'intento. Un login minimale e una dashboard operativa ricca di dati non vengono valutati con la stessa griglia.
| Approccio tradizionale | Revisore UI/UX |
|---|---|
| Aspettare giorni per trovare uno spazio nel calendario di un designer senior | Caricare uno screenshot e ottenere una revisione prioritaria nella stessa sessione |
| Gli scanner automatizzati rilevano contrasto ed etichette mancanti | Diagnostica gerarchia, affordance, testi e stati che gli scanner non possono vedere |
| Note sui pixel senza un sistema sottostante | Individua la causa principale: scala tipografica, griglia di spaziatura o libreria di componenti mancanti |
| Un unico elenco generico di problemi per gravità | Critico / alto / medio / basso, ordinati in base all'impatto sul compito |
| Lo stesso tono per ogni pubblico | Calibrazione per designer, sviluppatore, PM o principiante |
La revisione è specifica. Il contrasto viene discusso in termini di rapporti e WCAG, non con un generico «questo grigio sembra troppo chiaro». Le aree interattive vengono verificate rispetto alle indicazioni della piattaforma, come il minimo di 44×44 pt di Apple e le fondamenta dell'accessibilità di Material 3. Gli stati mancanti vengono indicati come risultati della revisione, non inventati per colmare le lacune.
Prima la gerarchia, poi la decorazione
Dimensione, peso, colore, posizione, prossimità ed elevazione dovrebbero guidare l'attenzione in sequenza. Se un badge dello sconto sovrasta il pulsante di pagamento, la schermata non è semplicemente «affollata»: la gerarchia è invertita. Il revisore parte da questo tipo di problema perché impedisce la comprensione.
Gli stati come deliverable di prima classe
Default, hover, attivo, focus, disabilitato, caricamento, vuoto, errore e successo formano l'insieme completo degli stati di un componente. Gli stati mancanti sono la lacuna a livello esperto più frequente. Un modulo che esiste solo nella sua condizione perfettamente compilata non è finito, anche se i pixel appaiono curati.
L'accessibilità come usabilità
Le WCAG 2.2 sono organizzate attorno a quattro principi: percepibile, utilizzabile, comprensibile e robusto. I nuovi criteri della versione 2.2 riguardano il focus non oscurato, la dimensione minima delle aree interattive, i movimenti di trascinamento, l'assistenza coerente, l'inserimento ridondante e l'autenticazione accessibile. Il revisore li applica in modo diagnostico — il colore non deve mai essere l'unico elemento a veicolare un significato, l'ordine del focus deve essere logico e il movimento non deve essere obbligatorio — invece di limitarsi a recitare la specifica.
Convenzioni della piattaforma, non una generica «UI pulita»
gli Human Interface Guidelines di iOS, Material 3 e le convenzioni di moduli e browser web sono contratti diversi. Una barra di schede inferiore che inverte il trattamento delle icone selezionate e non selezionate sembrerà sbagliata agli utenti iOS anche se è ordinata dal punto di vista visivo. Il revisore identifica la piattaforma dagli indizi visivi quando non la specifichi.
Esempi di prompt:
«Esamina questa schermata di pagamento iOS. È un MVP. Dimmi cosa potrebbe impedire a un utente al primo utilizzo di pagare.»
«Questa dashboard SaaS è destinata ai responsabili delle operations. Critica gerarchia, densità e tutto ciò che non ho progettato per gli stati vuoti e di errore.»
«Sono uno sviluppatore che sta implementando questo frame di Figma in React. Dammi note consapevoli dell'implementazione: token di spaziatura, contrasto e aree di interazione.»
Come funziona
Non ti serve un documento completo sul sistema di design per iniziare. Bastano uno screenshot chiaro e una frase di contesto. Il revisore AI analizza ciò che è visibile, segnala ciò che non può essere valutato da un'immagine statica e stabilisce che cosa modificare per prima cosa.
Passaggio 1: carica la schermata che vuoi davvero far valutare
Cattura la UI reale o il mockup ad alta fedeltà: includi l'intera finestra, non solo un pulsante ritagliato troppo strettamente. Le immagini sfocate, molto piccole o fortemente compresse passano attraverso un controllo di qualità: ti verrà chiesto di fornire una cattura migliore, invece di ricevere una revisione sicura di pixel che non sono visibili.
«Ecco l'hero della home page in produzione su desktop. Ignora la rifinitura del testo marketing; dimmi se la gerarchia e il contrasto della CTA reggono.»
Passaggio 2: indica intento, piattaforma e fase
Una frase modifica lo standard della critica. Un MVP richiede osservazioni sulla chiarezza strutturale; un prodotto pre-lancio richiede sia struttura sia rifinitura. Indica la piattaforma (iOS, Android, web, desktop) e il compito che l'utente sta cercando di completare.
«Schermata delle impostazioni Android, Material 3, pre-lancio. Gli utenti non riescono a trovare i controlli delle notifiche.»
Passaggio 3: leggi la critica organizzata per priorità
Aspettati una valutazione della prima impressione, punti di forza autentici (specifici, non un generico «sembra pulito») e poi i problemi ordinati per gravità. Ogni risultato include cosa non funziona, il principio alla base e una correzione concreta. Le lacune di sistema — nessuna scala di spaziatura, nessuna scala tipografica, nessuna libreria di componenti — vengono indicate come cause principali, non come un mucchio di osservazioni scollegate.
Passaggio 4: completa ciò che lo screenshot non può mostrare
Chiedi gli stati vuoti, di errore, caricamento e overflow. Invia una seconda schermata dello stesso flusso per verificare la coerenza. Per le iterazioni di una stessa schermata, chiedi un confronto esplicito prima/dopo: cosa è migliorato, cosa è peggiorato e cosa è ancora da risolvere.
«Stessa dashboard dopo aver aggiunto una griglia da 8 px. Che cosa è migliorato e cosa continua a compromettere la leggibilità a colpo d'occhio?»
Passaggio 5: trasforma i risultati in un sistema, non in una correzione per una sola schermata
Se la revisione segnala che i tuoi spazi da 12 px entrano in conflitto con un modello mentale da 8 px, la correzione è un insieme di token di spaziatura, non un singolo margine. Se il colore veicola da solo tutto il significato degli stati, la correzione consiste nell'aggiungere forma ed etichetta, applicandole ovunque compaia uno stato. Quando il prodotto ha bisogno anche di un sistema visivo documentato per prevenire il prossimo ciclo di incoerenze, il Generatore di kit del brand può trasformare queste decisioni in palette, tipografia e linee guida riutilizzabili da tutto il team.
Prova il Revisore UI/UX gratis: non è richiesta alcuna carta di credito.
Risultati e casi d'uso
📊 Un founder che revisiona un MVP prima che si cristallizzi
Scenario: Una startup di due persone sta per presentare un flusso di onboarding web ai primi 50 utenti. In Figma le schermate sembrano «pulite». Nessuno ha verificato gli stati vuoti, i messaggi di errore o se il pulsante principale rimane accessibile nella viewport di un laptop di medie dimensioni.
Approccio tradizionale: Prenotare un designer freelance, aspettare una settimana e ricevere una presentazione con 40 osservazioni senza priorità — oppure procedere al rilascio e imparare dal churn.
Revisore UI/UX: Carica le tre schermate principali con il contesto «MVP web consumer, l'obiettivo è creare un account e capire il valore in meno di due minuti». Ottieni un elenco ordinato per gravità: competizione tra CTA nel selettore dei piani, nessuna affordance per saltare il passaggio, contrasto insufficiente nel testo di supporto e stato di errore della password mancante. Le 2–3 modifiche con il maggiore impatto sono esplicitate.
- Individua gli anti-pattern dell'onboarding (troppi passaggi visibili, valore rimandato dopo i moduli)
- Separa i problemi che bloccano il lancio dalla rifinitura
- Fornisce al founder il linguaggio per fare un briefing all'ingegneria senza fingere di essere un design manager
💼 Un product designer che esegue il controllo qualità prima del passaggio all'ingegneria
Scenario: Un product designer è responsabile di una dashboard di analisi SaaS. L'ingegneria vuole le specifiche domani. Il designer percepisce che la densità non è corretta, ma desidera un secondo passaggio a livello di lead prima che il file venga considerato la fonte di riferimento.
Approccio tradizionale: Scrivere su Slack a un principal designer già impegnato e sperare di ricevere commenti asincroni su alcuni frame.
Revisore UI/UX: Invia la dashboard, i filtri e lo stato vuoto. La revisione segnala un layout dominato dai grafici senza la presentazione di insight utilizzabili, elementi dei filtri in competizione con il contenuto e azioni sulle righe che non rispettano le aspettative sulla dimensione delle aree interattive secondo il criterio delle WCAG 2.2 relativo alla dimensione delle aree interattive. I punti di forza — divulgazione progressiva a livello di scheda e allineamento tabellare numerico coerente — vengono indicati così da evitare di riprogettarli inutilmente.
- Critica sistemica a livello di pari, invece di osservazioni basate sul gusto
- Verifica della coerenza tra schermate quando carichi più di un frame
- Un elenco di interventi che puoi trasformare in ticket ordinati per gravità
Se il passaggio successivo consiste nell'esplorare un layout alternativo, invece di annotare soltanto quello attuale, il Generatore di prototipi UI/UX può produrre una schermata realistica per iOS, Android o web che rifletta già la gerarchia e i pattern della piattaforma consigliati.
📱 Un mobile engineer che verifica l'implementazione rispetto al mock, dal telefono
Scenario: Un engineer iOS ha implementato una schermata per il registro degli allenamenti partendo da un mockup. Su un iPhone fisico, le azioni secondarie si trovano negli angoli superiori irraggiungibili, il trattamento dell'icona della scheda selezionata sembra invertito e le righe dell'elenco sono selezionabili ma visivamente sembrano statiche. Vuole un feedback consapevole dell'implementazione durante il tragitto, direttamente dal dispositivo che ha in tasca.
Approccio tradizionale: Pubblicare lo screenshot in un canale di design e aspettare. Oppure rilasciare il prodotto e osservare i problemi di scoperta dei gesti nelle registrazioni delle sessioni.
Revisore UI/UX: Carica lo screenshot del dispositivo iOS o Android. Chiedi note basate sulle HIG o su Material, una mappatura della zona raggiungibile dal pollice e una verifica delle aree interattive da 44 pt/48 dp. La revisione distingue tra «il mockup era sbagliato» e «l'implementazione si è discostata», segnalando anche collisioni con la barra di stato e problemi relativi alle safe area che i frame Figma desktop spesso non mostrano.
- Funziona con la parità completa delle funzionalità su web, iOS e Android, quindi la revisione può avvenire sullo stesso telefono che ha rivelato il problema
- Note calibrate per gli sviluppatori: aree interattive, focus e stati dei componenti, non preferenze estetiche prive di spiegazione
- Verifiche delle convenzioni della piattaforma basate su Apple HIG e Material 3
Quando il marketing ha bisogno di un visual per una landing page coerente con la UI del prodotto che hai appena perfezionato, il Designer grafico può creare asset web e per campagne coerenti con il brand, così la vetrina e l'app non sembreranno più due prodotti diversi.
FAQ
Il Revisore UI/UX è gratuito?
Sì. Puoi utilizzare il Revisore UI/UX con il piano gratuito, che include tutte le funzionalità principali e un utilizzo mensile limitato. I piani a pagamento aumentano il limite di utilizzo — Plus parte da 20 $/mese — se revisioni flussi completi a ogni sprint. Non è richiesta alcuna carta di credito per provarlo.
In che modo il Revisore UI/UX è diverso da uno scanner di accessibilità?
Gli scanner eccellono nell'individuare problemi quantificabili: contrasto, alt mancanti e campi di input senza etichetta. La metodologia di WebAIM stessa osserva che gli strumenti automatizzati non possono rilevare ogni errore WCAG. Questo revisore segnala comunque tali problemi, aggiungendo poi ciò che gli scanner non possono vedere: gerarchia invertita, stati vuoti/di errore/di caricamento mancanti, affordance deboli, violazioni delle convenzioni della piattaforma e capacità della schermata di raggiungere l'obiettivo dichiarato.
Può revisionare screenshot di app mobile, non solo di siti web?
Sì. Quando non specifichi una piattaforma, la deduce dagli indizi visivi — iOS, Android, web o desktop — e applica le convenzioni corrispondenti: barre di navigazione e safe area su iOS, pattern di Material 3 su Android, comportamento dei moduli e della viewport sul web. Gli screenshot dei dispositivi sono input validi; dichiaralo se vuoi dare maggiore enfasi alla zona raggiungibile dal pollice e alla dimensione delle aree interattive.
Il Revisore UI/UX funziona su un telefono?
Sì. Le revisioni vengono eseguite con la parità completa delle funzionalità su web, iOS e Android, incluso il riconoscimento vocale se preferisci descrivere a voce una schermata invece di digitare. È importante quando il difetto compare soltanto su un dispositivo reale.
Quanto è accurata la critica del design?
I risultati si basano su principi consolidati — raggruppamento gestaltico, legge di Fitts, WCAG 2.2 e linee guida HIG/Material della piattaforma — non su preferenze di gusto prive di spiegazione. Le preferenze stilistiche vengono indicate come tali. Le affermazioni sul contrasto restano prudenti quando i valori hex esatti non possono essere letti da uno screenshot compresso. Il revisore chiederà un'immagine migliore o uno stato mancante invece di inventare ciò che non riesce a vedere.
Può revisionare un intero flusso o solo una schermata?
Entrambe le cose. Un singolo screenshot produce una revisione mirata. Più schermate aggiungono la verifica della coerenza tra schermate, della logica del flusso e delle lacune del sistema di design (spaziatura, tipografia, componenti). Le iterazioni della stessa schermata possono essere confrontate esplicitamente, così sai che cosa è realmente migliorato.
Conclusione
La maggior parte dei prodotti non fallisce perché il raggio di un angolo è sbagliato. Fallisce perché la gerarchia non guida lo sguardo, perché gli stati vuoti e di errore non sono mai stati progettati, perché contrasto e dimensione delle aree interattive escludono una grande parte degli utenti e perché nessuno con una valutazione a livello di lead ha osservato la schermata prima del rilascio.
Il Revisore UI/UX ti offre questa valutazione su richiesta: carichi uno screenshot e ottieni una critica ordinata per gravità, con correzioni alla radice invece di un mucchio di sintomi. Usalo sull'MVP che sta per diventare difficile da modificare, sulla dashboard prima del passaggio all'ingegneria o sullo screenshot del dispositivo che già ti sembra leggermente sbagliato.
Prova subito il Revisore UI/UX. Scopri di più su Jenova.
Per gli sviluppatori: il Revisore UI/UX è disponibile a livello programmatico tramite la API di Jenova: integra la critica del design basata su screenshot nella tua applicazione con una singola chiamata API. Documentazione completa →