A detailed article about how Google transformed itself from scoffing at design, to embracing it.
Such attention to detail used to be Apple’s thing. Today, that distinction falls to Google. Unveiled last year, Material Design – Google’s evolving design language for phones, tablets, and desktop – offers relentless consistency in interactions; invisible rules that govern everything, so that every app feels familiar; and beauty in the service of function. It’s why so many designers will tell you, as they’ve told me, “I just like Android better.” Whereas iOS is still inching along without improving much, Google is creating a coherent, unified language that easily scales across phones, with enough flexibility to jump to watches and cars. “It’s not even about composing a UI in one place,” says Nicholas Jitkoff, who helped lead the creation of Material Design. “It’s about composing interactions from one device to the next.”
Most of OSNews’ readers will scoff at this article, because they consider “design” to be a dirty word. They’re Pine.
This was Google. And this was Larry Page, a man who, when asked by one designer what Google’s aesthetic was, responded, “Pine.” That is, a command-line email system common during Page’s college years, whose main draw was its speed.
Page’s answer spoke to a philosophy that still dominates in the minds of many engineers: That the best design is no design at all, because speed is the only metric that matters. Adding anything charming to a computer interface simply slowed down. For many years, that made sense. In the dawn of computing, and the dawn of the internet, it didn’t matter of the computer spat out something ugly, so long as it spat out something as soon as you asked. This was a version of the so-called two second rule, formulated in the 1970s: If a computer didn’t respond within that time frame, humans naturally drifted away. For a computer to actually augment your mind, it had to respond almost instantaneously.
As far as design languages go, Material Design is quite minimalist, yet still retains the depth and the kind of information required to easily grasp what things do, where things go, and where things are coming from. It borrows heavily from Metro – as does every modern design – but improves upon it by the heavier use of the Z-axis and subtle animations to understand where things are going and where they’re coming from. The clear colours make it easy to identify what you’re doing and where you are. It’s welcoming, without being overbearing.
Contrast this with the Aero-like iOS 7/8 design, with its are-these-buttons-or-just-labels-or-perhaps-an-input-field, endless use of transparency and blurriness for no particular reason, and just an overall sense of chaos, and the differences couldn’t be more stark. I find iOS overwhelming, unclear, unfocused, messy, inconsistent; every application is different and implements its own rules, buttons, and design. On Android 5.x, thanks to Material Design, I never feel lost. I never have to learn yet another new set of icons or interactions.
Matias Duarte is, quite clearly, the leading voice in UI design right now. Microsoft set the current trend, Google perfected it, and Apple just made stuff flat and blurry with no sense of purpose or direction. Before Material Design, I could’ve easily been swayed towards iOS. Now, though?
No way.
A minor and extremely pedantic correction from an active Alpine* user:
Pine wasn’t a command line program, it was a full window text-user-interface program. Think Norton Commander. In fact I think in some versions of Alpine you can actually make limited use of a mouse (the horror!)
*Alpine is the Open Sourced and up-to-date version of Pine.
Pine (https://www.cs.kent.ac.uk/systems/spamcheck/pine_images/main.gif) was awesome, I really liked it, and used it till about ’00. However, thankfully, I don’t see any resemblance between it and the material stuff
If the basis of comparison is solely the reaction time, then picking Pine as a reference seems very very arbitrary 
I think the point of Larry Page’s quote was that, before the “Material Design” initiative, Google’s philosophy was “simpler is better”, which he illustrated using Pine as an example. The Google main page is a perfect example; it has about the least amount of distraction possible, and was designed with its single, simple purpose as paramount.
That works well with simple, single-purpose interfaces (again, Pine is a good example), but if every developer designs their UI/UX in their own way, it can become confusing for users. That is where “Material Design” comes in.
Having started with the Unix mail command, I’ve always thought of Pine as having a quite complex interface — sort of the Outook of its day. Much easier to teach novies how to use email using Pine, but sometimes bloated over a slow serial connection. Then along came AOL …
BTW, it’s time OSNews got inline posting.
Give us about a month.
What, finally new version of OSNews?!
Hm. Pine isn’t being compared to Material Design at all.
The point is: Google previously didn’t care about design, instead preferring the “Pine” engineering mindset.
Then they changed and came up with Material Design.
I don’t mind a good design as long as it doesn’t get in way of productivity.
A good design is one that boosts productivity and provides minimal distraction (yet maximal discoverability). This does not necessarily equal ‘boring interfaces’ though, something that burns your eyes out creates an aversion for the tool which leads to less happy and productive users. It’s always a balance of course, and it’s different for everyone and per use case, but I think Google’s Material Design has found a pretty nice balance – at least for me.
Do they really? Maybe you’re just giving your readers way too little credit and viewing them as some sort of neanderthals or something? I certainly am not under such impression. Perhaps it’s just cognitive bias on my part, but I remember seeing a lot of people who do view proper design an important part of all software, they just disagree on what sort of design would be classified as “proper” design.
I didn’t mean it in a bad way – OSNews users do tend to be very utilitarian, and many of us have a clear preference towards less flashy designs (just look at how many people prefer classic Windows over whatever came after it).
And that’s a perfectly valid position.
Here’s the nice thing about material, its not “design” as we’ve been sold in the past. Its not just the way things look, but also the way things work.
Even in that story they don’t understand this. They relay the story about the differing google icons and signs. That kind of design *does* *not* *matter*. And that makes people like me pine for Pine (where the focus is on how things react to actions). How things react when to various actions *does matter*. So I appreciate Material in that it unifies the behavior of all the things.
Agreed. In the past, I would always add something like “design and behaviour” to articles like this, but I think we here at OSNews understand quite well that UI design is more than just shiny colours, but also behaviour
.
I think there are a number of us that lived through the “De-DOS-ification” of programs. Many many programs threw out things like keyboard shortcuts and buried useful options deep in menu hierarchies. Then a “For Windows!” sticker was slapped on and sold at a premium. One specific program I’m thinking of allowed a typical customer to do the appointed tasks in 1 hour with DOS. With Windows, that became 3 hours. This is why there are still a large number of Dossy- Pine-ish programs that large retailers use for inventory control and sales. In fact one of my car dealerships I frequent, uses Macs that run Parallels with windows XP in it, that runs telnet that connects to a AS 400. And basically everything is done in that old Mainframe app.
Does the mac version of telenet not work?
Good question. I have no idea why they have their systems set up that way. Maybe there are more apps on the windows side or a VPN connection, or something. All I know is from what I observed peeking at their screen when they walked away.
True, but I scoff at “design” for a different reason. It’s the nonsense modernist bollocks that accompany it. All of it is just a roundabout way for them to say how brilliant they all are.
Yes, many will scoff. That’s because a lot of users, and unfortunately a lot of designers too, think design = shiny graphics.
Yeah, there are certainly a lot of people calling themselves designers who think the purpose of design is to make something look pretty.
Those people aren’t much liked by the real designers who’ve spent years of their lives doing usability studies, building mockups and prototypes to trial their designs on users, etc…
Unfortunately, you’ll find them everywhere: Gnome, Mozilla, even Microsoft.
Pretty sure Google understood design with its search engine interface. It was minimalist before it was cool.
And Gmail compared to all other webmail at the time? It had both looks and interactivity (and 5GB of storage).
Both OSes work well. They attract different people. I like Android’s main screen, which can be configured as minimalistic or as cluttered as you want, in contrast with iOS and its app icons everywhere (that’s why you add and “application menu”, if that’s what it is called in Android). Also, it feels like Android is more intuitive for the user. But I prefer iOS looks in general. If they managed (or decided) to add a real main screen with real widgets, iOS would be perfect, from my perspective.
“Material Design is quite minimalist, yet still retains the depth and the kind of information required to easily grasp what things do, where things go, and where things are coming from.”
It actually doesn’t do any of these things. It might sometimes accidentally do these things but it’s inconsistent and at least one step backward in every way.
Owning a 4.x-era Samsung device is a weird experience.
At one moment, you are on Samsung’s skeuomorphic and iOS-like interface (before the flattening), then you are on Holo, then you are on Material Design.
This is what people mean when they say that “Android apps look like (expletive deleted)”
I hope Google will eventually find a design they like and STICK WITH IT!!! I’m tired of Google Maps looking completely different every time I launch it.
I would just like to point out that Google’s Gmail, Youtube and Maps apps for Android are complete cluster f***s of “desing” over usability.
If you can root your device and change the DPI to something more desktop-oriented, GMail doesn’t look /too/ bad.
That being said, I think BB10, at least since version 10.3, looks the best with how they’ve simplified the interface and embraced “flatness” (haven’t tried WP since 7.x). Can’t wait until the hub is released for Android.
Same on iOS. The rare time I have to use Google Maps on my phone I have to stop to think how it actually works. The main function of navigation is hidden behind a pull up drawer with exactly zero clues that it might be a way to interact with the app. It’s interaction by trial and error. I guess according to Thom that is good design.
There’s a huge-ass icon that’s consistently used throughout Android to indicate a drawer. No different than many (but in true iOS fashion, not all) iOS applications having a back button in the top left.
“Zero indication”, lol.
Did I say the top left app menu? Nope.
When you search for something in google maps it shows the name of the pin at the bottom in a footer. It looks not even remotely like a clickable thing. It looks like plain black text. And yet you have to click it (or drag it up) to get details.
If you want directions to something it’s an unlabeled icon. The details pane I can drag down again to get rid of. The navigation setup pane I can’t (have to click back).
Apple maps is easier. The details are in a popup exactly where the location is (next to the pin on the map). It is clearly marked to be actionable, and in the details it says “Directions to here” which anyone can figure out by inspection.
Of course Google Maps isn’t hard to use when you’re used to it. But I’ve worked with dozens of people learning to use mobile technology for the first time and this kind of learning curve is a big challenge for them. You need to know the secrets of the UI before you can use it.
Edited 2015-06-11 14:47 UTC
I generally quite like the look of Material Design. The one aspect of it that I don’t like are the weird floating buttons that I tend to see. The easiest example is under ‘Calendar’: To add an event, you click the floating red plus circle… I just don’t like that sort of placement. I like that it’s easy to use from a reach standpoint, but it’s just… floating there… off to the side… It just rubs me the wrong way.
I also really don’t like unlabelled things — the Cut/Copy/Paste dialogue in Android is the worst offender, but Google’s fixing that for M, so I’m cautiously optimistic.
While “Material Design” is surely an improvement over the previous state of the Android UI, to me it actually looks like a bland rehash of Metro and Google’s previous ‘minimalistic’ web applications UI mixed together.
And most of all, I really can’t agree about Duarte – first he hastily labels Modern UI as “airport lavatory signage” (probably being caught by surprise by it – see http://www.theverge.com/2011/10/18/exclusive-matias-duarte-ice-crea…) and then ends up copying it in his own uninspired “Material” way… I tend to see him more along the lines of an “untalented imposter”.
As for iOS, back in the day I believe that its skeuomorphic looks and hyperdetailed icons contributed to make it one digital luxury item of its own… Once they flattened and surrogated everything, the magic went away (even more so for Mac OS X).
With regards to iOS, I’m from the opposite camp. Before iOS 7, I couldn’t even stand looking at iOS, with it’s beveled/embossed buttons (I called it the Gumby Look), and pseudo surfaces. Some people called it characterful. I called it tacky.
I seem to get along fine with the iOS7 UIX and aesthetic, for the most part. Then again, I did flat before it was a thing. My Openbox theming and conky layouts predate Microsoft’s Metro by years.
Edited 2015-06-11 12:39 UTC
material looks good, but having buttons in every corner of the screen is a degenerative user experience which will not survive the century
and good is also bad at search. they hide the search on the youtube channel page. they don’t let you sort the google store search. they only in 2015 let you search the android settings. they’re just really inept at making search a priority