Material design – jak, jak i gdzie

28 sierpnia 2018

Trend material design swój główny rozkwit przeżywał w okolicach 2016 roku, po czym jakby lekko przygasł. Po czym… Znów możemy obserwować jego powrót.
Mimo, że o samym stylu słyszy się obecnie całkiem dużo, to nie każdy jest w stanie precyzyjnie określić na czym dokładnie polega i co przedstawia.

Definiując, material design został stworzony przez Google, które chciało dać swoim użytkownikom prosty, a równocześnie czytelny i łatwo dostosowywalny do różnych płaszczyzn styl graficzny. Był on także w pewnej części odpowiedzią na popularny styl flat, którego braki wyszły na jaw po zderzeniu z rzeczywistością.

Po raz pierwszy material design zaprezentowano podczas premiery aplikacji Google Now, następnie stopniowo był on wdrażany także w inne aplikacje wydawcy. W 2014 roku Material Design ogłoszono oficjalnym stylem produkowanych przez Google aplikacji mobilnych, między innymi takich jak Gmail, Google Drive, Google Docs. Szybko także inni twórcy zaczęli wykorzystywać jego założenia podczas tworzenia swoich projektów.

Obecnie, trend ten rozrósł się do globalnego stylu, który swoją prostotą użytecznością i elegancją zdobywa coraz to nowe nisze i branże w materii projektowania stron www.

Czym więc charakteryzuje się material design?

Po pierwsze: trójwymiarowa przestrzeń. I bynajmniej nie chodzi tu o grafiki rodem z Flasha, przedstawiające odwzorowane przedmioty, okręcające się w każdej płaszczyźnie 🙂
Położenie w trójwymiarze polega na uświadomieniu sobie odpowiedniej hierarchii elementów witryny za pomocą delikatnego cieniowania.

Po drugie: kolorystyka. Dobrze dobrana i “siedząca” w projekcie. Z zasady posiadamy w głowie jakąś paletę barw, jednak dobrze jest wszystko osadzić w białym, bądź czarnym tle i na tej bazie budować na zasadzie kontrastów dalsze zestawienia kolorystyczne.
Podstawowy stanowi bazę do tworzenia kolejnych jego wariacji. Kolor dodatkowy (towarzyszący) powinien zdecydowanie odznaczać się na tle podstawowego i być wykorzystywany do wyróżniania istotnych elementów interaktywnych projektu – linków czy buttonów Call to Action. Powinien on także pochodzić z palety dodatkowej i być zdecydowanie bardziej nasycony.

Po trzecie: proste ikony. Trend, można powiedzieć “Stary jak świat”, jednak cały czas można spotkać w sieci “kwiatki”, które kłują w oczy. Istnieje kilka zasad, którymi należy kierować się przy doborze ikon:

– unikamy skomplikowanych kształtów
– wszelkie zakończenia linii winny być proste
– Ikony powinny posiadać t samą grubość, także światła pomiędzy liniami, czy odstępy od elementów
– wszystkie kształty powinny wywodzić się z podstawowych kształtów geometrycznych, czyli stare, ale jakże jare: simply the best.