I’m no designer, which is perhaps why I like Google’s Material Design system so much.
For the uninitiated:
Material Design is a unified system that combines theory, resources, and tools for crafting digital experiences.
Vague as that definition may be, you will have seen Material Design in action if you have an Android phone, or use web apps like Google Calendar. Essentially, it’s a set of design and UX principles that inform the creation of websites and apps.
Contained within the Material Design guidelines are dictats on colour, typography, writing style, layout and more, as well as a concrete glossary of reusable UI components.
Material apps tend to have the same “feel” as each other, and that’s the intention. OK, it’s partly an exercise in branding by Google, but the other consequence is that, to a certain degree, users intuitively know how to use Material products.
What we’re seeing on the web, and have been seeing over the last decade, is the evolution of “visual languages”, by which I mean shared motifs in design and UX that make the web seem more familiar and easy to use.
One obvious example is the so-called hamburger button, which has become ubiquitous in mobile websites and apps. It’s now universally expected that pressing this button should expand a menu, but we were never explicitly taught that. Rather, it has seeped into our collective consciousness by exposure.
Perhaps accidentally, it was Twitter that paved the way for this kind of thinking when it released the Bootstrap front-end development framework back in 2011. Formed of a set of reusable HTML, CSS and JavaScript components, its initial purpose was to make the creation of consistent UI elements easier, internally at Twitter.
Released as an open source project, Bootstrap’s popularity exploded in the wider developer community, in part due to how easy it was to use. Developers without much design prowess, like myself, could put together a website skeleton in minutes, knowing that its basic design elements were tried and tested. It quickly became the de facto way to build a website.
Bootstrap has not been without its detractors over the years however, with the most common complaint being that the web has become homogenised, full of sites that look too similar in their… Bootstrappiness. I do see the argument, and I do sometimes dislike websites like this.
However, I feel that my dislike for these kinds of websites usually comes firstly from a disappointment with its product or content, rather than from the design. If the content is bad, it’s easy to think the site as a whole is trite.
If the content is good, however, I think it’s easier to trust it if the site as a whole has a familiar design. In the tech world, you still occasionally find highly recommended pieces of software that have amateurish or “old fashioned” websites, and they always cause me to think twice.
Of course, there’s still plenty of scope for bad design within the parameters of frameworks like Material or Bootstrap, and plenty of scope for good design that doesn’t fit these moulds. There are whole classes of website that work better by being more imaginative; think fashion sites or portfolios. For your average site, however, delivering content or providing a service, the adoption of familiar design languages is a good thing for users. As much as we might be nostalgic for the internet of the 90s, the web would be hell if it still looked like that.
Finally, I should clarify that no individual part of the Material Design spec is revolutionary, and Google certainly hasn’t invented “design principles” or the concept of a unified design language. What it is doing, though, is helping to make these ideas accessible.
Where previously, to non-designers, design has felt a little like hand-waving and black magic, it’s now graspable. I can say to Bob “we’re adhering to Material Design on this project”, and I’ve communicated more than I would have been able to before.
The key is in the name. Google is making design more material.