Tendenze del design: Flat Design 2.0
Il design piatto ha preso d'assalto il mondo del design nei pochi anni in cui è stato girato, ma nessun movimento di design rimane mai puro al 100% alle sue radici e ai suoi ideali. Questo è esattamente ciò che sta accadendo con il design piatto: si vedono gradualmente cambiamenti subdoli se significativi alla sua iterazione originale.
Questi cambiamenti sono stati sufficienti per far sì che osservatori ed esperti doppino la nuova iterazione come Flat Design 2.0. 2.0 è molto interessante perché colpisce il giusto equilibrio tra le modifiche appena sufficienti per alterare l'esperienza dell'utente e rimanere fedele ai suoi principi originali.
L'evoluzione di Flat in 2.0 era inevitabile, tuttavia: poiché i designer si sentivano più a loro agio con Flat, potevano vedere che, per tutta la sua popolarità, alcuni problemi non venivano affrontati correttamente . E ora abbiamo 2.0 per affrontare alcune di queste carenze.
Origini del design piatto
Guarda il design piatto come una sorta di ribellione contro lo stile di design allora popolare di skeuomorphism . Si basava su effetti 3D per copiare le proprietà reali degli oggetti 3D come un modo per usare la familiarità per aiutare l'esperienza dell'utente. Ad esempio, nelle iterazioni iniziali di Kindle Fire di Amazon, c'era una libreria 3D in background per rafforzare lo scopo del tablet per la lettura.
Quando Apple, un grande sostenitore del design skeuomorphic, ha deciso, nel 2012, di abbandonare lo skeuomorphism, che ha preannunciato un pieno successo a flat, che è rimasto molto popolare negli ultimi anni. La sua enfasi sul minimalismo ha anche contribuito a spingerlo alla sua attuale ubiquità.
Flat è caratterizzato dalla sua assenza di:
- elementi sollevati che indicano agli utenti che possono essere cliccati;
- elementi vuoti o incavati che indicano agli utenti che possono essere riempiti (si pensi ai campi di ricerca e ad altri campi di input).
Transizione a 2.0
Nonostante il successo di Flat, alcuni designer hanno iniziato a notare difetti legittimi che non venivano affrontati nella comunità del design. Mentre Flat ha guadagnato molto vapore grazie al suo minimalismo benevolo, è andato un po 'troppo lontano nella direzione austera. Le caratteristiche di alcuni effetti 3D si sono rivelate eccessive e hanno avuto un impatto negativo sull'esperienza dell'utente.
Pertanto, era inevitabile che si verificasse un altro cambiamento. Ecco dove siamo oggi con l'alba del design piatto 2.0.
Problemi di usabilità di Flat Design
Tutti i problemi di usabilità di Flat possono essere riassunti nella seguente affermazione: Flat tipicamente si traduce nelle esigenze di un utente per l'estetica dell'anca.
In altre parole, i designer che progettano un'interfaccia come "piatta" metterà maggiormente l'accento sul mantenere le cose minime, non 3D e vivaci / audaci invece di mettere l'esperienza dell'utente al primo posto. Di solito è qui che iniziano tutte le cose brutte nel mondo del design, ed è per questo che flat si è evoluto in 2.0.
Ecco i problemi di usabilità comuni con flat:
- assenza di significanti importantissimi (gradienti, ombre, sottolineature, ecc.);
- assenza di schemi familiari (testo blu sottolineato per collegamenti, ecc.);
- assenza di indicazioni contestuali (posizionamento CTA, copia impugnabile, ecc.).
Forse l'esempio più noto nella recente memoria di tutti i problemi di usabilità di Flat è stato il rilascio di Microsoft di Windows 8, con la sua cosiddetta Metro UI. Quel design era l'epitome di flat perché tutto era piatto all'estremo.
Il l'esperienza dell'utente era così brutta perché un design completamente piatto significa che agli utenti non vengono forniti gli indizi necessari per dire loro cosa può essere cliccato e cosa non può essere su un'interfaccia. Di conseguenza, gli utenti sono naturalmente costretti a dedicare più tempo a capirlo attraverso la sperimentazione o, peggio ancora, a eseguire azioni per errore che non volevano in primo luogo!
Come puoi vedere, lo schermo di Windows 8 è così piatto che è impossibile per le persone dire cosa cliccare e cosa non fare clic. Anche se gli utenti hanno già familiarità con la navigazione di base del sito, ciò non significa che sia una buona idea rimuovere tutti i significatori (indizi che dicono agli utenti che possono interagire con gli elementi della pagina) e suggerimenti di affordance (indicazioni su come gli utenti possono interagire con elementi della pagina).
Grandi esempi di Flat Design 2.0
2.0 è un sottile cambiamento o miglioramento rispetto al flat, quindi potrebbe richiedere più concentrazione per individuare il vero 2.0 nei siti web e nelle interfacce. Ecco perché ti illustreremo alcuni esempi attuali di 2.0 che sono già in piena attività.
La guida di Dropbox
Guida di Dropbox a prima vista potrebbe sembrare davvero piatto, ma se guardi più da vicino, vedrai suggerimenti 3D che comunicano chiaramente agli utenti che alcuni elementi vengono sollevati rispetto ad altri. Ciò è evidente soprattutto nelle immagini della testa del ragazzo (sul lato sinistro) e dei cacciaviti (sul lato destro). Entrambe le immagini hanno dei bordi forti, anche se sottili, che comunicano la profondità e l'impressione di stare seduti in cima allo sfondo invece di fondersi con esso.
Gelato alla Tolia
Il sito di Tolia è pieno di effetti sottili e in rilievo che danno la netta impressione del 3D mentre il design generale è ancora piatto e minimale. L'impressione sollevata è presente nel titolo, nel sottotitolo e nella descrizione (es., La copia della pagina). È presente anche nel pulsante di invito all'azione e nella copia del CTA all'interno del pulsante. Puoi ringraziare l'uso sottile delle ombre fini attorno ai bordi di questi elementi per dare questa impressione sollevata.
Google Santa Tracker
Non sorprende, Google è sul carro del 2.0, e il suo Santa Tracker pagina mostra come si può integrare 2.0 in modo divertente e utile. Le sottigliezze del 2.0 abbondano sulla pagina in tutto, dai gradienti e dalle ombre sui vari edifici e bolle pop-up (quando gli utenti si posizionano su qualsiasi edificio) all'immagine 3D del titolo nella parte superiore della pagina.
Publicis Groupe
Publicis Groupe's La pagina del 90 ° anniversario vanta l'influenza 2.0 in un modo abbastanza ovvio. Se guardi il lato sinistro della pagina, vedrai la combinazione di ombre e sfumature che scende e si irradiano verso l'esterno dal cerchio pallido e dalla sezione blu sottostante. Il rigido minimalismo indica anche che il suo design estetico è ancora fortemente radicato in puro appartamento.
Jumeirah
Questo sito per un hotel di lusso negli Emirati Arabi Uniti è per lo più dominato da un video gigante sullo sfondo, ma non lasciatevi distrarre dall'assorbire la sottigliezza del suo contributo 2.0. Il titolo "Jumeirah Inside" presenta un'ombreggiatura così sottile che dà l'impressione del 3D mantenendo l'aspetto generale e piatto.
Un'evoluzione per domanda
Nel mondo del design, le cose cambiano di solito perché c'è una domanda per questo. Qualcuno noterà che manca qualcosa e trova un modo per migliorare le cose, o qualcun altro prenderà un concetto e lo porterà a un altro livello che si basa logicamente su un determinato concetto.
Per quanto riguarda il 2.0, è sicuramente una combinazione di entrambi, poiché le carenze di usabilità di Flat vengono corrette estendendo il concetto originale in un modo che onora ancora i principi del minimalismo definiti da flat.