Is Material Design Missing it's Heart?

Posted on Dec 11, 2015 in Design
Kaitlin Portrait
Kaitlin Powell
Lead User Experience Designer

I first encountered Material design when I opened up the Google Maps iOS app for biking directions to downtown. I stared blankly at the app for a second or two, then became embarrassed that I was confused. In the spirit of my generation, I just started tapping buttons to see how to work this thing.

I use almost every feature of Google Maps. I use the biking, bus, walking, and occasionally the driving directions. For the first 20 times I used the updated app, I would hit the wrong button to change the transportation type. Once I finally figured that out I realized that when I moved the map, the close icon disappeared. You have to re-center the app, then the close icon reappears.

 
The disappearing close button

Being able to end the action, especially if it's taking over the microphone, should always be available to the user. There's no logical connection between my location being centered in the map, and being able to end the navigation directions. The only reason I can see for making those mutually exclusive is it simplifies the UI, even though it does it by removing an important action. 

This issue pops up in other Google apps as well. In the YouTube app when I want to close a video I have to minimize the video by swiping down, then swipe right to close the video. I manage to forget this every time. The problem is the designers have removed a single close action and replaced it with a two step action that seems to have no logical connection.

 
The minimize and swipe action.

When I step back from the nitty gritty of the apps and look at the Material design documentation I can't fault anything in particular. However, based on my experience of the implementation I find myself doubting the usability of the apps Google has switched over to Material design. The floating action button is one of my favorite pieces. It encourages app developers to give their users just one main action on each screen. However, if you're suppose to focus on a single action, how do you work with complex systems?

Though Material design spends a lot of time thinking and talking about the how of these apps (how to use color, how to animate, how to layout the page), there's a big hole where the "why" should be. Why do things work this way? What are the logical connections here? What's here to inform the user? In these documents, the "why" is lacking. 

As a designer, I can get bored with the tried and true approach. However before I get too excited and re-invent the wheel, I must clearly outline the why. Why do I want to change this? Just for fun? Is there a practical reason for doing this? Is it going to improve the user's interaction with this app?

Google has spent a lot of time explaining the design side, but not so much on the UX side. This results in some nice looking apps that don't work as well as they could. UX has always been part of design, it's just a question of wether the UX is intentional or not. Executing thoughtful UX is what elevates design from the cosmetic to the impactful.

So here's my big thought, Material design is a sophisticated design system that actually makes it harder to create apps with solid user experience. It is a system that makes bold decisions, but that requires a professional to do right.  Since Google Maps got it's Material design make-over, they have released updates that address my transportation switching issue but not the close button. It is definitely doable, but it does take a lot of thinking, testing and time. 

Aiming for the perfect blend of UX and Material design is a challenge I look forward to. The next chance I get, I'll make sure to start with the why and go from there.

Unpacking the (HTML5) Holiday Tree Integrate Craft Forms with OnePageCRM