Showing posts with label map visualization. Show all posts
Showing posts with label map visualization. Show all posts

Wednesday, December 5, 2012

Walk Score Does It Right

We have come accustom to fast, responsive applications and have very little patience for a slow, sluggish user experience. The longer it takes for a page to respond the greater the chance of losing your end user to the "I give up!" back button.

Performance is one of items that web map developers battle every day. The overall speed, interactivity and how responsive your web map application is can drastically affect the end user experience and overall adoption rate of your application.

The other day I was on the Walk Score® site and started playing with the Travel Time widget. I was blown away by its speed and interactivity of this feature. I have seen some examples of drive time polygon generation on the web where you select a location, enter a minute interval and click on the generate button. 3 to 30 seconds later you have a drive time polygon displayed on the screen. The Walk Score® team said that they could do better, and they did. In fact they hit it out of the park!

I am not sure what they did but I would love to hear your ideas on the technology behind this feature.

What I like
  • The placement of the widget does not obscure the map and is easy to discover
  • Hovering over the widget expands the input and includes only a few options
  • When working with the widget it responds instantly eliminating the need for the dreaded refresh button
  • Walk Score® uses a single color, transparent visualization technique that allows the end user to quickly determine the travel time without detracting from the rest of the experience

One item that bothered me at first was using generalized circles to display the travel time. I would have preferred a more precise polygon as the result. The reason why it bothered me is because I am a GIS guy but this application is not for the GIS guy, it is for a consumer who could care less about GIS and cares more for ease of use and how well the application performs. The generalized circles make the result easy to read and understand and could have been implemented that way to gain ultimate performance.

I give Walk Score® a 10 out of 10 for this functionality. They did everything correct and I can’t wait to see that they do in the future.

If you enjoyed the post, please share it:
Walk Score Does It Right - @SkipCody http://bit.ly/UeGc5q #GEOSPATIAL #GIS



Sunday, November 6, 2011

The City of North Vancouver Web Mapping Done Right!



My last post was about what is wrong with the a lot of consumer city web map applications. Today I was looking through some more examples and I stumbled across the City of North Vancouver CityMAP’s page and boy was surprised to see what they are doing.

The first thing that caught my eye is minimizing the use of the term GIS. I hate it when that term is thrown into the face of a consumer who could really care less about GIS. The city is using the term CityMAP and the consumer will thank you.

The city also decided that one map application was not enough so they split it out in to one general mapping application and a few specific mapping applications. I applaud this decision, adding too much to a single map application clutters the functionality and makes it more difficult to use. I always say “The more you add the less they use and the less you add the more they use”. The specific applications focus on a single use case making the user experience very simple, straight forward and simply makes since.

The general application called CityMAP’s removed the GIS from the consumer and control just about everything from a single input box asking the user what they want to do? this is very Google esk giving the consumer a style that they are already comfortable working with. This style has allowed the city to remove that complex toolbox that so many web applications include. The end user is only presented with tools when they need them. Taking the tools off the main user interface and hiding them until they are needed is a great approach in a consumer user experience. I call this hiding the "GIS" and doing so  makes for a comfortable and easy to navigate user experience.

What I like:
  • There is no layer list for the user to interact with. Layers are controlled by what work flow the consumer is in and not some complex list that needs to be toggled on and off. Layer lists are a thing of the past
  • There is no toolbox – Tools are presented to the consumer depending on what work flow they are in. Adding a toolbox when not needed just adds confusion and clutter to the user experience
  • The base data is presented well using zoom levels to turn on more information as you zoom into the map
  • The interface is clean and uncluttered
  • There is a tutorial presented as a choice to the end user as they come into the map.  
  • The aerial’s and map zoom/pan controls are located and look like that of a Bing or Google map leveraging experience that the consumer has already gained by working with these common map controls.
  • The use of multiple mapping applications for more specific functionally thus removing that functionally from the general consumer map
What I don't like:
  • The use of flash. I feel that there was a lot of work done and I would hate to not see it on a tablet devise
I can see that the city has spent a lot of time on their user experience and it shows. This will pay off with greater page views and less front counter traffic allowing the city to focus on what really counts. The GIS department has done a fantastic job.

I give this user experience a 9 out of 10

Happy Mapping !

If you enjoyed the post, please share it:
The City of North Vancouver Web Mapping Done Right! A Post - @SkipCody http://bit.ly/v7RDk1 #GEOSPATIAL #MAP #GIS



Thursday, October 27, 2011

Map Visualization and the use of a Timeline. A Great Example


Here is a great map that uses quite a few visualization techniques that convey a lot of information in an easy to consume and comfortable interface. The goal of this map is to show earthquakes, their location, their intensity and when they occurred.

First of all lets take a look at the map. The creator is using a familiar google maps interface and use the standard controls as are out of the box. A point to be made here is that millions of people are already familiar with these controls and allows a user to get right in and start working instead of learning a new system of controls. This site decided to use a single color icon to show where earthquakes have occurred which makes it easy for the brain to quickly understand what it is looking at. To display earthquake currency the creators have applied an opacity so that older earthquakes get fainter as the time goes on which is a great visualization technique because any user seeing the different opacity's can immediately infer that it is measuring age. The icons that are being used also are using size to display intensity, again something very easy for the user to quickly understand.


Moving away from the map the author of this site is using a timeline as another way to access the information about the earthquake's. The timeline can be controlled by the user to view past dates extending the use of the map and giving the end user the ability to browse different time periods. Incidents have been grouped  by hour and clicking on an incident interacts with the map by resetting the view and showing a balloon for further information. One other item to note that under the timeline the author uses hash marks and color to mark intensity.

What I like:
  • Common map controls using a industry standard map
  • Multiple visualization techniques to tell the story
  • Symbolization that makes since so that the reader can quickly tell what they are reading. In fact they do such a good job there is no need for a legend
  • No need for a legend that if not necessary will just add noise to the read
  • The use of the timeline to allow the user another means of navigation
  • Single focus, this map is telling a single story that makes if very usable and not a bunch of stuff that can confuse or distract the end user
What can be done better:
  • I would not change this map, I think they have done a brilliant job
What makes this map great is its ease of use. A average consumer can get into this map and quickly become an expert in its use. The story is simple and easy to understand.

I give this map a 9 out of 10

Happy Mapping ...

If you enjoyed the post, please share it:
Map Visualization and the use of a Timeline a Great Example! A Post By - @SkipCody http://bit.ly/scIoo3 #MAP #VISUALIZATON #GIS


Tuesday, October 11, 2011

Map Visualization Fail Series: #2 Using Animated Icons


I came across this map the other day and it demonstrates my Visualization Fail #2, do not use animated icons on your maps. Once I got past the all of the eye candy that was going on I noticed that there were a lot of items that I loved about this map.

Using animated icons on your map makes for a very difficult map to focus on. The animated icons pull the users eye from every other point on the map mudding up the full spatial story. Getting the entire story across to the end user is critical to realize the full potential of what you are trying to convey.

This map uses animated icon that includes dancing flames to show the location of Short sale and Foreclosure listings. While these property characteristics might warrant flaming houses it makes for a real distracting map when trying to separate from other listings. My eye gets pulled across the page every time I pan or adjust my view and makes it difficult for me to understand the spatial story for the rest of the area.

What can be changed to make this map better:
  • Use a color to denote Short sale and Foreclosure. If you want to highlight something that might be a problem use a red or orange color to tell the users brain that this is undesirable.
What I like about this map:
  • This map uses the full screen so that the user is immersed into a full map experience
  • The legend is front and center so that the user can easily reference what is being displayed
  • The filter form is also front and center allowing the user to display exactly what they are looking for
  • There is a note at the bottom left that shows how many properties are not mapped
  • They have a nice featured areas list that allows for easy navigation
  • They are using the standard Bing map controls that leverage the map experience the end user gains from visiting other sites
  • When hovering over a property the end user can view details of the house without having to leave the map
  • I like that the map starts out in aerial view. We are looking at properties here and the map aerial is a power resource to tell that story
What I would like to see in the future:
  • Trend mapping to show real estate stats in the area
Overall I give this map an 8 out of 10 and find it very useful. What do you think?

Map Visualization Fail Series: #1 Using Hash Lines Confuses the Story

Happy Mapping!!

If you enjoyed the post, please share it:
Map Visualization Fail Series: #2 Using Animated Icons! A Post By - @SkipCody http://bit.ly/oaFKd8 #GIS #MAP