List/Map Interaction and Usability
May 21
This whole geotagging concept has me thinking quite a bit. One of the things that I’ve been concerned about is usability. This is one of the major factors that comes into play when building any sort of website or webapp. If you check out the geotagging concept you’ll notice that making a selection in the list centers the map and shows the appropriate info window. It would be cool to allow users to use their up/down arrow keys to scroll through the list and center the map on the selected tag. I consider this expected behavior when viewing any sort of information in list format. The problem is that this isn’t always the easy thing to achieve.
Frameworks such as Adobe Flex and standard HTML select lists ship with this functionality. When you roll your own (which I’ve done here) then you’re out of luck. You have to come up with some fairly extensive code to accomplish this task. With that being said I’m currently looking into a few different options that will prevent me from reinventing the wheel. I’m not interested in a Flex solution for this app, although Adobe’s UI components do rock. We use them extensively at work. Adobe’s Spry framework looks promising although it’s currently in its infancy. I’ll definitely be keeping an eye on it and many other Ajax components that could do the job.
The benefit of rolling your own code is that you understand it, therefore easier debugging. Not only that, it’s generally pretty lightweight since you’re writing code to perform a certain task and not serve the masses of developers who may use it.
In regards to List/Map interaction I also think it’s expected behavior for a selection on the map to trigger a selection in the list. Once again, with frameworks this is easy because someone else has already solved the problem. Trying to accomplish this through standard HTML, JavaScript, and CSS can get tricky fast. This obviously means I’ll spend some time looking into it
As more and more apps utilize mapping I think this will become a common UI pattern. Users like to be given a context of where they are and provided with some level of feedback. If you access my geotagging concept and select something in the list you’ll see the map recenter. Now select a different marker on the map, nothing happens in the list. The previous selection is highlighted, which is very misleading. I’ll be working to get that fixed soon.
This may seem like common sense, but I see this type of stuff overlooked all the time. Although the solution seems pretty straightforward, it can be a mammoth to code. At any rate, I’ll be digging around for possible solutions and will continue to post my progress.


