7

Here is what happens when you click on an icon in an "old-style" Google map:

You get an InfoWindow, and clicking "more info" opens a new tab with a google search of the icon's subject.

Here is what happens when you click on an icon in a "new-style" Google map:

You get more information outside the map that you can then interact with.

I understand why the new way is better- you can show more information, it's more mobile-friendly, and it helps de-clutter the map.

My question is: Is there a specific material design guideline that motivated this change from the old InfoWindow style to the new "sidebar" style? I doubt there's something as obvious as "don't use InfoWindows on maps anymore, use this instead", but I'm looking for something a little more official than me just guessing.

Bonus question: What is that sidebar component called?

The reason I'm asking is: At my job we have a product that uses the Google Map api to show various hierarchical information: you click on a dot on the map, that pops up an expanded view of the data on the map, you click in the expanded view and you get an InfoWindow with more details. The clients don't like that display, and I'm thinking that we should get away from on-the-map displays and move towards this new-style sidebar interface. I'm looking for something a little more official than my humble opinion, but nothing in the material design docs really jump out at me.

8

tl;dr: It's a sheet.

The pattern is related to the persistent bottom sheet element on mobile. The MD guidelines actually reference the map example specifically when explaining this approach:

On desktop, content ordinarily presented in a persistent bottom sheet might move onto a new sheet of material. On larger screens it may be more appropriate to display bottom sheet content on a sheet of material positioned on the left side of the interface.

enter image description here

The map implementation has morphed a bit since Android 6 came around (it's attached to the left, top, and bottom), but the basic idea is the same.

As you've keenly observed, Google got away from the old info window approach because it messed up your view of the area of interest.

  • Thanks for the reply. I guess what I'm looking for is a more definitive source on why google switched from InfoWindows to the sheet approach. You and I can both give our reasons why the switch makes sense, but I was really hoping to send something a little more "official" up the food chain. – Kevin Workman Jan 7 '16 at 18:29
  • Isn't 'Google doesn't do that any more' enough for upper mgmt? – plainclothes Jan 7 '16 at 18:43
  • 1
    Hahaha, fair enough. I'll accept your answer, but I know that as soon as I say "google switched away from InfoWindows" the question will be "but why did they switch?" – Kevin Workman Jan 7 '16 at 19:23
  • Because Google knows all! – plainclothes Jan 7 '16 at 19:24
0

This material design pane is Sheet righly said by @plainclothes. If I go more technical, then previously Google was not providing support for this Bottom-Sheet that appear in mobile devices which came from left in Tablet devices.

But now in Feb 2016 Android is providing support for Bottom-Sheet to Developers in his API version 23.2

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.