Material design is probably the most well-known design system in the world. Released in 2014 to create a consistent design standard across mobile and web. 7 years is a long time, right? Things get old. And Material Design was.
In these 7 years, several trends such as Flat Design, Neumorphic design, Glassmorphism, etc etc everything had come and gone. But Material Design stayed the same. It looks like Google knew this too and were secretly working on an upgrade.
Google I/O, Google’s annual conference, was held virtually this year after 2019. 2020 was a miss due to obvious reasons. Google released a host of new things, among which the one that excited the designers and the users most was ‘Material You’. The long-awaited upgrade to Material Design.
Why an upgrade at all?
Matias Duarte, VP of Design at Google, while unveiling ‘Material You’ mentioned that Material Design was maybe too good at maintaining a certain standard and not evolving from it, especially in these modern times. Well, I agree.
We can see that designers had almost exhausted their limits of being creative within the Material Design limits. It was too tightly knit together, which is good in a way.
Designers had a definite visual consistency, design pattern and accessibility standards to stick towards and always fall back on. But good designers were wishing for something that will allow them to flex their creative muscle while still sticking to all good practices. And MD didn't allow them to.
And Users had to stay content with the same design language for many years. And mind you, it's not just Google apps. Several third-party apps were also looking and behaving in the same way as Google Apps. It was boring.
Google realised this, and that was when they released the ‘Material Theming’ feature in 2018. It allowed the developers to customise their applications according to the apps branding and design language.
But what about the personal branding of users?
Here comes Material You!
Material You preserves all the goodness of the existing Material Design version. It remains very simple, airy and has a generous amount of white space. But it's filled with ample personalised customisation options, fluent interactions & animations and best of all, it's all under your control. Google has named every user as being a 'Design Co-Creator'.
It is designed with three main guiding principles in mind
- It should be Personal for each user and each style of usage. It should make the user feel comfortable
- It should be cross-functional across every kind of digital device available in the market
- And Accessible for every need of the user
In this video, Google’s creative lead, Christian Robertson, gives even more insight into the objectives of Material You. In addition to being more personal to each user, Material You should allow the users to be Free-spirited with the UI reacting more in sync with the way physical objects react on interactions. At the same time, not being skeuomorphic. At the same time, being Iconoclastic, challenging some of the familiar assumptions around Digital interfaces.
What’s new in Material You?
Personalised Colour
Move away, Blue! 'You' is here. Well, I’m not sure whether this looks grammatically correct, but you get the idea.
‘Material You’ [also christened as ‘MY’] supports dynamic colour palettes. It generates a dynamic palette based on the most personal thing which every other user customises on their phone - The Wallpaper.
Yes, they pick colours from your wallpaper and they customise the entire Android experience and Google’s apps to match with the colour scheme. And not just Google’s apps, third-party apps can also choose to support this.
And to ensure these colours are accessible and go well with each other, Material You does a complex calculation and only picks the colours which go well together based on their luminosity values. So for example, it won’t pick two shades, both having low luminosity, and make it the background colour and the foreground font colour. The contrast in that will be low and not readable.
This way, Google is going beyond light and dark modes. In their words, they now have a colour mode for every mood. Google certainly has good content writers! But, it still remains to be seen how good this algorithm is to generate accessible colour schemes for any kind of wallpaper which used.
These customised colour themes get synced to your account so that all of your digital devices have the same experience when you’re using them.
Based on the videos, looks like Google is sticking with the Pastels no matter what colour palette you choose. I have nothing against Pastels. Maybe provide us with an option to choose Bold colours as well?
But anyway, I love this and I can’t wait to get my hands on it. I have a One Plus handset and unfortunately my model is not yet supported in the Android 12 Beta list.
Oh Yes, Material You is coming to Android 12. Right now, the developer beta is out and can be installed on select devices. More on Android 12 later in this blog.
Animations
If you’re a generalist designer without Micro interaction skills, then are you even a generalist 😃? After the customised colour theme feature, the all-new Micro-interactions in Material You is probably the next biggest thing. It feels more nuanced with attention given to minute details.
For example, notice the screen shimmering when you connect the charger in the video below?
Just gives the feel of some electricity passing through it, doesn’t it? That’s the entire agenda here. To tell a story with every micro-interaction used.
Another example is when you’re scrolling through the settings and you’re almost at the end but still you try to scroll, the screen stretches to give you the sense of being at the end. The same goes for when you reach the top of the list.
Animations have been also used to provide interactive feedback in a new way. When you begin to swipe any notification item from the notification drawer, it gets more rounded at the edges. When you tap on the numbers in the Lock Screen, the background shape of the numbers fluidly changes from a shape with more border-radius to less.
These fluid shapes are also used in places where the app layout changes on any interaction or while using the app across different device families. But some might also worry about too many shapes. Like there are shapes of every variant of corner radius you can imagine.
Accessibility
Material Design has always been an accessible first design system with strong guidelines on texts, colours, visual hierarchy. What it didn’t provide was that the users couldn’t customise too much of the styles since it may affect the accessibility standards. Maybe the font size could be changed. But that’s just about it.
Material You changes all that. Users will have the option to customise the contrast values, size and even the stroke width of the UI elements while staying within accessible guidelines. So maybe you like all your elements to be thick and blocky. Or maybe you are the person who likes everything to be thin and small. Well, whichever one you are, you can be sure that there is something for everyone.
Apart from this, Material You seems to have further improved its touchpoint accessibility in mobile devices. The interface seems airier and the elements are bigger which might allow the users to tap with confidence. For example, the quick settings in the notification drawer are now this kind of large blocks.
This is kind of a radical and fresh change made by Google. I like it going by the promo videos. It's receiving good reviews from all quarters as well.
Speaking about accessibility, we should appreciate Google for having a sign language translator to translate the entire event into sign language as it was happening.
Other Improvements - Typography, Shadows
Google Sans, an optimised version of Product Sans, is the popular font seen in Google apps till now. In 2020, Google had released their Google Sans Text. It’s still unclear what is the adoption plan of GS Text but Christian has mentioned that they will be using it with variable font technology in Android 12. This will allow the same font to adapt consistently across all sizes and even across all devices
On shadows, if you have used Material Guidelines before, you know that Material has these different levels of elevation. This is used to show the difference between UI elements present above each other. This was heavily dependant on the usage of shadows to show this difference.
But now, Google seems to be coming out of this reliance on shadows and plans to more effectively show this difference using colours. Of course, shadows will still be there for some cases.
Android 12
Now coming to the newest Android kid on the block. Not fully yet but the beta is out. It will be the first version to ship with the Material You design system. If you have a device that is on the eligible list for beta, you can experience the new Material You. Other than the new Material You, some of the most touted features are the reimagined Widgets, personalisation & privacy features.
