Design Trend: Neumorfismo

La prossima grande novità nel neumorfismo del design di siti Web e app? È una tendenza del design (chiamata mashup delle parole new e skeuomorphism) che sta crescendo in popolarità. Le persone sembrano amarlo o odiarlo, ma è abbastanza interessante che Cult of Mac ha recentemente pubblicato un articolo che pone la domanda: "Il neumorfismo è il nuovo grande look per iOS 14?"

Non sapremo ancora la risposta da un po ', ma la tendenza sta prendendo piede, in particolare su Dribbble, dove vediamo il lancio di molte tendenze del design.

Ecco uno sguardo a un neumorfismo che ti aiuta a farti un'idea di ciò che è (e non è) in modo che la tendenza non ti passi.

Cos'è il Neumorfismo?

Neumorfismo è un termine che ha iniziato a guadagnare trazione alla fine del 2019 e quest'anno ha guadagnato ancora più slancio. La combinazione di nuovo (neo / neu) skeuomorfismo cade da qualche parte tra la stupidità del vero skeuomorfismo e la semplicità del quasi piatto.

È caratterizzato da un colore semplice con ombre per aggiungere profondità e avere una sensazione quasi reale senza essere esageratamente. Il design potrebbe includere ombre sia interne che esterne per creare questo effetto.

I primi riferimenti della tendenza possono essere ricondotti a un post di Michal Malewicz che la descrive: “Una carta moderna / materiale (potenziata) di solito è una superficie che galleggia sopra il nostro sfondo percepito e che getta un'ombra su di essa. L'ombra le conferisce profondità e in molti casi definisce anche la forma stessa, poiché è abbastanza spesso senza bordi. "

Il sito Web di Malewicz (sopra) dedicato alla tendenza utilizza in modo appropriato lo stile.

Il Neumorfismo si sta manifestando come uno stile di tendenza su Dribble, dove tonnellate di colpi sono spuntati usando questi concetti. (Ne abbiamo mostrati alcuni qui.)

La maggior parte degli esempi presenta progetti di app in stile card in cui questa tecnica di progettazione sembra attenuare la durezza dell'interfaccia generale.

Caratteristiche di questa tendenza del design

La radice del concetto di neumorfismo è che il design digitale imita o agisce come l'oggetto che rappresenta.

Nota come i pulsanti nell'esempio dell'app musicale (sopra) sembrano essere stati inseriti. Gli elementi neumorfi, se fatti bene, sembrano mostrarti come usarli e interagire con essi, come premere pulsanti, spostare i cursori o ruotare le ghiere .

Il neumorfismo sembra anche essere un'estensione della tendenza del design minimale. Molti design dispongono di interfacce bianche, ma anche le opzioni della modalità oscura stanno diventando sempre più popolari. Ma non c'è niente da dire che non puoi creare un'interfaccia in stile neumorfismo in un altro colore.

Gli elementi visivi comunemente associati al neomorfismo includono:

  • Tavolozza di colori chiari o morbidi (ma non sempre grazie alla popolarità della modalità scura)
  • Forme di base, come cerchi o rettangoli, in tutto il design
  • Ombre sottili ed effetti per la maggior parte (ed è tutto fatto HTML e CSS)
  • Ombre più drammatiche per pulsanti ed elementi cliccabili

Ma fai attenzione (sfide al neomorfismo)

La tendenza del neumorfismo non è priva di sfide.

Le principali aree problematiche sono l'accessibilità e il contrasto, che sono questioni correlate.

Con progetti che utilizzano schemi di colore abbastanza monotoni e molto bianco, nell'interfaccia non sono soddisfatti tutti gli standard di accessibilità per il colore. Questo è un problema correggibile e potrebbe aiutare a modellare e spostare il modo in cui questa tendenza si evolve.

Se stai progettando con tecniche di neumorfismo, ricorda di tenere a mente alcune cose per assicurarti che il tuo progetto funzioni per il maggior numero di persone possibile.

  • Progetta pulsanti con un contrasto extra e assicurati che sembrino pulsanti
  • Non forzarti a esagerare con le ombre per renderle più visibili; concentrarsi sul testo e fare clic sugli elementi di comando / tocco
  • Usa livelli di effetti di design per pulsanti che sembrano simili in diversi stati, come la pressione di un pulsante
  • Non pensare di dover esagerare; mantienilo semplice

Neumorfismi Esempi

Ci sono molti grandi esempi di questa tendenza da una varietà di designer. Eccone alcuni per avviare il processo creativo e ispirare i progetti.

Neo Spotify

Riunione del cruscotto

Neumorfismo Mobile Banking

App Smart Home

Neo Instagram UI Concept

Neumorfismo Concept Design

Cruscotto criovaluta

Strumenti e risorse sul neumorfismo

Se vuoi sperimentare ombre e disegni neumorfi, ci sono alcuni strumenti per aiutarti a ottenere l'idea.

  • Neumorphism CSS Generator (sopra)
  • Neumorfismo Ombra e stili di colore
  • Neumorfismo Sktech file
  • Kit dell'interfaccia utente di Neumorphism Finance (sopra)
  • Interruttore dinamico chiaro / scuro usando il design del neumorfismo
  • Neomorfismo sparato su Dirbbble

Conclusione

Il neumorfismo è una tendenza di design divertente che mi piace perché mi piacciono così tanto le interfacce minime bianche (o scure). Non c'è molto da ostacolare nel design e i concetti sembrano un po 'più utilizzabili e intuitivi rispetto a quelli piatti e meno fumettistici del vero scettuomorfismo.

Quando si tratta di questo, questa tendenza è come la maggior parte delle altre cose: è una questione di preferenze personali. Considereresti di usarlo in uno dei tuoi progetti o sarà solo una moda passeggera?

© Copyright 2021 | computer06.com