Uber’s New Map
Content-Driven Design vs. Brand-Driven Design
November 2016
Which map’s text is easier to read?
The left one? Or the right one?
If you’re like me, you probably think the left map is easier to read.
That’s because the map on the left tends to have better contrast. Its background is lighter and its text is darker, making it more legible than the map on the right.
This is a little trick I do whenever I evaluate a new design. The maps above were designed in color—but I’ve since made them grayscale to assess their contrast.
Given how often maps are used outdoors in bright sunlight (especially in cars), it’s crucial that they have good contrast so that they’re easy to read. (Insufficient contrast is one of the top mobile map complaints.)
One of the maps is actually a redesigned version of the other.
Can you guess which one?
If I were seeing these maps for the first time, I would guess that the left map was the redesigned map (because its contrast has been improved).
I mentioned earlier that the two maps are actually color maps that I had turned grayscale.
So let’s revert them to their original look:
Now which map do you think is the redesigned version?
I’d still guess the left map. Even in color, it continues to have better contrast (and therefore better legibility) than the other one.
But the left map also has other improvements. For instance, the place labels are no longer all the same color: restaurants are orange, shops are blue, parks are green. So if I’m looking for, say, a restaurant, I can focus on just the orange labels, ignoring the rest. The color-coding makes the left map easier to scan—and I don’t have to read each label like I do on the other map.
But that’s not all. Notice that there’s also more information on the left map: buildings with businesses inside are colored orange. So even though there’s not enough space on the map to give every business a label, we still know where all the businesses are. It’s super helpful.
So my guess as to which map is the redesigned map would be the left map. It’s easier to read and scan, and it has more information than the other map. And if I had to quickly figure out where I was, it seems like it would be easier on the left map.
And that’s something else, isn’t it?
If I had to characterize the maps, I might say that the right map is muted and subtle, while the left map is obvious and clear:
If a map is a way of communicating, should that communication be muted and subtle? Or obvious and clear?
It may surprise you to learn that the map on the right is actaully Uber’s new map.
It’s a redesigned version of Google Maps that Uber recently started using. The map on the left, meanwhile, is the default version of Google Maps—it’s the map that Lyft currently uses, and it’s the map that Uber used to use:
Here’s how the new map looks in Uber’s app:
The new map is part of a larger design change to Uber’s rider app:
So if Uber is still using Google Maps, what explains the map’s new look? In other words, why has its appearance been so dramatically altered?
It seems that the map was changed was to more closely align it with Uber’s corporate brand. Notice that the map’s colors (the blues, the greens, the teals, and the grays)...
...are very similar—if not identical—to the colors on Uber’s website.
Just look at how similar the colors are between the two:
I don’t think it’s a coincidence. Rather, it appears that the map has been re-styled to match Uber’s corporate colors.
But was this a solution in search of a problem? After all, when was the last time you heard one of Uber’s customers complain that the map colors didn’t match the brand colors?
And compared to Lyft, Uber’s users are being offered a map that’s arguably less informative and harder to read:
If you offer your customers a map, shouldn’t it be the best map you can offer?