Tendenze dell'interfaccia utente che modelleranno 2019

Permettimi di chiederti una cosa che potrebbe sembrare un po 'fantascientifica. Ti è mai venuto in mente che forse il pianeta Terra si è mosso un po 'più veloce negli ultimi tempi, ma dobbiamo ancora accorgertene? Sembra che solo ieri abbiamo rivisto quello che ci aspettavamo quando ci siamo trasferiti in 2018. Eppure, stranamente, è già quasi 2019!

Vieni a pensarci, comunque, 2018 è stato un diavolo di un anno per la progettazione dell'interfaccia utente. Le cose ora sono molto più semplici rispetto agli anni precedenti - grazie agli strumenti di sviluppo della crescita esponenziale sperimentati negli ultimi tempi. Non devi più nemmeno essere un guru del codice per creare un sito dall'aspetto professionale con una grande interfaccia utente in pochi minuti.

E quello copre a malapena la base. I cambiamenti nelle preferenze dell'utente hanno avuto un impatto estensivo su come abbiamo progettato le interfacce in 2018.

Per metterlo in prospettiva, 94% degli utenti Internet ha smesso di fidarsi dei siti con un design scadente, quindi non c'è più spazio per i compromessi.

Quindi, poiché lo scorrimento è ormai ampiamente accettato, i siti non danno più la priorità al posizionamento dei migliori elementi nella parte superiore. Puoi distribuirli proporzionalmente all'interno dell'interfaccia. Ma poi di nuovo, abbiamo imparato ad essere estremamente cauti riguardo a questo aspetto 40% dei visitatori partirà se il layout generale risulta essere squallido.

E non è tutto ciò che odiano. Anche gli utenti si sono stancati dei dispositivi di scorrimento dei contenuti 1% farà clic su di essi. È interessante notare come, eliminando il contenuto, sarebbe anche una mossa sbagliata da allora 86% di visitatori del sito vuoi vedere le informazioni critiche sul prodotto e sul servizio non appena il terreno sulla home page.

Affascinante, vero?

Quindi, siamo onesti, il design dell'interfaccia utente non è mai stato così eccitante. Gli utenti stanno mortificando, la tecnologia dei dispositivi si sta sviluppando in modo astronomico, la velocità di Internet è ora a livello di Formula 1 e siamo supportati da una vasta gamma di strumenti di progettazione sul web. Combina tutto ciò con i moderni skillset di progettazione dell'interfaccia utente e sarai certamente d'accordo sul fatto che 2019 sia destinato ad essere ancora più efficace.

Quindi, quali sono le tendenze che non vediamo?

Mobile First

L'ottimizzazione dei dispositivi mobili è una parola d'ordine che apparentemente non andrà in fumo presto. La tendenza è in giro da un paio d'anni ormai, per non dire altro. E avresti ragione a prevedere che vedremo una maggiore adozione di progetti di interfaccia utente basati su dispositivi mobili in 2019.

Potresti anche supporre che, a parte la tecnologia corrispondente, non ci sia nulla di nuovo che potrebbe essere disponibile in questo spazio, almeno per i prossimi 12 mesi o giù di lì. Abbastanza giusto, ma prendi questo ...

Vedete, già da un po 'di tempo, abbiamo utilizzato lo stesso vecchio approccio: progettare per PC prima di passare al mobile. Retrospettivamente, l'interfaccia utente desktop era l'obiettivo principale perché la maggior parte del traffico proveniva dagli utenti di PC.

Poi qualcosa di interessante si è verificato nel traffico 2016- in ritardo alla fine ha superato il traffico del PC. Entro la fine di quell'anno, i telefoni cellulari avevano colpito 50.31% della quota di mercato, mentre le compresse sommate a 4.9%.

quota di mercato mobile

Tuttavia, nonostante ciò, abbiamo ancora la priorità sull'interfaccia desktop perché è accaduto che gli utenti del PC mantenessero il vantaggio nel tempo totale trascorso online. In Nord America, ad esempio, la telefonia mobile era ancora in ritardo in 2017, tenendo conto 33% del tempo di navigazione.

tempo di navigazione

Bene, vieni a pensarci, sapevamo tutti che era solo il momento prima che il mobile raggiungesse anche i PC. E con 2018, i tavoli si erano completamente trasformati, con il cellulare in mano 52.2% di tutte le pagine Web globali.

traffico

Cosa significa questo per l'interfaccia utente?

Per i principianti, ci aspettiamo un cambiamento nell'approccio alla progettazione dell'interfaccia utente. Gli sviluppatori inizieranno a cambiare le priorità concentrandosi sull'interfaccia utente mobile prima di progettare per PC. Gli utenti mobili avranno la precedenza sugli utenti di PC.

Uso di ombre e profondità

Non si può negare che i progetti di interfaccia utente piatta hanno i loro benefici. Ma diciamocelo Sono diventati troppo monotoni e, certamente, piuttosto noiosi.

Sfortunatamente, l'uso dei disegni 3D è stato impegnativo a causa della grafica ingombrante risultante. Il caricamento di una pagina Web con un'interfaccia 3D, ad esempio, in genere richiedeva più tempo di uno con un design piatto.

Bene, fino a quando i browser Web hanno iniziato a migliorare sostanzialmente. E i designer, d'altra parte, hanno sviluppato una tecnica eccezionale di sfruttare le ombre per introdurre l'illusione della profondità.

ombre e profondità

Pertanto, in 2019 ci aspettiamo di vedere un uso progressivo delle variazioni dell'ombra per ottenere diverse prospettive dell'interfaccia 3D.

Ad esempio, i designer che cercano di attirare l'attenzione su elementi specifici possono creare false ombre con vari gradi di morbidezza e intensità. Il risultato finale è un elemento che potrebbe apparire sospeso sopra il resto in 3D.

Un'altra tecnica popolare è quella di posizionare le ombre nei pattern per creare vari livelli di texture e, successivamente, dare vita agli elementi dell'interfaccia.

Quindi indovina cosa? I recenti progressi negli strumenti di progettazione dell'interfaccia utente hanno ulteriormente ampliato le dinamiche che derivano da questi approcci progettuali. Ora puoi facilmente combinare ombre con griglie e layout parallasse per estendere sistematicamente la profondità corrispondente e conseguentemente realizzare illusioni 3D più realistiche.

In altre parole, l'uso avanzato delle ombre continuerà a raggiungere profondità più raffinate sul display 2D. E così facendo, elimina la necessità di schermi 3D speciali.

Minimalismo

Nell'anno 2000, la portata media dell'attenzione umana, almeno secondo uno studio di microsoft, era 12 secondi. Quindi indovina cosa? Con 2015, era sorprendentemente passato a 8 secondi - molto meno abbreviato di un pesce rosso standard.

Beh, proprio quando pensavamo che non potesse peggiorare, Internet rendeva le persone più impazienti- 47% dei visitatori del tuo sito ora ti aspettiamo che le tue pagine vengano caricate in meno di 2 secondi. Semplicemente non sopporta l'attesa più a lungo. Di fatto, 40% se ne andrà se impiegherà più tempo di 3 secondi.

Sorprendentemente, molti web designer non lo hanno preso sul serio. Il corrente la velocità media di caricamento delle pagine è di 8.66 secondi- nonostante la raccomandazione di Google di meno di 3 secondi per 2018.

tempi di caricamento della pagina

E non è tutto. Si scopre che la situazione è notevolmente peggiore per i siti mobili dal momento che prendono un media di 22 secondi caricare. Purtroppo, 53% dei visitatori della pagina mobile non si blocca per più di tre secondi.

Ma come si relaziona all'interfaccia utente?

Mentre le velocità di caricamento delle pagine sono generalmente determinate da diversi fattori, il design complessivo dell'interfaccia utente è particolarmente estremamente critico. È qui che inizia la reazione a catena.

Quindi, cosa significa questo per 2019?

Bene, Aggiornamento della velocità di Google a luglio 2018 è stato l'inizio della fine di complesse interfacce grafiche pesanti che compromettono sostanzialmente le velocità di caricamento. Ci stiamo ora spostando sempre più verso interfacce utente minimaliste snelle e ben snellite che si caricano molto più velocemente.

In sostanza, il minimalismo implica il raggiungimento di un equilibrio ideale tra semplicità, praticità e funzionalità. Questo riesce non solo a migliorare la velocità generale e il ranking dei motori di ricerca, ma anche a ridurre la corrispondente frequenza di rimbalzo del traffico.

Effetti sovrapposti

L'era moderna del design grafico ha introdotto effetti sovrapposti per combinare più livelli, creare un senso dello spazio e, soprattutto, rendere le interfacce più accattivanti.

Ma aspetta. Che cosa è un effetto di sovrapposizione in primo luogo?

Generalmente, questo implica posizionare elementi come immagini, testo e colori per sovrapporsi elegantemente l'un l'altro. Scommetto che hai già trovato grafica sovrapposta su diversi siti web ormai.

effetti sovrapposti

Beh, bisogna ammetterlo, la tendenza del design è aumentata considerevolmente negli ultimi due anni. Tuttavia, ora che i dispositivi moderni hanno una riproduzione del gradiente del colore molto migliore, è previsto che 2019 inneschi l'adozione di effetti sovrapposti su PC e le interfacce mobili.

Ad esempio, Samsung Mobile è passato dai display LCD a tecnologia OLED molto avanzata quando hanno rilasciato il Galaxy S7 due anni fa. Quindi Apple si è unita al carrozzone con l'iPhone X, che ora ha un contrasto maggiore rispetto ai suoi predecessori LCD. L'azienda ha persino piani per mantenere questo su tutti i modelli di iPhone programmati per 2019.

E chi ne trarrà più beneficio?

Come previsto, il mondo del design grafico sta sfruttando in modo straordinario questo per creare sovrapposizioni con sfumature più nitide e più nitide che sembrano più naturali. Amiamo il modo in cui i display OLED hanno sostanzialmente mitigato il problema più grande con gli elementi sovrapposti: gli utenti sono stati distratti dagli elementi secondari sottostanti a causa di uno scarso contrasto.

Questa tendenza innescherà anche lo sviluppo della trasparenza nei design dell'interfaccia utente. Vedremo un maggiore uso di trame "simili al vetro" sulle interfacce utente in quanto i progettisti sfruttano la trasparenza per mettere in risalto sia la grafica primaria che quella secondaria contemporaneamente, senza necessariamente interferire con l'enfasi desiderata.

Disegni senza cornice

Eppure su dispositivi moderni, hai sicuramente notato la cosa più straordinaria del loro design esterno generale al giorno d'oggi. No, non sto parlando di come stanno sovrasfruttando il vetro su praticamente ogni superficie.

Ok, ammetto che potrebbe avere qualcosa a che fare con quello. Per qualche strana ragione, tutti ora odiano apparentemente i telai dei display. I principali produttori di schermi per smartphone e TV stanno gradualmente riducendo lo spazio tra il contorno del display e i bordi dei dispositivi corrispondenti. Quindi per completare l'aspetto, scelgono di combinarlo con i bordi arrotondati del dispositivo.

Samsung ha persino provveduto a eliminare completamente i frame edge estendendo alcuni degli schermi degli smartphone oltre i bordi. Apple, d'altra parte, ha deciso di coprire l'intera faccia di iPhone con lo schermo del display, lasciando spazio solo per l'auricolare.

bordo frameless

Vieni a pensarci, immagino che abbia tutto a che fare con l'illusione dell'infinito: la necessità di far sembrare lo schermo come una parte dell'ambiente naturale. E, ad essere onesti, sta funzionando abbastanza bene per gli utenti, che a quanto si dice trovino i display più coinvolgenti.

Forse non sorprende che questa tendenza si sia estesa al settore delle app. Le UI si stanno progressivamente spostando dai contorni incorniciati alle linee morbide combinate con i bordi arrotondati. Di conseguenza, ciò ha consentito alle interfacce di integrarsi perfettamente con gli schermi del dispositivo e successivamente creare una prospettiva frameless a schermo intero.

Dato che i produttori di dispositivi continuano questa tendenza in 2019, ci aspettiamo che le UI abbandonino progressivamente gli spigoli di vecchia generazione per progetti lisci, arrotondati e senza cornice.

Micro-Animazioni

Sono sottili e potrebbero sembrare insignificanti a volte. Ma la semplice verità è questa: le micro-animazioni nelle interfacce utente si sono dimostrate estremamente efficaci nel coinvolgere e aiutare gli utenti mentre navigano.

Hai visto quei pulsanti che cambiano colore quando li fai scorrere o li clicchi? Hai sicuramente trovato anche i layout di menu che compaiono per visualizzare ulteriori opzioni non appena il puntatore atterra su di loro. Bene, sono tutti esempi di micro-animazioni che creano piccoli effetti visivi per arricchire l'esperienza dell'utente.

micro-animazioni

Poiché gli elementi mobili sono particolarmente efficaci nel catturare l'attenzione, molti designer li stanno già facendo leva per guidare gli utenti verso vari punti di conversione. Questa tendenza è così diffusa ormai che sarei disposto a scommettere una fortuna che non è possibile trovare più di cinque siti che non hanno ancora implementato alcuna forma di micro-animazione.

Allora prendi questo. Tutti i browser Web dominanti attualmente supportano le micro-animazioni in modo soddisfacente sia su PC che su dispositivi mobili. Quindi direi che la tendenza è qui per rimanere quando ci avviciniamo a 2019: aspettiamo che le interfacce utente presentino gerarchie visive sistematicamente strutturate.

Conclusione

Tutto sommato, abbiamo solo coperto alcune delle tendenze più importanti. Siamo costretti a vedere cose più eccitanti che arrivano col passare del tempo, e non possiamo aspettare che 2019 metta in moto la palla.

Detto questo, cosa pensi che potrebbe rivelarsi la tendenza al design dell'interfaccia utente più interessante? E quali altre tendenze degne di nota aggiungerebbe a questa lista?

immagine di cortesia per gentile concessione di Walid Beno

Bogdan Rancea

Bogdan è membro fondatore di Inspired Mag, avendo accumulato quasi 6 anni di esperienza in questo periodo. Nel tempo libero ama studiare musica classica ed esplorare le arti visive. È piuttosto ossessionato dai fissaggi. Possiede già 5.