#SPEAKABEET about NEUMORPHISM

Speakabeet: la rubrica in cui parliamo dei massimi sistemi del mondo digitale, del flusso delle maree di caffè e della rotazione giornaliera della sedia del Programmatore sul proprio asse. #Coding #Design #DigitalLife

Anna Grazia Longobardi
weBeetle
4 min readMay 20, 2020

--

Material Design qui, Material Design lì. Dal 2014 Google con il suo design system ha settato quasi uno standard nel design di interfacce, scavallando l’ostinazione dello Skeuomorphism (Scheomorfismo), tanto amato da Apple e Microsoft. Azzardo a chiamarlo “standard” poichè il Material Design è ormai onnipresente: se solo si apre una qualsiasi app approdata in uno store, 2 su 3 sicuramente seguiranno il design system di Google. Tra fine 2019 e inizi 2020 però, quasi per una forma di rivoluzione del design digitale, avviene una “presa della bastiglia” del Material Design: il Neumorphism (Neomorfismo).

Fonte: Petrology of Sedimentary Rocks, By Sam Boggs Jr (Cambridge University Press, 19 feb 2009)

DEFINIZIONE

Prima di analizzare le caratteristiche di questo design system embrionale, mi vorrei soffermare sull’analisi del nome: dopo un po’ di ricerche, ho trovato uno studio sui minerali e le rocce sedimentarie in cui Boggs afferma che “il termine neumorfismo si riferisce a cambiamenti diagenetici che si verificano a causa della trasformazione polimorfica e / o della ricristallizzazione.” Estendendo il concetto e aiutandoci con l’etimologia delle parole, può riferirsi a cambiamenti nella forma (der. del gr. morphè “forma”) di cose già esistenti ma non difatti nella struttura. Una nuova (neu) forma (morphè).

“Neo” è il suffisso usato anche per indicare il risorgere di vecchie “strutture” (pensieri, movimenti, scuole di pensiero, ecc) in una nuova forma, quindi se posso dirla in “digitalese”, una versione 2.0.

E se quindi Skeuomorphism e Material Design fossero cambiati diageneticamente e si fossero ricristallizzati nel Neumorphism?

Skeuomorphism + Material Design = Neumorphism?

In testa, si può dare un occhio agli esempi di stile e alle differenze dei design system di:

  • Skeuomorphism (Scheumorfismo): si riferisce ad una tecnica secondo cui le interfacce grafiche simulano oggetti del mondo fisico. In quel periodo era una tecnica strabusata da chiunque facesse software, da Apple, Microsoft, IBM, ecc. (su OS Windows l’icona della cartella imitava una cartella cartacea reale, sui primi dispositivi iOS l’icona della fotocamera simulava la figura di una macchina fotografica analogica reale, e così via);
  • Material Design: si riferisce al design system il cui concept si basa su layout costruiti su griglie e sulla sovrapposizione di layer che concedono profondità grazie alle ombre. Su questo, il designer Matías Duarte ha spiegato nel Google keynote di presentazione nel 2014 che il loro nuovo linguaggio di design è basato su carta e inchiostro;
  • Neumorphism (Neomorfismo): si riferisce ad una tecnica di design di interfacce che si sta diffondendo nel 2020 e che sembra ereditare le peculiarità delle sovrapposizioni della “carta” del Material Design e la simulazione delle interazioni semirealistiche dello Skeuomorphism, fondendosi ed espandendosi con estrusioni (per eredità scheumorfica) ottenute da bagliori oltre che da ombre (per eredità del Material Design), ottenendo quindi uno stile molto più plastico.

Conclusione

Esempio di UI Neomorfica

Durante il keynote di Google sul Material Design, il designer Matías Duarte disse che “unlike real paper, our digital material can expand and reform intelligently. Material has physical surfaces and edges. Seams and shadows provide meaning about what you can touch” (“a differenza della carta vera, il nostro materiale digitale può espandersi e cambiare in modo intelligente. Il Material Design ha bordi ed una superficie fisica. Le sovrapposizioni e le ombre danno informazioni su ciò che si può toccare e come si muoverà”). Se si analizza l’ultima frase -e in generale lo stile material- le sovrapposizioni come informazione intrinseca delle interazioni è un concetto fondamentale che il neomorfismo sembra prendere e portarlo ad una nuova definizione, quasi come se fosse un Material Design 2.0. Il rischio è che una UI così soft -seppure plastica- sia allettante per designer ma non accessibile per utenti. Ma questo può semplicemente significare che serva ancora del tempo perchè se ne sperimentino gli usi, gli stili, gli schemi, i layout e maturi nella sua forma definitiva.

Curiosità

Per i più curiosi e smanettoni, lascio qui il link ad un tool online, che fa comprendere l’applicazione neomorfica degli stili di ombre, bagliori e gradienti su un oggetto.

Neumorphism.io — Generate Soft-UI CSS code” creato da Adam Giebl

Letture Consigliate

#SPEAKABEET about UI, Anna Grazia Longobardi x weBeetle, 2019

#SPEAKABEET about UX, Anna Grazia Longobardi x weBeetle, 2019

Brano consigliato per la lettura

--

--