Już w 2016 roku mówiło się o stylu graficznym, który zyskuje coraz większą popularność na stronach internetowych.
W ciągu dwóch lat material design wszedł przebojem w witryny jak i aplikacje mobilne, nadając lekkości i znacznie ułatwiając nawigację.
Co się kryje pod tajemniczym terminem material design?
Styl stworzyli graficy z Google’a, który w założeniu miał być łatwy do stosowania, czytelny i prosty, który umiejętnie łączy zasady dobrego projektowania z innowacyjnością. Nurt został zaprezentowany podczas aplikacji Google Now, po czym, został wdrożony w innych produktach marki Google – Gmail, Google Drive czy Google Docs.
Obecnie, material design… jest dokładnie tym, czym miał być w założeniach! 🙂
To globalny, wypracowany styl, który swoją prostotą i użytecznością zdobywa coraz większe uznanie i jest szeroko stosowany we wszelkich internetowych formach graficznych.
Jak na rozsądnie zaprojektowane novum przystało, cały nurt doczekał się dedykowanej witryny, na której dowiedzieć się możemy wszelkich szczegółów i zasad stosowania material design, nie tylko w oparciu o aplikacje, ale także o strony internetowe – www.material.io
Czym charakteryzuje się material design?
Kolor.
Ważna cechą tego stylu są kolory, które powinny być żywe oraz wyróżniające się. Google daje nam do dyspozycji palety dobrze dobranych kolorów, z których powinniśmy wybrać jeden podstawowy oraz drugi dodatkowy dobrze odznaczający się na tle tego pierwszego, aby wyszczególnić ważniejsze elementy w aplikacji.
Podstawowe kolory w palecie oznaczone są liczbą 500, i to one powinny posłużyć jako kolory bazowe, od których następnie możemy tworzyć elementy w różnych odcieniach tego koloru. Dzięki takiemu podejściu aplikacja staje się żywsza, ważne elementy dobrze się odznaczają na tle innych, ale wciąż pozostają z nimi w harmonii.
Drugi kolor, używany jako dodatkowy powinien zdecydowanie wyróżniać się na tle koloru dominującego i być wykorzystywany do wyróżniania ważnych elementów projektu (buttony Call to Action, linki, przyciski etc)
Cienie
Czyli ułożenie w przestrzeni. Dodając cienie dajemy wrażenie ułożenia elementów w przestrzeni i hierarchię poszczególnych elementów czy sekcji witryny. Elementy które wydają się znajdować wyżej od innych, są odbierane jako ważniejsze do podjęcia akcji.
Infografika
Proste i intuicyjne. Koniecznie! Unikamy szczegółowych “barokowych” ikon, które obfitują w różnych grubości linie i krzywizny. Takie zastrzeżenie jest podyktowane mobilnością – bardzo dokładne ikony, po pierwsze przestają być ikonami, a stają się grafikami, a po drugie, przy małych rozdzielczościach stają się niewidoczne.