Material Design: alles over het nieuwe Android-design

Zo mooi ziet Google Agenda eruit met Material Design
Redactie

Material Design is de nieuwe designfilosofie van Google voor Android. De interface moet natuurlijk aanvoelen en vloeiend ogen, en klaar zijn voor de toekomst.

De filosofie achter het Material Design

Matias Duarte, hoofd design bij Googles Android, wilde met Material Design een designfilosofie voor de toekomst maken. Hoe kunnen we met normaal materiaal  dat we nu kennen ons alvast voorbereiden op de toekomst, zo vroeg hij zich af. En dat is Material Design: door materialen te nemen die we al kennen, zoal een vierkant wit vlak als papier en een cirkel als knop, ontwikkelde Duarte met zijn team een design dat logisch en natuurlijk  wil  ogen, maar ook futuristisch moet aanvoelen.

materialdesign-3

“Ik wilde een interface ontwikkelen die zo simpel en herkenbaar is als papier, maar door aanrakingen van de gebruiker zijn vorm kan veranderen”, aldus Duarte. “Dat was het idee voor Material Design. De materialen die we dagelijks gebruiken opnieuw voor het touchscreen innoveren.” Daarmee behandelt Google de beelden op het touchscreen als ‘echte dingen’, materialen die je kunt aanpassen, weggooien en weer tevoorschijn kunt halen. Net alsof je aan een bureau vol papieren en andere frutsels werkt.

“Het menselijk brein is gemaakt om modellen te herkennen. Dat zorgt ervoor dat we in de wereld kunnen functioneren en nieuwe dingen kunnen leren. We zijn constant bezig om modellen van de wereld te maken en te voorspellen hoe deze modellen eruitzien. Als je een digitale wereld zonder regels hebt, waar alles op een nieuwe manier reageert en er vrijwel geen modellen zijn, is dat enorm stressvol.  En dat wil je niet als je gewoon iets gedaan wilt krijgen, zoals bij Android”, aldus Duarte.

materialdesign-1

Duarte vervolgt: “Je wilt dat dingen op een voorspelbare manier reageren op je scherm. Als je iets op tafel aanraakt, moet het niet opeens naar boven vliegen. Dat geldt ook voor het touchscreen. We willen animaties limiteren om meer diepte te creëren, zoals we die kennen vanuit het normale leven. De animaties moeten net genoeg zijn om aan te geven waar iets vandaan komt en waar het weer heen gaat.”

Wat is kenmerkend voor het Material Design?

Material Design is opgebouwd uit verschillende lagen. Standaard heb je een menubalk aan de bovenzijde die altijd aan de bovenkant is te zien. Als je door een app scrollt, blijft de menubalk veelal zichtbaar aan de bovenzijde. De menubalk biedt veelal de optie om een menu vanuit de zijkant naar binnen te vegen en stroomt zijn kleur door naar de notificatiebalk, die zich automatisch aanpast.

materialdesign-5

Daaronder is het witte vlak met content, dat ook weer uit verschillende vlakken met informatie kan bestaan, te vinden. Bij kleine apps wordt de menubalk bovenop het witte vlak geplaatst, bij apps voor grote schermen is het witte vlak weer voor de menubalk te zien. Het witte vlak doen dan vooral denken aan een stuk papier met informatie.

Ook kenmerkend voor Material Design is de ronde actieknop, die als het ware over de app zweeft. Deze actieknop geeft gebruikers snel de optie om een actie uit te voeren, zoals een e-mail opstellen of contactpersoon aanmaken.

materialdesign-4

Als gebruikers ergens op drukken, toont Material Design de interactieve feedback. Stel: je drukt op een knop. Deze knop kleurt dan even iets donkerder, zodat de gebruiker weet dat er op een knop is gedrukt. Als een venster wordt vergroot, wordt deze vanuit een klein formaat ook daadwerkelijk vergroot in plaats van het venster opeens schermvullend te maken. Het moet logisch en natuurlijk aanvoelen, alsof je een papier open vouwt.

Hoe krijgen apps het Material Design?

Google heeft de materialen voor Material Design met Android Lollipop vrijgegeven voor ontwikkelaars. Het is voor ontwikkelaars mogelijk om deze designfilosofie in hun apps te implementeren. Material Design kan ook beschikbaar worden gemaakt voor oudere Android-versies, alleen werken sommige animaties dan niet.

materialdesign-screens

Als een app nog  niet van Material Design is voorzien, valt dat te wijten aan de ontwikkelaar. Sommige ontwikkelaars houden zich echter niet aan het Material Design. Dit zijn veelal grote partijen die al zo populair zijn dat ze liever hun eigen designfilosofie doorvoeren. Google  legt  geen sancties op aan ontwikkelaars die zich niet houden aan hun designfilosofie, maar vervelend voor de gebruiker is het wel.

Laatste nieuws over Material Design

Hieronder een greep uit het aanbod apps met Material Design dat momenteel in Google Play is te vinden.

Google Now Launcher

Google Now launcher updateDe Google Now Launcher zorgt er voor dat je een indruk krijgt van Android 5.0, zelfs als jouw toestel voorlopig nog niet wordt geüpdatet. Dit betekent nieuwe iconen, animaties en de vernieuwde zoekbalk van Google die standaard boven in beeld staat. Het betreft echter een launcher, dus qua functionaliteit zul je geen drastische verschillen zien. Schakel je over naar het multitaskingvenster of naar de instellingen, dan oogt alles waarschijnlijk nog als `vanouds`.

Download de Google Now Launcher in Google Play (gratis)

Telegram

telegram material designHet Material Design van Telegram wordt gekenmerkt door de blauwe ronde actieknop die aan de rechter onderzijde is te zien. Hiermee kun je een nieuw gesprek starten en een bericht typen. Ook is het nieuwe hamburgermenu aanwezig, waar gebruikers snel nieuwe groepsgesprekken kunnen beginnen en hun Telegram-contacten in kunnen zien. Een andere fraaie verandering is de contactenlijst binnen Telegram, die nu een stuk mooier oogt dan voorheen en belangrijke elementen leent van de standaard contacten-app van Lollipop.

Download Telegram in Google Play (gratis)

Google Maps

googlemapsUiteraard zijn alle Google-apps, waaronder Google Maps, voorzien van Material Design. Bij deze app betekent dat niet alleen een nieuw icoon, maar ook een nieuwe look voor de app. Zo is het hamburgermenu van een visuele update voorzien en zijn de knopjes voor navigeren en gps voortaan rond. De belangrijkste verandering is echter het nieuwe uiterlijk voor het plannen van je reis. Deze kleurt nu blauw, waardoor er een beter verschil is tussen de gekozen navigatie en de verschillende navigatiemogelijkheden en adressen. Dit maakt het plannen van je reis een stuk gemakkelijker dan voorheen.

Download Google Maps in Google Play (gratis)

EQ

eq-icon“De app is geschikt voor al jouw favoriete muziek-apps, van Spotify tot Soundcloud“, aldus de ontwikkelaars. In de app kun je een standaard-equalizer voor verschillende soorten muziek activeren, bijvoorbeeld dance, electro, hiphop en akoestisch. Ook biedt de app een handige bass-boost-optie, waarbij je met een swipe direct de bas harder of zachter kunt zetten. Verder is het mogelijk om eigen equalizers te ontwikkelen en bewaren, die je op een later moment kunt gebruiken. Dus: stop je koptelefoon in je Android, start EQ, druk op jouw favoriete equalizer en geniet.

Download EQ in Google Play (gratis)

Simple Weather

simpleweatherSimple Weather is een mooie weer-app die is voorzien van het Material Design van Android 5.0 Lollipop. Het is niet heel speciaal dat een app van het Material Design wordt voorzien, maar Simple Weather voert het design op een zeer goede manier door. Het combineert de informatieblokken van Google Now met het nieuwe Lollipop-design, dat een overzichtelijke app oplevert. Het hoofdscherm van Simple Weather bestaat uit een gekleurd blok met informatie over het huidige weer, waar de maximum en minimum temperatuur te vinden zijn. Ook toont de app hier de windkracht, en de tijd dat de zon opkomt en weer onder gaat.

Download Simple Weather in Google Play (gratis)

YouTube

youtubeAls je in Google Play hebt ingesteld dat apps automatisch mogen worden bijgewerkt, dan heb je misschien al kennisgemaakt met YouTube 6.0. Deze nieuwe versie van de video-app is op een aantal fronten veranderd en verbeterd. Zo is de balk bovenin de app niet meer wit en grijs, maar volledig rood. Ga je naar specifieke kanalen, dan zie je dat de kleur van de bovenbalk meeverandert. Op desktop heeft kanaal van Android Planet een header die overwegend blauw is en dat zie je ook in de app terug.

Download YouTube in Google Play (gratis)

Falcon Pro 3

falconpro3Falcon Pro was altijd één van de beste Twitter-apps die je in Google Play kon krijgen, totdat het token-limiet van Verges was bereikt. Dit limiet, dat wordt bijgehouden door Twitter, zorgt ervoor dat dergelijke apps niet te veel gebruikers kunnen krijgen. Want Twitter wil liever dat hun eigen app wordt gebruikt. Het token-limiet is echter weer gereset voor Falcon Pro 3, dat als een geheel nieuwe app in Google Play is gelanceerd. De laatste versie is voorzien van Material Design, waarbij de animaties en effecten voor Android Lollipop zijn geoptimaliseerd. Daarbij houdt de app zijn donkere uiterlijk, inclusief een handig uitschuifmenu om je eigen profiel te bekijken. Ook kun je werken met verschillende columns die je zelf kunt indelen.

Download Falcon Pro 3 in Google Play (gratis)

Apex Launcher

apexlauncherApex Launcher heeft onlangs een update gekregen die de app allerlei Android Lollipop-verbeteringen brengt, waaronder het langverwachte Material Design voor zowel de app als de launcher. Versie 3.0 gaat opnieuw de concurrentie aan met Nova Launcher, dat eerder al van een Lollipop-update is voorzien. De launcher is grotendeels gelijk aan de Google Now Launcher, waar wij enorm te spreken over zijn. Apex Launcher brengt echter meer aanpassingsopties naar jouw smartphone of tablet. Installeer je de app nu, dan krijgt je smartphone zonder Android 5.0 al wel de Lollipop-look. Aanrader!

Download Apex Launcher in Google Play (gratis)

De video hieronder geeft een indruk van hoe Material Design eruitziet in beweging.

Geschreven door Redactie | Auteur bij AndroidPlanet.nl

De redactie van AndroidPlanet.nl voorziet je dagelijks van het laatste en beste Android nieuws, handige tips, de leukste apps en koopadviezen. AndroidPlanet.nl is onderdeel van BigSpark, een online uitgever uit…

Nieuws

Material Design nieuws

Apps

Material Design apps

Video's

Material Design video's

Download onze app

Download onze app