Skrevet af den

Et kig på Googles Material design – Første del

“Material design” er et designprincip udviklet af Googles designers. Det bygger på idéen om at forene det trykte produkt med det interaktive digitale medie.

Billedets kilde: Google – Material design

Foreningen af “flat design” og papir

Material Design har et mobile-first udgangspunkt – altså at udarbejde design til mobil og tablet først, for derefter at tilpasse / justere til desktop.

Flat design har længe været en trend i webdesign. Med Material Design forenes flat design og nu også en ekstra dimension gennem “papiret”, hvor man hele tiden kan tilføje nye stykker papir i forskellige former.

Det vil sige, at der ikke længere kun skal arbejdes i to dimensioner, men derimod i tre. Fordi designet altså inkluderer denne ekstra dimension, er det vigtigt, at alle elementer er 3-dimensionelle og inkluderer skygge.

De tre dimensioner kommer ikke til udtryk gennem objekters tykkelse, da tykkelsen altid skal være 1dp (dp = (width in pixels * 160)/dpi). Derimod kommer det til udtryk på den måde, lægger forskellige elementer oven på hinanden: Det vigtigste øverst.

Sammenhængen mellem det trykte og digitale medie

Tankegangen bag trykt design skinner også igennem, hvis man kigger på det grid, der bliver brugt i Material Design.

Det er nemlig meget lig det “baseline”-grid, man mange gange bruger til det trykte. Det grid, som Google har lavet til “Material design”, er udover at være meget lig det trykte også (og måske endnu mere) lig det grid web designere kender fra et responsivt grid.

Udsnit af Material Designs grid

Udsnit af Material Designs grid

Kilde: Google – Material design – Metrics & keylines

Det har været vigtigt for Google, at lave nogle design-guidelines, der ikke begrænser et fleksibelt layout, hvormed man effektivt kan udvikle hjemmesider og apps fleksible og responsive.

Er der forskel på app- og webdesign?

Det er en helt klar tendens, at såvel teknologien bag som designet af apps og websites hele tiden lader sig påvirke af hinanden. Og hvis man udvikler et website eller en webapplikation gennem“Material design” kan man være sikker på at være med på den bølge.

Material design er beregnet til begge dele

Material design er beregnet til både web og app

Kilde: Google – Material design – Progress & activity

Som tidligere nævnt er det altså vigtigt ikke længere at betragte brugsoplevelsen af et website eller en app som “software”, men derimod som noget noget fysisk og 3-dimensionelt.

Elementer og animationer med Material Design

Material design er et omfattende emne og jeg vil i næste blogpost skrive lidt om de elementer og animationer, som Material design lægger op til.