Fuga di notizie: come e perché Google ha sviluppato Material 3 Expressive Design

In vista dell'annuncio tanto atteso di questo mese, Google ha pubblicato accidentalmente un post sul blog in cui descriveva dettagliatamente il pensiero e la ricerca alla base di Material 3 Expressive Design, l'ultima direzione di design dell'azienda.

L'articolo completo è stato archiviato sul blog da Wayback Machine (Con immagini non mostrate nella versione archiviata mostrata di seguito.) Ecco i punti principali:

Material 3 Expressive rappresenta quella che Google definisce una "nuova e audace direzione per il design" ed è "l'aggiornamento più ambito di sempre del sistema di progettazione di Google". L'obiettivo di Google è che le app vadano oltre i design "puliti" e "noiosi" per creare interfacce che connettano le persone a livello emotivo. Oltre al nome completo, viene anche chiamata "M3 Expressive" o semplicemente "design espressivo".

 

Material 3 Expressive è nato dalla ricerca, non secondo il metodo di "41 sfumature di blu", che delegava le decisioni di progettazione ai dati, bensì da un'indagine collaborativa che coinvolgeva ricerca, progettazione e ingegneria.

Nel 2022, il team di Material Design ha iniziato a chiedersi: "Perché tutte queste app sono così simili? Così noiose? Non c'era spazio per un tocco di più?"

 

Negli ultimi tre anni abbiamo esplorato le implicazioni di questo dialogo, ripetendo decine di cicli di progettazione e ricerca per individuare la prossima evoluzione del Material Design. Attraverso 46 studi di ricerca distinti con centinaia di progetti e oltre 18000 partecipanti da tutto il mondo, abbiamo messo a punto un sistema accattivante e altamente utilizzabile. I principi di Material 3 Expressive si basano su solide ricerche e sono costruiti sulle migliori pratiche di usabilità consolidate, così i progettisti possono utilizzare questi nuovi componenti e principi con sicurezza, sapendo che stanno creando qualcosa di facile da usare e con cui le persone possono interagire.

Questi studi di ricerca includevano:

  • Tracciamento oculare: Analizza dove gli utenti focalizzano la loro attenzione. L'eye tracking è uno strumento potente per comprendere il comportamento degli utenti e individuare le aree di miglioramento della progettazione.
  • Sondaggi e focus group: misurazione delle risposte emotive a diversi progetti. Questi metodi aiutano a comprendere come gli utenti percepiscono i progetti a livello emotivo.
  • Esperimenti: Raccogli sentimenti e preferenze. Gli esperimenti sono essenziali per determinare quali design preferiscono gli utenti e per valutare l'impatto dei diversi elementi sull'esperienza utente.
  • Facilità d'uso: Scopri la rapidità con cui i partecipanti comprendono e utilizzano l'interfaccia. L'usabilità è una misura fondamentale del successo di qualsiasi progetto, poiché determina con quanta facilità ed efficienza gli utenti possono raggiungere i propri obiettivi.

Google afferma: "Gli elementi essenziali del design espressivo sono l'uso del colore, della forma, della scala, del movimento e del contenimento". Inoltre: "Material 3 Expressive è caratterizzato da un uso audace di forme e colori, creando esperienze utente piacevoli". L'uso di colori e forme audaci è un elemento fondamentale di Material Design 3 Expressive, il cui obiettivo è creare esperienze utente coinvolgenti e memorabili.

 

Questi aspetti di progettazione sono essenziali anche per rendere il prodotto più intuitivo, poiché concentrano l'attenzione sugli elementi importanti dell'interfaccia, ad esempio evidenziando le azioni chiave e raggruppando insieme elementi simili. Ciò migliora l'esperienza dell'utente e la rende più fluida ed efficiente.

Materiale 3 Perdita espressiva

La barra degli strumenti mobile è un componente generato da Material 3 Expressive. Nei progetti concettuali vediamo una barra inferiore a forma di pillola che non si estende per l'intera larghezza dello schermo. Di conseguenza, vediamo solo una piccola porzione dello sfondo, con i disegni da un bordo all'altro che diventano più evidenti. È simile a ciò che è disponibile oggi in Google Chat.

Una ricerca di Google dimostra che "i design espressivi sono più facili da usare" e aiutano gli utenti a "scoprire rapidamente l'azione principale su ogni schermata e a navigare più velocemente".

 

…I partecipanti sono stati in grado di identificare gli elementi chiave dell'interfaccia utente fino a 4 volte più velocemente, dimostrando che questi design indirizzano l'attenzione dell'utente sulla parte più importante dello schermo. Abbiamo visto molte app raggiungere questi livelli di miglioramento, e questi risultati vanno oltre i semplici tempi di fissazione degli occhi. Abbiamo anche notato una riduzione di secondi nel tempo necessario per cliccare sulle azioni chiave nei diversi design da noi testati.

Ancora una volta, è importante sottolineare che questi sono solo progetti concettuali e non rispecchiano i prodotti reali. (Per avere informazioni più definitive, è trapelata. Riprogettazione dell'orologio di Google (Durante il fine settimana.) Tuttavia, l'esempio "prima" riportato di seguito è chiaramente l'attuale interfaccia utente di Gmail.

 

Osservando progetti specifici, come ad esempio le schermate per un caso di studio di un'app di posta elettronica illustrate di seguito, possiamo constatare in prima persona i vantaggi dei principi di progettazione espressiva. Ad esempio, il pulsante Invia nel nuovo design è più grande, è posizionato direttamente sopra la tastiera e utilizza un colore secondario per attirare l'attenzione su di esso. Possiamo paragonarlo al design non espressivo, che posiziona un piccolo pulsante "Invia" nella barra degli strumenti nella parte superiore dello schermo insieme ad altri controlli come l'allegazione di un file. Quando ai partecipanti è stato chiesto di "inviare l'e-mail" nell'app, i loro occhi hanno visto il pulsante 4 volte più velocemente nel design emoji. Ciò riflette l'importanza del "design espressivo" nel migliorare l'esperienza dell'utente.

Altri concept design mostrano un'app per l'orologio, un input vocale, un editor di foto, pagamenti e un portafoglio:

  •  

Il successo o il fallimento dell'adozione della nuova interfaccia utente dipenderà dalla sua semplicità di implementazione e dalla fluidità con cui si aggiorna da M3. Sembra che Jetpack Compose si trovi in ​​una posizione decisamente migliore ultimamente, quindi sono moderatamente ottimista.

Nel frattempo, la ricerca e i test utente hanno rivelato che "un design espressivo ben implementato è fortemente preferito dalle persone di tutte le età rispetto a un design non espressivo che segue le linee guida dell'interfaccia utente umana di iOS".

Google ha scoperto che "i design espressivi sono fantastici", soprattutto per quanto riguarda l'attrattiva del marchio: "La nostra ricerca ha dimostrato che l'utilizzo del design M3 Expressive ha migliorato il modo in cui un prodotto risultava "cool" agli occhi delle persone".

  • …Abbiamo riscontrato un aumento del 32% nella percezione della sottocultura, il che suggerisce che un design espressivo fa apparire un marchio più rilevante e “informato”.
  • …un aumento del 34% della freschezza, rendendo il marchio fresco e innovativo.
  • …un aumento del 30% nella ribellione, a indicare che il design espressivo posiziona il marchio come un leader audace e innovativo, pronto a rompere gli schemi.

I commenti sono chiusi.