35. Material Design
One of the biggest changes to Android in recent years was the introduction of a new design style:
material design. This new visual language made a big splash when it was released with Android 5.0
(Lollipop), and it came accompanied by a wonderfully exhaustive style guide.
Of course, as developers we are usually only peripherally concerned with questions of design. Our
job is to get it done, no matter what “it” is. However, material design introduces some new interface
concepts in addition to the design sensibilities. If you familiarize yourself with them, you will find it
much easier to implement these new designs.
This final chapter is a little different from previous chapters. You can think of it as an enormous For
The More Curious section. There is no example app to work through, and most of this information is
not required reading.
For designers, material design emphasizes three big ideas:
- Material is the metaphor: The pieces of the app should act like physical, material objects.
- Bold, graphic, and intentional: App designs should jump off the page like they would in a well-
designed magazine or book. - Motion provides meaning: The app should animate in response to actions taken by the user.
The only one of these that our book has nothing to say about is bold, graphic, and intentional. This is
a designer’s responsibility. If you are designing your own app, check out the material design guidelines
(developer.android.com/design/material/index.html) to see what they mean by that.
For the material is the metaphor part, designers need your help to build out the material surfaces. You
will need to know how to position them in three dimensions using z-axis properties, and you will need
to know how to use material widgets such as toolbars, floating action buttons, and snackbars.
Finally, to live up to the directive that motion provides meaning, you can learn a new set of animation
tools: state list animators, animated state list drawables (yes, you read that right – they are different
from state list animators), circular reveals, and shared element transitions. These can be used to add the
visual interest that bold designers crave.