Quand’è l’ultima volta che avete consultato un’app, un sito o un prodotto digitale e avete trovato che fosse davvero scomodo da usare? Per esempio, avete avuto a che fare con un’interfaccia poco intuitiva, dalla scelta dei colori non accessibile, elementi che sembrano cliccabili ma che in realtà non lo sono e tanti altri dettagli che vi hanno scoraggiato e fatto chiudere tutto.

Colpa di una UI magari esteticamente bella, ma che non è stata costruita seguendo le necessità di chi poi userà effettivamente quell’app, quel sito o quel prodotto.

Progettare un’interfaccia non significa pensare solo all’estetica, all’accostamento cromatico e a font aggraziati, ma anche funzionalità d’utilizzo, strategia, studio e test che si traducono in valore economico per l’azienda. Tutti questi fattori compongono la User Experience, ovvero l’insieme di elementi che definiscono l’esperienza complessiva che l’utente ha avuto con un prodotto, un sistema o un servizio.

Quando si sviluppa custom, una buona UX/UI vale il doppio perché ci si aspetta un approccio del tutto aderente alle necessità, contrariamente a quello che succede utilizzando uno shelf product.

Ma quali sono gli errori più ricorrenti quando si parla di UX/UI? E cosa bisogna tenere a mente in fase di progettazione di un prodotto in Cloud custom?

Che cos’è la UX/UI

“A user interface is like a joke: if you have to explain it, it’s not that good”. Così Martin LeBlanc, CEO di IconFinder, spiega come dovrebbe essere una UX/UI ben fatta: se dobbiamo spiegare all’utente finale come dovrebbe usare un prodotto pensato per il suo uso, allora significa che abbiamo sbagliato tutto.

Ma facciamo un passo indietro e capiamo che cos’è davvero la UX/UI (e cosa non è).

L’obiettivo della UX/UI non è la risoluzione dei problemi che noi presumiamo gli utenti vogliano risolvere, ma quelli che gli utenti vogliono davvero risolvere.

Per farlo, si appoggia su quattro pilastri che ci aiutano a calarci nei panni dell’utente finale e capire se il prodotto incontri le sue necessità:

1. Usability: il prodotto che sto utilizzando è semplice e intuitivo?
2. Utility: quale problema sta risolvendo il prodotto che sto utilizzando?
3. Pleasurability: l’esperienza d’uso del prodotto è gradevole e mi coinvolge?
4. Equity: così com’è accessibile a me, anche per altri utenti con diverse abilità, background e dispositivi è altrettanto facile?

Questi quattro elementi non sono solo degli "aggettivi", ma costituiscono i criteri di valutazione per stabilire se un prodotto ha una buona UX/UI.

Come capire al volo la differenza fra UX e UI

Facciamo un esempio pratico.

State navigando in un sito web, quando nella finestra di consultazione appare un pulsante grande, colorato, ma posizionato in un punto inaspettato o con un’etichetta ambigua. Intuitivamente, siete portati a cliccare perché avete riconosciuto lo stesso pulsante in altri punti del sito web e sapete che vi porterà allo step successivo della vostra azione. Sbagliato: invece di completare l’operazione, vi ritrovate nella homepage.

Oppure, immaginate di compilare il form di iscrizione alla newsletter. Il layout del form è esteticamente piacevole, ma dovete compilare fin troppi campi obbligatori, indistinguibili tra di loro perché le etichette con cui vengono identificati sono troppo simili e non capite quali informazioni siano necessarie per finalizzare l’iscrizione. Risultato: continui messaggi d’errore come “campo non valido” senza una chiara indicazione sulle informazioni richieste, la vostra frustrazione che aumenta man mano, la conseguente rinuncia all’iscrizione alla newsletter e la perdita di un potenziale lead per l’azienda.

Insomma, la UX/UI non è puro gusto personale di chi la progetta ma è un mix di psicologia cognitiva, studi empirici e pattern consolidati che generano fiducia, conversione e valore.

Perchè la UX/UI diventa ancora più importante nei prodotti custom

Nonostante sia la first impression che gli utenti hanno di un prodotto o servizio digitale, fare UX/UI viene erroneamente sottovalutato o messo in secondo piano rispetto al coding. Sia chiaro: entrambe le attività sono fondamentali e proprio per questo devono andare di pari passo.

Solitamente ciò accade quando si presta poca attenzione ai flussi d’azione e, errore ancora più grave, la UX/UI non viene progettata tenendo a mente il comportamento e le necessità dell’utente finale. Questo pressapochismo si trasforma in nuovi bug, necessità di più refactor, più costi e più utenti insoddisfatti che preferiscono i prodotti concorrenti con una migliore funzionalità.

In ottica custom, diventa ancora più importante.

La UX/UI non è solo estetica, ma studio, strategia e componente strutturale

Quando parliamo di prodotti custom, avere una UX/UI fatta bene non è un “nice to have”, ma un requisito strutturale che - se ignorato - impatta esattamente come una scelta strategica sbagliata o un errore di codice. Chi sceglie un prodotto custom rispetto a uno shelf product, si aspetta che la personalizzazione sia a 360° e che non riguardi solo le tecnologie “sotto il cofano” del prodotto. L’experience deve essere frutto di uno studio attentissimo dell’utente, di ascolto e di coinvolgimento lungo tutte le fasi di progettazione.

Ed è qui che entra in gioco il Design Thinking, una serie di step che portano alla realizzazione di una UX/UI non solo bella ma anche di valore, capace di alzare il livello di qualità del lavoro del team.

Il Design Thinking è un processo iterativo, quindi un processo che prevede la ripetizione degli stessi step più e più volte, fino al raggiungimento di un risultato soddisfacente.

Si sviluppa in sei fasi:

• Empathize: fare delle ricerche per capire quali siano le corde dell’utente finale da toccare così da capirne le necessità;
• Define: mettere assieme i dati raccolti per vedere dove nascono le necessità dell’utente finale;
• Ideate: fase di brainstorming per trovare la migliore soluzione e conseguente selezione delle idee migliori;
• Prototype: le idee che hanno superato la selezione vengono messe a terra per avere un prototipo funzionale;
• Test: i prototipi vengono testati dagli utenti finali (o un gruppo di test di utenti quanto più simili a quelli finali) per avere dei feedback e passare eventualmente alla fase di implementazione;
• Implement: se i feedback sono positivi, il prototipo viene raffinato e diventa il prodotto finale. Se negativi, si ritorna alla fase di test fino a quando i test non saranno superati con successo.

La UX/UI non è soggettiva: metriche, segnali e impatti misurabili

Proprio come una qualsiasi altra fase di progettazione del prodotto, anche quella di UX/UI deve essere supportata da metriche: se non è misurabile, la UX/UI è puro gusto personale.

Anche la scelta delle metriche da monitorare non è banale. Senza una visione chiara degli obiettivi aziendali e un coinvolgimento diretto con gli stakeholder, è difficile misurare l’impatto reale di una UX/UI fatta bene o fatta male.

Anche nella UX/UI raccogliere e analizzare i dati è fondamentale: senza, non possiamo misurarne il valore

Quando ciò non succede, tendiamo a cadere in una di queste trappole:

• Vanity trap: metriche che sembrano positive ma che in realtà offrono pochi insight reali (es. NPS alto con churn elevato);
• Silo trap: metriche scelte esclusivamente dal team UX, senza coinvolgere gli stakeholder nella decisione. In questo modo, si rischia di perdere di vista gli obiettivi aziendali reali per misurare l’efficacia delle scelte strategiche;
• Noise trap: metriche che nessuno usa davvero. Succede quando viene a mancare un allineamento cross-funzionale fra la UX e i reali obiettivi aziendali. La raccolta dei dati c’è ma è un puro esercizio accademico e non uno strumento utile per prendere decisioni e migliorare.

Le metriche UX non possono e non devono essere sottovalutate; sono molto più che semplici statistiche di usabilità o punteggi di soddisfazione del cliente. Il loro compito è dimostrare il valore che la UX del prodotto digitale fatta in ottica custom porta all’organizzazione.

Trasformare la pratica in performance

Ogni buon UX/UI designer conosce l’importanza che hanno le Euristiche di Nielsen e le  Laws of UX, linee guida che aiutano i team a capire come creare una UX/UI valida, qualsiasi sia la natura del progetto.

Le Euristiche di Nielsen

1. Visibilità dello stato del sistema: gli utenti devono essere in grado di capire se le loro azioni sono andate a buon fine o meno in base a come reagisce il prodotto. Interazioni prevedibili o dimostrabili generano fiducia sia nel prodotto sia nel brand;
2. Corrispondenza tra il sistema ed il mondo reale: il design dovrebbe parlare la lingua degli utenti, cioè usare parole, frasi e concetti a loro perfettamente familiari così come termini, icone, immagini. Anche se interagiscono per la prima volta con il nostro prodotto, gli utenti riconoscono le convenzioni del mondo reale (natural mapping) e interagiscono in maniera intuitiva aspettandosi determinati risultati;
3. Controllo e libertà dell’utente: in caso di errore, deve essere sempre visibile una “uscita d’emergenza” immediata per abbandonare l’azione indesiderata. Così facendo, l’utente ha un maggior senso di controllo ed evita di sentirsi bloccato;
4. Coerenza e standard: secondo la legge di Jakob, le persone trascorrono la maggior parte del loro tempo usando prodotti digitali diversi dal nostro e le esperienze che fanno con altri prodotti modellano le loro aspettative quando useranno il nostro. Non mantenere coerenza può aumentare il carico cognitivo degli utenti, costringendoli a imparare qualcosa di nuovo;
5. Prevenzione degli errori: un buon design non solo segnala correttamente gli errori, ma li previene. Un buon design elimina già in partenza tutte quelle condizioni che favoriscono l’errore dell’utente oppure le intercetta (un esempio è il messaggio di conferma prima che un’azione venga completata);
6. “Riconoscere” piuttosto che “ricordare”: gli esseri umani hanno una memoria a breve termine limitata ed è per questo che elementi, azioni e opzioni dovrebbero essere sempre visibili. Le interfacce che favoriscono il riconoscimento riducono la quantità di sforzo cognitivo richiesta agli utenti;
7. Flessibilità ed efficienza d’uso: un buon design strizza l’occhio sia agli utenti con poca esperienza sia agli utenti con più dimestichezza. Mettere delle short-cut generalmente conosciute potrebbe migliorare la navigazione proprio agli utenti più “nerd” (es. permettere la chiusura della scheda premendo “ESC”);
8. Estetica e progettazione minimalista: l’interfaccia non deve essere piatta ma occorre stabilire una certa gerarchia degli elementi, mettendo in primo piano quelli più rilevanti e tenendo il focus su ciò che è essenziale per l’esperienza dell’utente.
9. Aiuto per riconoscere, diagnosticare e recuperare dagli errori: quando compare un errore o una qualsiasi segnalazione, il messaggio d’avviso dovrebbe essere semplice, riconoscibile e indicare con precisione il problema suggerendo l’azione da compiere;
10. Supporto e documentazione: potrebbe essere necessaria una documentazione a supporto dell’utente per aiutarlo nella navigazione, come un helpdesk o una sezione FAQ con passaggi chiari da seguire e facili da consultare.

Laws of UX

Le Laws of UX, invece, sono un insieme di principi psicologici e best practice che guidano il design verso la massima intuitività. Rappresentano la bussola per anticipare i comportamenti degli utenti, eliminando ogni attrito cognitivo nell'interazione digitale.

Proprio perché si basano sui principi psicologici, le Laws of UX sono linee guida applicabili in qualsiasi tipo di prodotto, anche Cloud. In questo articolo, potete trovare l’elenco completo LINK

Esempi di una UX/UI buona e una meno buona

Come abbiamo potuto vedere, dietro una buona interfaccia UX/UI niente viene lasciato al caso. Nelle prossime righe, facciamo un deep dive di alcuni casi studio in cui sono stati applicati i principi appena visti in modo funzionale e non.

Notifiche LinkedIn

Caso studio estratto da Growth Design

Quante notifiche LinkedIn ricevete al giorno? Quello che ci si aspetta da una notifica è l’immediatezza, sia in termini di tempistiche sia in termini di comunicazione.

Il social ha ottimizzato l'attivazione delle notifiche con un approccio profondamente umano: non chiede un generico "Consenti", ma interviene dopo l'invio di un messaggio, quando l'aspettativa di una risposta è massima. Sfruttando l'Identifiable Victim Effect, l'interfaccia non parla di "avvisi astratti", ma nomina la persona specifica con cui stiamo interagendo. Questo linguaggio conversazionale e coerente riduce la percezione di minaccia, trasformando un'impostazione di sistema fredda in un valore tangibile: sapere esattamente quando il nostro interlocutore ci risponderà.

Un checkout confusionario - Godaddy

Caso studio estratto da Growth Design

Un esempio di UX/UI poco chiaro, invece, lo troviamo nella parte finale del flusso d’acquisto di Godaddy, una piattaforma di acquisto di domini internet.

Al momento dell’acquisto di un dominio, l’utente è attirato dal prezzo competitivo ma, via via che avanza, la sua esperienza viene rovinata da una vendita sempre più aggressiva e poco chiara con add-on e opzioni preselezionate che generano confusione.  Queste tattiche, spesso associate ai dark patterns, forzano l'utente verso acquisti non richiesti, violando il principio di autonomia e trasparenza. E a perderci è anche il brand: l'incoerenza dei prezzi tra la fase di ricerca e il carrello finale mina profondamente la fiducia nel brand.

Anche noi abbiamo visto in prima persona questo caso specifico lavorando ad Aruba Domains, la piattaforma internazionale per la registrazione di domini internet e protezione del brand. Se volete saperne di più, qui trovate la nostra Success Story.

Cosa migliorare da oggi

Non importa che il vostro progetto sia Cloud Native o meno: una UX/UI ben fatta farà sempre la differenza garantendo un’esperienza utente di valore con una conseguente fiducia nei confronti del prodotto e del brand stessi.

Ci lasciamo con una serie di best practice che abbiamo acquisito in questi anni lavorando a progetti diversi fra loro e che il nostro team di design/frontend usa come bussola:

• Utente al centro, sempre: per quante volte lo ripetiamo, non è mai abbastanza. Ogni elemento inserito e ogni scelta fatta devono essere pensati per la miglior esperienza possibile degli utenti finali;
• Integrazione precoce e comunicazione diretta: coinvolgere UX/UI sin dalla raccolta dei requisiti, eliminando l'intermediazione eccessiva del PM per favorire un dialogo tecnico-creativo più fluido;
• Prototipazione sistematica: Utilizzare prototipi per allineare stakeholder e dev prima di scrivere codice, estendendo questa pratica anche alle feature più semplici. Richiede tempo ma ne risente positivamente la qualità dell’interfaccia;
• Revisione continua (UX Review): Affiancare alle code review delle mini-review focalizzate sull'esperienza utente, verificando in tempo reale che i testi siano chiari, l’utente capisca come debba interagire, ci sia coerenza con i pattern esistenti, i loading siano chiari e sia stato fatto il possibile per prevenire gli errori dell’utente;
• Standardizzazione e Componentistica: Consolidare una libreria di design interna che definisca componenti riutilizzabili e pattern chiari per form, CTA, tabelle e microcopy;
• Testare, testare e ancora testare: anche delle sessioni di test fatte in casa con il team non coinvolto nel progetto o non tecnico sono d’aiuto per intercettare le criticità prima del rilascio.