Branding Meets Material Design
Since Google’s release of their Material Design visual language, much of the mobile design industry has been quickly pivoting towards adopting these guidelines in their own products.
Let me first state that I respect the Material design guidelines. I know first-hand how intensely difficult it is to identify, organize and quantify the elements that make up an interface. It is difficult, meticulous work for a single application, let alone an entire Google of products; and they really nailed it. Material Design is a solid system. It has been well-designed and the decisions are clearly articulated in their guidelines. In a classically Google approach, the look and feel of their interfaces have been quantified and are driven by reason.
So, why am I challenging the adoption of these great standards across the mobile landscape? As a product designer, I’d like to challenge this shift and urge other designers & organizations to do the same. Simply put, I’ve noticed an unfortunate trend wherein organizations are sacrificing their unique branding and voice in exchange for standardization. While the trend may indeed lead to an improved mobile experience overall, I think that blindly adapting to the guidelines set forth by Google without some deep thought is a mistake.
I’ve noticed an unfortunate trend wherein organizations are sacrificing their unique branding and voice in exchange for standardization.
Making Material Design Your Own
Certain mobile apps have adapted Material Design in a fantastically subtle way; picking and choosing which elements or principles to adopt into their existing interfaces. MD really forces a design team to push the limits of layout and simplicity, leaving only what is truly necessary for user understanding. These principles remind one of a mobile-first approach to design, as championed by Luke Wroblewski.
So, what are some ways in which teams are getting creative and merging the MD principles with their existing branding and UI solutions? I’ve compiled a short list below though I’m sure there are many more granular ways. If this list seems very basic, that’s just the point. MD brings folks back to their roots as visual designers. Less has always been more.
As has been the case since the beginnings of design, typography speaks volumes for a brand when other branding elements are restricted. The right typeface can evoke unconscious feelings and brand recognition within the user, carrying the emotional connection across to the constraints that come along with using designing in the mobile space.
The New York Times app is an especially successful example of using typography to stand out in the MD space. It’s bold and frankly, unique typographic qualities borrowed from the beginnings of print design transition well to its mobile presence. Many designers haven’t had the pleasure of obsessing over such minute typographic since the college days. These elements layered on top of the MD layout structures of menus, cards and lists allow a subtle blending of the two design styles.
Another method of differentiation is through the use of distinct iconography. Bringing a brand’s illustrative icon styles into a material inspired interface can help to foster a bold look. Coinbase is very successful in this space, bringing their pattern of thin-lined iconography into their Android interface.
While we all know that dropping in some boilerplate Glyphicons or Font Awesome icons would have saved time and effort, taking this extra step to define their brand helps them to stand out and present a fresh interface.
Lyft is one of many examples of a brand coming through and enhancing MD through color. Lyft’s distinctive Pink brand color is easily recognizable and used as a call-to-action throughout the app, drawing the user’s eye to key actions and value-add elements. While some of the apps layouts may be reused or upcycled directly from Material Design, you either don’t notice or don’t care, as their use of color makes it feel like a highly custom offering.
The Evernote & Dropbox mobile apps are especially successful use cases as they use a combination of all of the above methods as well as subtle animations.
Their use of motion throughout the interface is critical in reinforcing their whimsical branding. Certain elements bounce about while others animate playfully, subtly adding that extra layer of fun and emotional design which can be so difficult to quantify.
When To Conform
Adopting somewhat blindly to the Material Design guidelines can be the right move, in some cases. I believe that these cases include proofs of concept and any type of “just get shit done” tools where functionality trumps form. Additionally, if you’re on a small team, agile team without the resources (read, time) or justification to obsess over these more intricate details, by all means, start with a blank material slate and incrementally improve. Agile teams working in design sprints especially lend themselves to this last exception, wherein entire solutions can be routinely scrapped for any number of reasons.
Material Design is here to stay and will hopefully continue to evolve in the way of extensibility. As a product designer, I urge others to use the Material Design guidelines as just that, guidelines. It’s of utmost importance to focus on your primary user flows and facilitate the successful completion the most common tasks. Seek out and invent those micro interaction opportunities to unexpectedly inject your brand both visually and emotionally into your mobile solutions. A little personality can go a very long way in leaving that positive connection behind in a user’s psyche.
How else are brands differentiating themselves in the mobile design landscape? Did I miss something in this article? Let’s chat below.