0

What is your advice on how to best present the user a list of search results which are location based in a responsive web design manner on a Google/Bing/OpenStreet Map? Since there are some metadata about each search result (name, opening hours, rating) one challenge is now how to interact between the display of the locations on the map (possibly as markers) as well as to display the list of search results in a more tabular way with extra information.

My current approach is to display on a mobile only the map with the markers (and popup with extra information) and for the tablet version split the landscape screen into two columns with 2/3 map display and on the right side 1/3 the text list (scrollable).

Are there any design recommendations or event components you can point me to?

1 Answer 1

1

The list in addition to the markers is really important, in part because markers can often be too close together to pick between the results.

Perhaps, on the mobile version, you can have easy access to the list, in addition to the maps. Google maps on mobile does a great job at this: Note the icon in the search bar to view a list.

maps list option

Upon clicking the list icon, users can see the results list, and click to go directly to that result's details:

results list

The maps is very important for relative location information. The results list is crucial for easily deciding which location to focus on.

Your split view for the tablet sounds like a good approach, but completely losing the list functionality on smaller mobile devices greatly compromises the experience. Also, I'm not sure what you mean by a 'pop up with details', but things to consider when switching from the map to the list are:

  1. Don't lose context of the search (keep the look/feel consistent, even though the type of content is changing)

  2. Easily go back and forth between list an map (one click max)

2
  • Thanks Kassy for your answer, indeed the many useful concepts implemented in Google Maps is amazing (I haven't used it for the last year or so). I also like the swiping through the individual search results in the bottom area on the map and how the marker animates to the new location. Refering back to my question: with popups I meant taping onto a marker and bringing up a new dialog, but I much more like the off-canvas effect on Google Maps bumping up with more details for the location.
    – ngeek
    Nov 25, 2013 at 7:11
  • Ah, okay. I understand your idea of 'popup' now. Yes, a downside to the popup approach is limiting space. Also, keeping the popup in view can be a challenge as well.
    – Kassy Coan
    Nov 25, 2013 at 17:45

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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