Flat Design 2.0 – Un Nuovo Trend

 Il flat design ha colpito il mondo del design con impeto negli ultimi anni ma nessun movimento di design rimane 100% ligio alle sue radici e i suoi ideali. Questo è esattamente quello che sta succedendo con il flat design: sta gradualmente subendo sottili ma significativi cambiamenti contrapposti al suo iter originale.

Questi cambiamenti sono stati abbastanza per far coniare agli esperti e agli osservatori della nuova chimera il termine Flat Design 2.0. Il 2.0 è molto interessante perché sottolinea la fine separazione fra appena abbastanza cambiamento da alterare l’esperienza dell’utente e rimanere fedeli ai suoi principi originali.

L’evoluzione del Flat nel 2.0 era inevitabile, perché man mano che i designer iniziavano a sentirsi a loro agio col Flat design, hanno iniziato a notare che nonostante tutta la sua popolarità c’erano dei problemi che non venivano gestiti adeguatamente. Così ora abbiamo il 2.0 per risolvere alcuni di questi problemi.

le origini del flat design

Guarda al Flat design come una sorta di ribellione contro l’allora popolare stile di design scheumorfismo. Si basava su effetti 3D per copiare proprietà del mondo reale degli oggetti sfruttandolo come modo per instaurare familiarità per fornire così aiuto all’utente. Per esempio, nelle interazioni iniziali con il Kindle Fire di Amazon, c’era uno scaffale 3D sullo sfondo per rinforzare lo scopo del tablet per la lettura.

001

 

Quando Apple, un enorme proponente del design  scheumorfico, decise, nel 2013, di abbandonare lo scheumorfismo, causò una grossa oscillazione verso il Flat, il quale è rimasto molto popolare negli ultimi anni. L’enfasi verso il minimalismo ha aiutato a spingerlo verso la sua corrente ubiquità.

Lo stile flat è caratterizzato dall’assenza di:

  • elementi sollevati che indichino all’utente che possono essere clickati;
  • elementi cavi o affondati che indichino all’utente che possono essere riempiti  (pensa ai campi per la ricerca o l’input)

TRANSIzione al 2.0

Nonostante il successo del flat, alcuni designer hanno iniziato a notare legittimi difetti che non erano presi in considerazione dalla community di design. Mentre il flat ha guadagnato un sacco di notorietà per il suo minimalismo, è andato un po’ troppo in là nella direzione dell’austerità. D’altro canto le caratteristiche di alcuni effeti 3D sono risultate eccessive e hanno influenzato l’esperienza dell’utente negativamente.

Perciò, era inevitabile che un altro cambiamento sarebbe avvenuto. E ‘ quello che sta succedendo oggi con l’avvento del flat design 2.0.

i problemi di utilizzo del flat design

Tutti i problemi di utilizzo possono essere riassunti nella seguente affermazione: il flat design tipicamente baratta i bisogni dell’utente per l’estetica.

In altre parole, i designer che fanno il design per un’interfaccia che sia “flat” porranno un sacco di enfasi sul mantenerla minimal, non-3D, e vibrante invece che mettere l’esperienza dell’utente per prima. Qui è dove di solito tutte le brutte cose succedono ed è per questo che il flat si è evoluto al 2.0.

Questi sono comuni problemi di utilizzo con il flat:

  • assenza di tutti gli elementi che aiutano a interpretare il significato (gradienti, ombre, sottolineature, etc.);
  • assenza di pattern familiari (blu, sottolineature per i links, etc);
  • assenza di indicazioni contestuali (Call To Action, copywriting che funzioni, etc.)

Forse l’esempio più noto nella memoria recente di noi tutti sono stati i problemi di utilizzo che ha avuto la Microsoft con il rilascio di Windows 8, con il così chiamato Metro UI. Questo design è stato il parossismo del flat perché ogni cosa è stata portata verso il piatto più estremo.

002

L’esperienza dell’utente è stata terribile perché il design completamente piatto ha creato una situazione in cui non si davano gli indizi necessari all’utente per comunicargli cosa poteva essere clickato e cosa non. Come risultato, gli utenti sono stati forzati a spendere tempo extra per capire come fare cosa per via empirica o peggio ancora, facendo errori che avrebbero preferito evitare!

Come puoi vedere, lo schermo di Windows 8 è così piatto che è impossibile per le persone dire cosa clickare e cosa non clickare. Anche se gli utenti sono già familiari con la navigazione basica di un sito, ciò non significa che sia una buona idea rimuovere tutti gli indizi significativi (indizi che indicano agli utenti gli elementi della pagina con cui possono interagire) e gli indizi di affordances (indicazioni su come gli utenti possono interagire con gli elementi della pagina).

ottimi esempi di flat design 2.0

2.0 è un sottile cambiamento e miglioramento del flat, perciò potrebbe richiedere un po’ di concentrazione trovare un sito web con vere interfacce 2.0 ma ci sono già grossi esempio di 2.0 operativi.

LA GUIDA DI DROPBOX

La guida di Dropbox potrebbe a prima vista sembrare piatta ma se guardi più da vicino, vedrai suggerimenti 3D che comunicano chiaramente agli utenti che alcuni elementi sono sollevati sopra altri. Questo è principalmente evidente nell’immagine con la testa del ragazzo (sul lato sinistro) e quella del cacciavite (sul lato destro). Entrambe le immagini sono forti e hanno, benché sottili, bordi neri che comunicano profondità e l’impressione che soggiacciono sullo sfondo anziché fondersi con esso.

003

TOLIA ICE CREAM

Tolia è pieno di sottili, sollevati effetti che danno l’impressione distinta del 3D mentre il design complessivo è ancora flat e minimal. L’impressione sollevata è presente nella headline, la sub-headline e la descrizione. Presenta anche il bottone per la Call To Action. Puoi ringraziare il sottile utilizzo d’ombre tutto attorno ai bordi di questi elementi per questo effetto sollevato.

004

GOOGLE SANTA TRACKER

Senza troppo stupore, Google è sul vagone del 2.0, e la pagine del Santa Tracker mostra come si possa integrare il 2.0 in modo divertente e utile. Le sottigliezze del 2.0 abbondano sulla pagine in ogni cosa: dai gradienti e le ombre sulle varie costruzione e le bolle alle headline in impressione 3D in cima alla pagina.

005

PUBLICIS GROUPE

La pagina del novantesimo anniversario di Publicis Groupe fa un ovvio utilizzo del 2.0.  Se guardi al lato sinistro della pagina, vedrai una combinazione di ombre e grandienti che scendono e irradiano verso l’esterno a partire dal pallido cerchio e sulla sezione blu sottostante. Il minimalismo rigido indica anche che l’estetica del design affonda ancora fortemente le sue radici nel flat.

006

JUMEIRAH

Questo sito per un hotel di lusso negli Emirati Arabi è per lo più dominato da un enorme video sullo sfondo, nonostante ciò non distrae dal sottile contributo del 2.0. La scritta “Jumeirah Inside” sulla headline ha una sottile ombra che dà l’impressione del 3D mentre il tutto mantiene un look piatto.

007

un evoluzione dettata dalla domanda

Nel mondo del design, le cose di solito cambiano perché c’è richiesta. Qualcuno nota che qualcosa manca e trova un modo di migliorare le cose, o qualcun’altro prende un concetto e lo porta a un altro livello.

Per quanto riguarda il 2.0, è definitivamente una combinazione di entrambi poiché i problemi di utilizzo sono sistemati estendendo il concetto originale in un modo che onora i principi del minimalismo che definiscono il flat.

 Per un design pulito ed efficace: contattaci, è gratis!