3 voordelen van Material Design

Material design is de nieuwe designtaal, ontwikkeld door Google.

Bij GoalGorilla gebruiken we Material Design voor meerdere projecten, waaronder voor ons eigen product Open Social. Maar wat is Material design en wat zijn de voordelen?

In 2014 introduceerde Google een nieuwe designtaal, genaamd Material Design. Google ontwikkelde deze nieuwe designtaal voor het besturingssysteem Android. Ze willen er hiermee voor zorgen dat alle applicaties dezelfde user interface hebben. Material design is een combinatie van bestaande design principes met technologische innovaties. Voor designers heeft Google een Material Design handleiding (styleguide) gemaakt. Hierin legt Google uit hoe elementen eruit moeten zien en hoe deze zich moeten gedragen.

Design trends en Material Design

In de afgelopen jaren zijn er verschillende design principes geweest binnen webdesign, zoals Skeuomorfisme en Flat design. Skeuomorfisme draait om het zo echt mogelijk maken van elementen: een button moet eruit zien alsof het een knop is uit de fysieke wereld. Flat design is het tegenovergestelde van Skeuomorfisme, waarbij de focus ligt op de functie van een element en deze juist zo abstract mogelijk wordt weergegeven. Material design is kenmerkend door het gebruik van Flat design in combinatie met diepte.

Ontwikkeling van design stijlen: van Skeuomorfisme tot Material Design.

In deze video wordt er een uitleg gegeven hoe Material Design is ontwikkeld: https://www.youtube.com/watch?v=rrT6v5sOwJg

Drie voordelen van Material Design

1 - Responsive en daardoor mobile first

Material Design is responsive opgezet, dit betekent dat de layout van website zich aanpast aan het device. Sinds de opkomst van de smartphone is het aantal mobiele bezoekers exponentieel gestegen. Wereldwijd bezoekt 52,7% (Statista, 2016) van de websitebezoekers een website van een mobile, in de VS ligt het aantal mobile website bezoeken zelfs op op 75.1%. Material design werkt daarom met een ‘Mobile First’ methodiek, dit houdt in dat er van klein naar groot wordt gewerkt. Eerst wordt de layout ontworpen voor mobiel, vervolgens tablet en daarna desktop. Google (search) vindt het belangrijk dat iedere gebruiker op elk device goed de website kan gebruiken. Wanneer een website niet responsive is, kan dit daarom gevolgen hebben voor de ranking in Google.

2 - Usability dankzij lagen en beweging

Material Design werkt met lagen. Elke laag heeft zijn eigen hoeveelheid schaduw. Hierdoor wordt de suggestie gewekt dat bepaalde elementen hoger liggen. Het voordeel van het werken met lagen is dat elementen niet door elkaar heen schuiven, maar over elkaar heen. Wanneer er bijvoorbeeld gebruikt wordt gemaakt van een fixed menu, heeft het menu de meeste schaduw. Het menu scrollt dan niet door de content heen, maar over de content . Naast het werken met lagen, werkt Material Design veel met subtiele animaties. De combinatie van animaties en het werken met lagen wordt de usability versterkt (gebruiksvriendelijkheid). Hieronder zie je hoe het menu over de content heen scrollt in plaats van er door heen.

Material Design animatie: lagen en beweging.
Voorbeeld van lagen en beweging in Material Design.

3 - Herkenbaarheid vs begrijpbaarheid

Een website bezoeker heeft een paar seconden nodig om een eerste indruk van je website te krijgen. Wanneer een bezoeker de website niet begrijpt, is hij minder of zelfs niet vatbaar voor verleidingstechnieken en zal niet verder klikken. Material Design zorgt door middel van stilistische vormen en standaardisatie voor een zo begrijpbaar mogelijk webdesign. Het standaardiseren van webdesign heeft een nadeel voor de herkenbaarheid. Het is daarom belangrijk dat er een goede balans wordt gemaakt tussen herkenbaarheid (branding) en de Material design principes. Google heeft in de Material styleguide vrijwel voor alle algemene website elementen beschreven hoe ze vormgegeven moeten worden, op deze manier kan een designer eenvoudig bepalen wat er nodig is en hoe hij dit gaat toepassen. Een groot voordeel hiervan is dat het design proces minder tijd kost en er een goede balans wordt gelegd tussen begrijpbaarheid en herkenbaarheid.

Material Design bij GoalGorilla 

Wij kiezen per project of de Material Design designtaal geschikt is. Om een consistente gebruikerservaring in web applicaties te genereren is het zeer aan te raden. Om die reden hebben we bijvoorbeeld voor onze community software gekozen voor Material Design.

Voor andere toepassingen zoals marketing websites is een ander aanpak of design richtlijnen misschien beter geschikt. Deze keuzes liggen op het snijvlak van design en programmeren. Daarom zijn bij ons altijd multidisciplinaire teams betrokken bij projecten zodat deze keuzes weloverwogen worden gemaakt. Lees meer over onze design werkwijze en wat we voor jouw website of web applicatie kunnen betekenen.

Heb je een specifieke vraag, laat dan een comment achter of spreek ons tijdens werktijden via de live chat of bel naar 0800 - GOAL (4625). Een e-mail kan natuurlijk ook: info@goalgorilla.com. Binnen één werkdag heb jij een reactie.

Designer
Bas van Os van den Abeelen

Bekijk ook onze andere nieuwsartikelen

Klik voor onze award winnende klanten