Why Do Google Maps’s City Labels Seem So Readable?
41latitude.com
41latitude.com
Huh? Works for me.
Consistent? Perhaps not. Bad design? Hardly, and it's getting better with each release.
Android, on the other hand, trades discoverability for usability. I have heard that some Android users don't even know that they can pull down the notification bar. But once you learn to do that, it's a wonderfully usable system. (Same for long-press. What to do something with a thing you see? Press and hold. Works every time, but not something you would necessarily think to do.)
I think when people say "Android is unusable" they really mean, "Apple's icons are prettier", which is absolutely true. iOS devices look stunning on billboards and on TV. Android devices? Meh. (I blame the tastelessness of the carriers, though. A big fucking robot eyeball as the background? NASCAR and Sprint logos all over the place? Fuck off and die. AOSP is nice looking, though.)
(Want to see the biggest software disaster ever in the history of humanity? The Nook Color with Android. B&N's effort to cripple Android was so half-hearted that they unintentionally created the worst computing device ever made. Examples: you can select text and choose "copy", but they removed "paste" from the long-tap menu on text fields. You can copy, but not paste. They also made their own "buttons" that work like Android's; Back (which is an undiscoverable gesture, not a button), Menu, Home. But sometimes, you also get the normal Android buttons. So you have two menus (that work alike, but have different items), two back buttons (that work differently, sometimes), and so on. WHAT WERE THEY ON WHEN THEY DESIGNED THIS.
I'm going to be honest. I've never been so upset by anything ever. Using one of these things made me want to strangle the life out of everyone involved with the project and then go buy an iPad.
And oh yeah, the fucking screen flickers like a dying fluorescent light. HOW CAN YOU FAIL SO BADLY.
The one good thing is that they do not advertise that they are using Android.
But I digress.)
It gets tiring to click the same message-contact shortcut and sometimes to be taken to the right place and sometimes to the list of users, or trying to attach an image and not be sure if the gallery application will crash or not (and having to manually close it), or after N text messages sent and getting a lovely "Message could not be sent" error not knowing if it's the messaging app misbehaving or my carrier (almost always a force close of the messaging application fixes the issue), or the scrolling in the browser acting up while locking and unlocking the screen miraculously fixes it... There's also the focus on fancy features like navigation while neglecting the basics like the phone part. I had more control / features on the phone side with my ancient Sony Ericsson dumb phone than on my "superphone"
The potential is there though...
(I personally have never seen any of these issues. The main problem I have with Android is the culture of low-quality ad-supported apps, and sadly, that's something a bug report isn't going to fix.)
One of the issues I mentioned is on the first page of bug reports: http://code.google.com/p/android/issues/detail?id=6296&c...
Here's the contact shortcut one: http://code.google.com/p/android/issues/detail?id=10663&...
For the gallery crashing since I don't know exactly what causes it I can't point to a specific bug report, but there are over 100 unsolved issues with the gallery application.
I don't have time to search for the other bug reports, but they're there.
This applies to all technology I've used, ever.
And yes, the stock apps could do with a bit improvement, but you can always install another alternative app from the market. That's what it is for, isn't it?
Chrome gets usability issues right. Things like their tab closing behavior, the almost total lack of dialogues, one click bookmarking, etc. are all really great. But Chrome is not a beautiful app. Its toolbar icons are fairly childish, its tabs just a bit off.
I'd say that trend holds through most of their products.
I guess it's totally subjective and therefore fairly meaningless, but I think Chrome is the most visually appealing of any browser right now. This is partly, I guess, because its primary virtue is minimalism, but the parts that are there are beautiful, I think.
Unstable Docky from PPA (The stable version is basically identical). Docky is pure butter. It is a few features down from AWN but it's MUCH more consistent (had problems with clicks registering in AWN in weird places) and is gorgeous. It really takes advantage of the SVG icons from Faenza.
* ppa:docky-core/ppa
The toolbar at the top is standard gnome-panel with Cardapio replacing the standard GNOME Main Menu. Cardapio is easily my favorite main menu of any OS. I have the ability to change the identifier for it, search the menu, see everything grouped nicely, AND resize the menu itself. Awesome stuff.
* ppa:cardapio-team/unstable
* screenshot of Cardapio: http://i.min.us/i9sRs.png
I'm using Faenza icons:
* http://tiheum.deviantart.com/art/Faenza-Icons-173323228
* ppa:tiheum/equinox
Note, there is a conflict caused by Faenza's author overwriting PNGs in /usr/share/dockmanager which is used by the Docky DEB. I used DPKG and --force-overwrite to get them to install properly. A bit of a pain when there are updates, but really it's only one command and it's well worth it.
(The only other thing I could add is, I use dockbarx when I remote in because it doesn't require compositing where Docky does. When I do that, my setup looks like this: http://i.min.us/iErSa.png)
Edit: See: Suprematism (http://en.wikipedia.org/wiki/Suprematism), De Stijl (though they liked bold colors) (http://en.wikipedia.org/wiki/De_Stijl), arguably Bauhaus (http://en.wikipedia.org/wiki/Bauhaus), "International Style" ( http://en.wikipedia.org/wiki/International_style_(architectu... ), all of which came before the increased business in art of the 40s-60s, which came before "Minimalism" proper in ~1965. And this is primarily in America & Europe - other areas have had their blends as well.
All of which was pretty heavily influenced by the traditional Japanese aesthetic, which has a pretty strong focus on Minimalism-like attributes.
Minimalism as a positive thing isn't just reactionary. It also serves to bring subtle details into focus, and to emphasize the craft (ie, crafter's experience / quality) as a whole rather than individual details.
For instance (in 9.0.597):
* Mouse over a tab, and move your cursor back and forth. The whole tab is highlighted, but there's extra brightness around the cursor.
* Similarly, look carefully at the buttons on the main bar, or at bookmarks, when mousing over. There's a subtle brightening over a fraction of a second, instead of an instant-on hover effect. Don't believe it? Compare it to mousing over the "+" new tab button, which is instantly highlighted to its full degree.
* Tabs, when re-arranged, slide to their new positions instead of snapping.
* URLs lose http://, and everything after the first "/" is very slightly grayed instead of black.
* Every corner is curved. Every dark edge is under-highlighted, so tabs seem to "float above" the rest of the UI. Those back / reload buttons seem to be recessed black icons instead of buttons - until you mouse over them.
* "Active" chrome elements - active tab, browser + extensions, and bookmarks - have a light -> dark -> light transition through all of them. Inactive tabs are noticeably closer to a solid, darker gray, though they to have a slight gradient. It helps unify the active tab with the applicable chrome seamlessly. You'll also notice Firefox 4 has adopted similar visual cues for tabs.
All of which adds more visual cues to what things do, and easier hierarchical organization at a glance, while maintaining extremely minimal clutter.
There are also a couple things I dislike. Like how utterly massive the bookmarks-in-folders on the bookmarks bar are. Almost twice what other browsers have / via the menu. Glitches in Web Inspector. Excessively-useful hidden preferences. But overall, there's a frightening amount of polish in Chrome.
What would you consider a beautiful app? Chrome is the prettiest piece of desktop software I use, but I don't have a whole lot to compare it to.
That's an important distinction to make. Beautiful is not the same thing as UI. Many many people see something pretty and think that it therefore has great UI.
However UI is more than the colours (though that's important), it's things like discoverability, predicatability, etc.
They're trying (sort of): http://code.google.com/closure/library/
Here's a talk once about their process: http://www.youtube.com/watch?v=697KX4Ciiws#t=02m40s
and a blog post: http://googleblog.blogspot.com/2008/04/what-makes-design-goo...
P.S. Anyone know an easy Maps API trick for setting zoom level to display each of the U.S. states (which vary dramatically in size)?
http://maps.google.com/maps?f=q&source=s_q&hl=en&... (from searching Texas)
Also, apparently Google has an API that lets you extract specific layers, e.g. just the text (he mentions using this in the article). Makes sense in retrospect, but it's cool to know anyway.
Not at all obvious, but it's there.
Can you help me understand why it's wrong?
This is so general that it practically means nothing
A lossy audio compression algorithm relies on quirks of human hearing. Those who designed it used their precise understanding of how human hearing works. How would you go about designing a lossy audio compression algorithm without being allowed to learn anything about human hearing?
I believe it would be very much impossible. Humans have no intuitive understanding of the details of human hearing and there are an huge amount of possible ways of reducing the size of an audio file (like throwing away every second bit). There is no possible way you can A/B test all the possible ways and humans have no intuitive understanding of the details of hearing. You can’t intuitively decrease the search space. Aethstetics don’t help you, an understanding of how humans actually work is necessary.
Not everything is like lossy audio compression but I believe there are parallels. Aethstetics do sometimes help you decrease the search space and A/B tests get you the rest of the way but my suspicion is that a true understanding of how humans actually work would always be preferable.
Text has background, envelope, whitespace (leading, kerning, etc.), font, outline, fill (and probably other general properties too). It's not A/B testing but I could see engineers iterating over variations - should the envelope follow the curves of the text or be a box or blob, etc.. All spacing, be it kerning or border-width can be iterated over, colours too - indeed thinking of this makes me want to write an Inkscape plugin to help in font choice.
You can level your objection again but I don't think one would call thinking what shape an outline could be "design" per se. Indeed if you're just presenting alternatives to a user and looking for the one with the best feedback I think you arguably have done away with a design stage.
And I'm sure if you were a little more clever you could find ways to do a similar test on normal google maps users without them knowing it.
Examples : world projection (Mercator, useless), lack of metadata (dates of the images ?), choice of labels at medium scale (especially with the 'Relief' maps).
Such discrepancy between good graphical precision, esthetics and geographical imprecision, lack of quality information are misleading a large part of the public.
I know I've used it, to find, research and understand the layout of, Actual Locations on Earth, more than once. I never even stopped to think about the projection.
It would be interesting to hear what you feel would be different in the end-user experience if the projection was changed.
De-zoom and look at the apparent continent sizes, it's just horrible. Half of emerged lands in antarctica ? Groenland the size of Africa ? Think about children exposed to those maps before a good atlas is showed to them.
I co-wrote a paper about this topic, but it's in french : http://mappemonde.mgm.fr/num20/internet/int08401.html
A technical choice (summary : it's easier to have perpendicular parallels and meridians) has prevailed upon a geographical choice. It's not very complicated to link the projection to the scale of the view, all serious geographical internet portals are doing so (IGN, Ordnance Survey, etc.)
http://www.41latitude.com/post/557224600/map-comparison http://www.41latitude.com/post/1130407638/map-comparison-2
Better to explain with a picture: http://imgur.com/sy06x
Notice how the google's 'i' is perfect. No grey hinting.
Very good article, and the visual aides helped a lot.
The thick white outlines do a good job of ensuring that the letterforms aren't impeded by other design elements.
The cleared-away areas around cities are a good use of "white space" to increase the hierarchical dominance of major metropolitan areas.
There are some nice detailed observations here. Bookmarked.
Labels on maps, proximity to their data point, shades to represents importance, placing of labels to ensure clarity... all of this has long been solved in the area of automated report generation, and specifically things like bubble charts.
All that I see when I look at a Google Maps is all of the solutions to the problem of producing legible and clear reports applied to a map.
All that I see when I look at Bing and Yahoo mapping are solutions that have only looked at the domain of mapping and haven't considered whether other domains have solved these problems.
I don't see "tricks" by Google, I just see a set of solutions from one area being applied to the same essential problems in another area.
several of the qualities he pointed out were already obvious to me. but while not officially a "designer" i've been creating software/graphical/print interfaces for almost 30 years in one form or another. i do notice tricks with fonts and entity positioning.