In many ways, desktop web design and mobile web design have evolved completely independent of each other, and it’s often been tricky for developers to perfectly replicate the functionality of a desktop site on mobile, and vice versa.
Meanwhile, as the ‘internet of things‘ progresses, and online devices are becoming more and more diverse – it begins to beg question of whether web designers and developers should be designing taking all these things into account. Smart watches, for instance, have been bubbling under the surface in recent years and look set to become essential items when the long awaited Apple Watch arrives on the scene in early 2015. Will we end up needing to design completely different websites, applications and interfaces for them too – sites which simply aren’t compatible with larger devices?
Material design is Google’s attempt to consolidate the features of multiple web design styles and create a new ‘language’ for web and app developers, which is mainly focused on Android, but will work across all devices and control methods – keyboard, mouse, touch, voice and more.
The three main principles of material design are:
1) Material is the metaphor – Material design uses elements of skeuomorphism to focus attention on particular elements and help users navigate sites.
In particular, the design language uses realistic lighting, shadows and manipulation of the z-axis (i.e. the movement of elements towards or away from you) to indicate functionality.
2) Be bold, graphic, intentional – The principles of print design (such as typography, colour and scale) are used to direct the focus of users, and to create visual hierarchy to make navigation easier.
3) Provide meaning with motion – Material design puts a greater emphasis on animation to provide subtle feedback on user actions (eg touchscreen taps) and create clear transitions between elements and between web pages.
Wait, isn’t this just flat design?
It’s true that material design looks like just an extension of current flat design trends – but while flat design is more of a graphic design style designed to prevent users becoming distracted, material design is more of a complete user interface which happens to use elements of flat design.
Notably, flat design takes effort to remove any impression of three-dimensional space, avoiding drop shadows and gradients. Material design, on the other hand, uses three-dimensional lighting as a core part of it’s functionality.
Will we see the rise of material design next year?
Google seems very keen to get this visual language into the hands of developers – but with good reason, it seems.
Matias Duarte (@matiasduarte), VP of Design for Android, revealed how the team chose several famous brands and designed versions of their sites and apps following the new material design guidelines, to see if their new visual language would work for third parties.
The results were successful, and since the release of the guidelines, third parties have taken up the challenge of adjusting their own sites and apps to Google’s new visual language. Some examples of early adopters include music video hosting service Vevo, note-taking app Evernote and social network Tumblr.
Developers have responded warmly to Google releasing the design ‘rules’ as a complete package, helping them to take a more focused and comprehensive approach to developing for Android.
Will 2015 be the year of material design? Only time will tell!