BACK

Web Design Trends: Neuomorphism

Comunitatea de web designeri cauta tot timpul lucruri noi pe care le pot folosi in constructia de aplicatii web si website-uri.

Unul din trendurile de UI cele mai noi si mai discutate in 2019 si 2020 este Neuomorphism-ul. Acesta este o combinatie intre Skeuomorphism, un design care incearca sa reproduca elementele grafice (butoane, iconite, etc) intr-o forma cat mai realista, folosita in special de catre Apple inainte mortii lui Steve Jobs si Material Design, un limbaj grafic dezvoltat de Google pentru Android si aplicatiile sale, recunoscut prin simplicitate si design-ul foarte plat cu doar umbrele oferind cateva urme de efecte 3D.

Desi nu cred ca vom vedea o adoptie ridicata de Neuomorphism in viitorul apropriat, tendinta de a ne indeparta de design-ul plat “lipsit de viata” catre unul putin mai apropriat de realism este din ce in ce mai vizibila. Apple a facut aceasta schimbare in iOS 13 unde a reusit sa dea un efect 3D fara texturi elementelor grafice.

Acest trend a inceput printr-o postare facuta de catre Alexander Plyuto pe Dribble cu cateva concepte de UI care a devenit virala foarte rapid castigand mii de like-uri. Dupa aceasta postare, o adevarata explozie de concepte similare au aparut pe internet.

Mai jos sunt cateva exemple scrise de mine de carduri animate create cu design Neumorphic in gand. Spre deosebire de cele facute folosind design-ul Material, care creaza o suprafata ce pluteste peste background si lasa o umbra, card-urile neuomorphice incearca sa imite forme geometrice care se ridica din background, in general folosind acelasi material ca background-ul. Efectul este realizat folosind doua umbre, una deschisa la culoare (pozitiva) si una inchisa la culoare (negativa). Pentru a obtine acest efect, background-ul nu trebuie sa fie alb sau negru, umbrele fiind necesare sa fie vizibile pe acesta si sa dea impresia de un punct de lumina care deschide si inchide o parte a cardului (pentru animatii faceti hover cu mouse-ul sau apasati cu degetul pe ecran).

Folosind aceleasi principii putem crea elemente grafice care imita obiecte reale 3D fara sa deviem mult de la idea de design plat. Mai jos avem un design simplu de calculator, dar formele create pot fi mult mai complexe daca este necesar, cu conditia sa fie in continuare curat si usor de inteles.

2020
0
1
2
3

Pentru a vedea codul pentru exemplele de mai sus accesati urmatorul link.

Ca orice alt design exista si probleme de care trebuie sa tinem cont atunci cand il folosim sa creeam un UI. Dupa cum se poate observa mai sus, elementele grafice nu au un contrast puternic si daca vrei sa creezi butoane vei fi fortat sa adaugi culori care ofera un contrast mult mai puternic in interior (fie schimband background-ul, iconita/textul din buton sau adaugand border/underline). Trebuie sa ne asiguram ca este functional si usor de vazut.

Odata cu popularitatea Neuomorphism-ului, comunitatea de design UI/UX a fost reinvigorata si a readus placerea de experimentare si explorare a unor tipuri noi de design. Lumea nu mai vrea ca toate lucrurile sa arate identic si in fiecare zi sunt postate noi concepte de UI. Nu stim care va urmatorul trend in voga, dar cu siguranta nu va fi unul plictisitor.

Mai multe articole

INOVEO a scris

The Importance of Sustainable Design in Branding

If everyone is talking about sustainability, we cannot ignore discussing it from a branding perspective. Environmental awareness has always been a growing trend. Now, more than ever, brands are under increasing pressure to adopt sustainable [...]

Read More... from Web Design Trends: Neuomorphism

Citeste tot articolul

INOVEO a scris

„Quirky” Sans Serif Fonts: The 2024 Trend

The evolution and shifts in trends from one season to another are most pronounced when it comes to design. This year, in graphic design among other fields, we are seeing a spotlight on a category [...]

Read More... from Web Design Trends: Neuomorphism

Citeste tot articolul

INOVEO a scris

How Complex Should Your Website Be?

It’s clear that websites are becoming increasingly large and complex, with both programmers and clients contributing to this trend. Programmers want to showcase their ability to create intricate projects, while clients desire content-rich websites filled [...]

Read More... from Web Design Trends: Neuomorphism

Citeste tot articolul

INOVEO a scris

INOVEO Answers Questions from ZF Romanian Brands Yearbook 2024

What is the recipe for creating a brand? How long does it take to build one? How much does it cost? Where do you start and where do you end? What are the key ingredients? [...]

Read More... from Web Design Trends: Neuomorphism

Citeste tot articolul