tag:blogger.com,1999:blog-78843407959639366802024-03-08T03:04:29.539+00:00Web Map DesignNeo-cartography and Usability for Map DevelopersRich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.comBlogger29125tag:blogger.com,1999:blog-7884340795963936680.post-16319265551045284412012-10-05T10:36:00.000+01:002012-10-05T10:36:03.389+01:00Smart Educational Map ToolI came across <a href="http://gemma.casa.ucl.ac.uk/" target="_blank">Gemma</a> (Geospatial engine for mass mapping applications) by CASA at UCL. Its a smart service well suited to educational use, it has three great functions available in order of priority:<br />
<br />
<ol>
<li><b>Easy to Build Mashups:</b> Enables the user to pull in useful thematic maps (from <a href="http://www.maptube.org/" target="_blank">map tube</a>) or other layers (from OpenStreetMap) and to create markers on top of them. For example, you could map population density, show where tesco stores are and then tag interesting examples where tesco stores don't seem connected with high population.</li>
<li><b>Greyscale Base Map: </b>One of my continual gripes about Google Earth/maps is that it isn't easy to avoid the visually busy satellite data/road base level data. Gemma enables a greyscale map that allows location still to be seen but doesn't crowd out the view enabling the map producer to show more layers with clarity.</li>
<li><b>Easily import in Mobile created data: </b>Its linked to an iPhone app so a student can collect data and easily feed it in. I haven't checked out how this works but the idea is very promising.</li>
</ol>
<div>
The team deserves a big cheer IMHO. I do have some grumbles:</div>
<div>
<a href="http://1.bp.blogspot.com/-KzdNBskJCtk/UGsi7GRspII/AAAAAAAABBg/rpb7bWcfG-E/s1600/GEv4_screen.gif" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><br /></a>
<ul>
<li><b>Pull down options not search</b>: If its possible, I'd like to see the search option for OpenStreetMap replaced with a pull down menu as the default option, with a search available if you really want it. Its a pain to have to guess what will pull up the right data, view the map, then go and delete the layer because it wasn't what you thought it was.</li>
<li><b>Layout: </b>I think the use of space could be more compact. A lot of screen real estate is taken up by the header and the layers appearing at the bottom of the screen will also take up considerable space if you produce a number of them. I found this old screenshot of Google Earth v4 (I think? - see below) which showed that their original design similarly lost screen real estate. In the next version they abandoned the thick bottom panel after user comments. </li>
</ul>
<div style="clear: left; margin-bottom: 1em; margin-right: 1em; text-align: center;">
<a href="http://1.bp.blogspot.com/-KzdNBskJCtk/UGsi7GRspII/AAAAAAAABBg/rpb7bWcfG-E/s1600/GEv4_screen.gif" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="250" src="http://1.bp.blogspot.com/-KzdNBskJCtk/UGsi7GRspII/AAAAAAAABBg/rpb7bWcfG-E/s320/GEv4_screen.gif" width="320" /></a></div>
<br />
<ul>
<li><b>Simple Markers Needed: </b>The markers available are all complex visually with color grades and multiple colors. This is OK for a few markers on a simple map but if you add in lots of markers then the screen will soon get busy visually.</li>
</ul>
<div>
However, overall its a great resource. I notice that the project blog stopped in November almost a year ago, its a shame if there's no follow on funding to take it further and get it out of beta.</div>
</div>
<div>
<br /></div>
<div>
I usually promote Google Earth as the best tool for education, the three big pros of this project are something it would be great to see in GE in the future.</div>
Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-38473512787320612662012-08-17T14:25:00.000+01:002012-09-07T15:21:21.030+01:00Crowdsourced Map Experiment<br />
<div class="p1" style="text-align: left;">
As reader's of this blog know, I am supervising a PhD student, Craig Allison (@theRedSorcerer). He's investigating whether point collation techniques or heat maps can be understood by users or not. (<a href="http://googleearthdesign.blogspot.co.uk/2011/07/3-crime-maps-point-collation.html">previous post about the project</a>)</div>
<div class="p1" style="text-align: left;">
<br /></div>
<div class="p1" style="text-align: center;">
<a href="http://2.bp.blogspot.com/_VSJmtRaPUNE/SgQCS0-UJEI/AAAAAAAAAo4/i3XCoDNt-R4/s400/Untitled-1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: right;"><img border="0" src="http://2.bp.blogspot.com/_VSJmtRaPUNE/SgQCS0-UJEI/AAAAAAAAAo4/i3XCoDNt-R4/s400/Untitled-1.jpg" /></a></div>
<div class="p1" style="text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-pRW3MXfjtAg/TntD9GhE4ZI/AAAAAAAAA5o/G99hMjXivlM/s400/Heat+Map.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="207" src="http://2.bp.blogspot.com/-pRW3MXfjtAg/TntD9GhE4ZI/AAAAAAAAA5o/G99hMjXivlM/s320/Heat+Map.gif" width="320" /></a> </div>
<div class="p1">
<br /></div>
<div class="p1" style="text-align: center;">
<i>examples of point collation and heat maps</i></div>
<div class="p1" style="text-align: center;">
<br /></div>
<div class="p1">
We'd like to see which one is better from a usabilty point of view and we'll publish the results. With this in mind Craig has created a 10 minute test and questionnaire that would help us answer this question, it can be found at</div>
<div class="p2">
<br /></div>
<div class="p3">
<span class="s1"> </span><span class="s1"><a href="https://www.isurvey.soton.ac.uk/condition_start.php?id=145">https://www.isurvey.soton.ac.uk/condition_start.php?id=145</a></span><span class="s2"> </span><br />
</div>
<div class="p3">
<br /></div>
<div class="p3">
Please have a go and pass onto others.</div>
Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-29284776840128388172012-08-08T11:44:00.000+01:002012-08-08T11:44:58.338+01:00GoogleIO Map Design Talk ResponseBelow you'll see a session on map design (called 'master class in map styling') featured at Google IO this year discussing Google Maps.<br />
<br />
<iframe allowfullscreen="allowfullscreen" frameborder="0" height="315" src="http://www.youtube.com/embed/XEoVkt07cSQ" width="560"></iframe><br />
<br />
I think they make some excellent points and explain how to put their ideas into practise code via js code examples in Google maps. In the introductory section they discuss the map design process as being one where you;<br />
<ul><li>Think about what data to remove</li>
<li>Refine the data that's left (e.g. adding selective emphasis)</li>
<li>Test the map for multiple zooms</li>
</ul><div>which I think is very sensible. I've blogged about the value of <a href="http://webmapdesign.blogspot.co.uk/2011/09/goldilocks-maps-enough-info-but-no-more.html">removing data</a> myself.</div><div><br />
</div><div>These are the points they make in the rest of the talk that I particularly liked;</div><div><ul><li><b>Lowest Zoom first</b> design the lowest zoom first then edit other levels afterwards by stripping out data as you zoom out higher.</li>
<li><b>Roads as Landmarks</b> its handy to leave roads in for orientation (at 27:00). </li>
<li><b>Width Editing</b> The ability to edit the width of elements is a new API feature and they show how it can be used effectively at 27:25.</li>
</ul><div>However, I differ with their opinions on a couple of points:</div></div><div><ul><li><b>Ocean = White </b>At 25:54 they change the color of the ocean and harbour water from blue to white saying this has less visual impact. A desaturated blue is better IMHO because it blends into the background better than white and people naturally associate blue with water.</li>
<li><b>Parks = Gray </b>Similarly at 26:01 they change the color of parks from green to gray. Again, people naturally associate green with a park and a desaturated green would fade into the background sufficiently while being easily interpreted IMHO.</li>
</ul><b>Data Density and Keys </b>What I think they could have usefully added to their talk beyond the 3 major points they use above is discussion about coping with data density, i.e. the difference between a map mashup showing a few points and a map with hundreds of points. At 28:46 they show a map mashup with some circles representing who likes cats or dogs at certain locations in San Francisco and at 29:00 they go on to dismiss the idea of using animal icons such as the ones in the image below (showing eagles and wolves from <a href="http://googleearthdesign.blogspot.co.uk/2007/06/good-icon-design.html">this post discussing icons</a>) as being 'cheesy'. <br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://1.bp.blogspot.com/_VSJmtRaPUNE/RoUWHN7tEeI/AAAAAAAAAAs/eNYpiNObc9w/s400/After.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="212" src="http://1.bp.blogspot.com/_VSJmtRaPUNE/RoUWHN7tEeI/AAAAAAAAAAs/eNYpiNObc9w/s320/After.png" width="320" /></a></div><br />
They are quite right that A cat/dog icon could be naff but map icons have an inherent advantage over simple circles: you can <b>work out what they mean without looking at a key</b>. You need extra information to work out that their red circle symbol = number of dog lovers. <br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://2.bp.blogspot.com/-YnqF-0x6tuk/TntREWTNMgI/AAAAAAAAA50/OkUDRRdqd4I/s400/Landscape_GE_screen.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="216" src="http://2.bp.blogspot.com/-YnqF-0x6tuk/TntREWTNMgI/AAAAAAAAA50/OkUDRRdqd4I/s320/Landscape_GE_screen.png" width="320" /></a></div><br />
That's not to say that simple icons like circles shouldn't be used, in fact they're very useful when there are hundreds of data points to plot (see above showing the location of Boris bike stations, <a href="http://webmapdesign.blogspot.co.uk/2011/09/point-clustering-usability-example.html">further detail here</a>), lots of icons on a map leads to the 'flock of sheep' problem (see below, the same Boris bike example)<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://2.bp.blogspot.com/-_KForegXW-o/TnsStNI9vLI/AAAAAAAAA5E/P48Qav6LGIY/s320/Crowded_map.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://2.bp.blogspot.com/-_KForegXW-o/TnsStNI9vLI/AAAAAAAAA5E/P48Qav6LGIY/s320/Crowded_map.gif" /></a></div><br />
So its <b>worth using simplified icons when you need to show many data points</b> even though they need a key to provide interpretation. </div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-17651514848989244462012-07-17T14:22:00.000+01:002012-07-17T14:23:33.891+01:00Animated Maps: The Way Forward?I didn't make it to <a href="https://www.google.co.uk/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&ved=0CEsQFjAA&url=https%3A%2F%2Fdevelopers.google.com%2Fevents%2Fio%2F&ei=ekMFUNlulMHSBd3ZsfcH&usg=AFQjCNHPjlFc4Pie0h7bUDtKxh4m4jMbaA">Google IO</a> this year but have got a lot out of watching the Google maps talk videos. One announcement they made was a new type of map element; <a href="http://googlegeodevelopers.blogspot.co.uk/2012/06/powerful-data-visualization-with.html">'symbols'</a>. These enable developers to animate Google maps more. <a href="http://www.edparsons.com/2012/07/the-future-of-the-map-is-no-map/"> Ed Parsons has bigged up the possibilities</a> and I agree with him that animated maps have great potential and that there should be more use of animated maps. At the moment they are nowhere near as common as simple map mashups. I've been researching map animations recently so today I'll share some thoughts.<br />
<div class="p2">
<br /></div>
<div class="p1">
<b>The potential of animation in Maps: </b> Any graphic or text needs to perform a number of functions:</div>
<div class="p1">
</div>
<ol>
<li>Catch the eye of the user</li>
<li>Lead the eye around the graphic intuitively </li>
<li>Communicate effectively</li>
<li>Produce a memorable and/or emotional response if possible</li>
</ol>
<br />
<div class="p1">
We can argue about how good this list is but I think its generally true (I've paraphrased it from a book on graphic design 'White Space is not your Enemy'). </div>
<div class="p2">
<br /></div>
<div class="p1">
Movement always catches the eye (think blinking cursor) so map animations always do well at [1]. They can also be extremely effective at communicating effectively [3], the gap minder animation below is geographical information although strictly it isn't a map. IMHO its very effective at communicating the story of how most countries have developed considerably in the 20th century and its also easy to pick out individual countries from the animation.</div>
<div class="p1">
<br />
<iframe allowfullscreen="" frameborder="0" height="315" src="http://www.youtube.com/embed/hVimVzgtD6w" width="420"></iframe><br />
<br /></div>
<div class="p1">
I also like this animation of the spread of post offices in the US (although its probably better watched at a higher resolution than I have here)<br />
<br />
<br /></div>
<div class="p2">
<br />
<iframe allowfullscreen="" frameborder="0" height="360" mozallowfullscreen="" src="http://player.vimeo.com/video/27376376?title=0&byline=0&portrait=0" webkitallowfullscreen="" width="480"></iframe><br />
<br /></div>
<div class="p1">
<b>Downsides to Animation in Maps. </b>However, there are a number of problems with animations. </div>
<div class="p2">
<br /></div>
<div class="p1">
<b>- Going, Going, Gone:</b> Unlike a static graphic, the information is only visible for a fixed amount of time so the user has to see the information, make sense of it and remember it before the animation moves on. With a well designed graphic, such as Edward Tufte's diagram showing the development of storm clouds, all the information is available for review and elements are constantly visible.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-LwhMXVmc_OE/UAVf_io8n8I/AAAAAAAABA0/DjUq7PYyYk0/s1600/tufte_storm_cloud.jpeg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="229" src="http://4.bp.blogspot.com/-LwhMXVmc_OE/UAVf_io8n8I/AAAAAAAABA0/DjUq7PYyYk0/s320/tufte_storm_cloud.jpeg" width="320" /></a></div>
<br />
<br />
one of the nice aspects of the post office map above is that it keeps the dots on screen after they've appeared which mitigates this problem somewhat.</div>
<div class="p2">
<b>- Pat Head, Rub Belly: </b>The kids game of trying to pat your head and rub your belly at the same time illustrates another problem known as <i>split attention</i> - we find it difficult to do or follow multiple things happening at once. An example is the map based animation at 55 seconds in this clip showing rainfall and taxi location at once.<br />
<br />
<br /></div>
<div class="p2">
<br />
<iframe allowfullscreen="" frameborder="0" height="360" src="http://www.youtube.com/embed/2aEPkyOBtRo" width="480"></iframe><br />
<br /></div>
<div class="p2">
<br /></div>
<div class="p1">
<b>Solutions: </b> There are a few solutions to these problems:</div>
<div class="p2">
<br /></div>
<div class="p1">
<b>- Simplify Icons/other symbology:</b> Animated maps need to be simplified as much as possible, an easy examples include making icons plain shapes such as rather than a more meaningful bike shaped icon. The background map on which the data is being animated can also be simplified e.g. removing colored roads. The post office map above is a good example of both of these things.</div>
<div class="p1">
<b>- Play Slowly:</b> In complex parts, slow down the speed the animation is playing at. This needs to be done with clear signalling otherwise they could miss that it was happening. </div>
<div class="p1">
<b>- Annotate:</b> If something interesting is happening on a screen full of changing data (the split attention problem) a labelled arrow drawing the user's eye to the correct location on screen can be very helpful.</div>
<div class="p2">
<br /></div>
<div class="p1">
<b>Conclusion:</b> Map animations can be very powerful but they need to be implemented carefully with a user centered focus. See <a href="http://googleearthdesign.blogspot.co.uk/2010/05/google-earth-tours-in-geog-teaching-i.html">this post</a> for more detail and<a href="http://www.geo.uzh.ch/~sara/pubs/harrower_fabs08.pdf"> Mark Harrower's discussion</a></div>
<div class="p2">
<br /></div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-75172676490386521182012-06-26T17:17:00.000+01:002012-06-26T17:20:33.166+01:00Apple Maps and 3DSo since I last posted here there has been a lot of to and fro about 3D in mobile maps. I won't get into discussing the Google vs Apple rivalry as this has been well <a href="http://spatiallyadjusted.com/2012/06/11/will-apple-maps-impact-web-mapping/">discussed elsewhere </a>. What I'm interested in is what is the long term value of 3D on maps. Consider this video<br />
<br />
<object height="235" width="364"><param name="movie" value="http://i.d.com.com/av/video/embed/player.swf" />
<param name="background" value="#333333" />
<param name="allowFullScreen" value="true" />
<param name="allowScriptAccess" value="true" />
<param name="FlashVars" value="playerType=embedded&type=id&value=50126111" />
<embed src="http://www.cnet.com/av/video/embed/player.swf" type="application/x-shockwave-flash" background="#333333" width="364" height="235" allowFullScreen="true" allowScriptAccess="always" FlashVars="playerType=embedded&type=id&value=50126111" /></object><br />
<br />
it shows two 3D features I want to discuss here, 3D full color and 3D grey blocks. I've <a href="http://webmapdesign.blogspot.co.uk/2011/10/3d-buildings-as-landmarks-in-mobile.html">discussed these issues before</a> but its worth revisiting considering the new Apple example. The full color IMHO is just showy, I can't see people pulling up this kind of imagery on their mobile devices whilst on the move, its just too visually complex. I think everyone is going to play with it when they first see it on a device and then revert to something more visually simple when completing navigation tasks. <br />
<br />
The more interesting feature is the 3D gray blocks. Of course these aren't an Apple breakthrough, they've been on Google maps for a while:<br />
<br />
<iframe allowfullscreen="" frameborder="0" height="315" src="http://www.youtube.com/embed/1cN4kBaYYnc" width="560"></iframe><br />
<br />
Gray blocks for buildings (either of the Google or Apple variety) are visually simpler than full colored buildings and so may form an extra layer of information which users can use to navigate with. I think the simple Apple gesture needed to make 3D snap on or off is good, this may make it something users can turn on when they are on the move and think it could help them navigate. <br />
<br />
However, I think the buildings examples used in the demo had distinctive shapes so the grey blocks view looks very effective. The feature may be much less use in a more normal city scape where building shapes are squarer and much more uniform. So for navigating around a city, I'm yet to be convinced 3D gray blocks are a game changer. And of course, out of the city, the feature really loses its value as buildings big enough to act as landmarks are much rarer.<br />
<br />
More interesting is when navigation moves indoors, then shape of rooms and corridors becomes much more important for navigation IMHO.Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-26905912145257502832012-05-24T14:24:00.000+01:002012-05-24T14:24:08.962+01:00GOV.UK and MapsPosts have been thin on the ground recently because I've been busy teaching a new course at the Uni. However, its all over bar the exam marking now so I'm hoping to be more active here.<br />
<br />
A friend has been involved in putting together <a href="http://www.gov.uk/">GOV.UK</a> - a site that provides the public with information from the British Government and acts as a clearing house to councils and other public bodies. I really like the site, one of the key characteristics is that the designers have clearly focussed on user's needs. I've had a quick whizz around looking for ways maps are, or could be, implemented in the site and a few thoughts spring to mind:<br />
<br />
<b>One Map, Many Points: </b> In the neighborhood section of the map you can enter your postcode and find services around you. The site delivers you a list of possible local services, in the example below, we're looking at computer training courses:<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://1.bp.blogspot.com/-g7EeJjkTYD8/T74w5Fi4aRI/AAAAAAAABAU/UBSkAg5wB1M/s1600/gov_uk_screen.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="363" src="http://1.bp.blogspot.com/-g7EeJjkTYD8/T74w5Fi4aRI/AAAAAAAABAU/UBSkAg5wB1M/s400/gov_uk_screen.gif" width="400" /></a></div><div class="separator" style="clear: both; text-align: center;"><br />
</div><div class="separator" style="clear: both; text-align: left;">As you can see, you get an individual map for each location. It would be much better to provide one map with all the suggested services as markers with a linked list to the left of the screen (much as Google Maps and other services already deliver search results) with your entered post code shown as well. This would enable the user to see which service is closer or if its close to their work commute route.</div><div class="separator" style="clear: both; text-align: left;"><br />
</div><div class="separator" style="clear: both; text-align: left;">A nice add on to this would be travel time estimation circles centered on the entered postcode as found on <a href="http://mappinglondon.co.uk/2012/05/15/tfl-why-not-walk-it-maps/">TFL's 'Why not Walk It' maps</a>.</div><div class="separator" style="clear: both; text-align: left;"><br />
</div><div class="separator" style="clear: both; text-align: left;"><b>Map Wiki:</b> I also noticed that the site doesn't link users to useful map wiki or VGI (Volunteered Geographic Information) web sites such as <a href="http://www.fixmystreet.com/">FixMyStreet</a>. This enables the public to easily alert councils in the UK to problems with public spaces such as fly tipping or potholes because they interface with a map which is much easier than filling in a form. I suspect that the remit for gov.uk limits their ability to have done this since they link out to councils sites for this sort of service and councils may or may not have chosen to use a site like FixMyStreet. </div><div class="separator" style="clear: both; text-align: left;"><br />
</div><div class="separator" style="clear: both; text-align: left;"><b>Map as Spine:</b> The way GOV.UK is organized is centered around search and text based categories. There's nothing wrong with this structure, I'm sure its what most people want to use. However, I wonder if a map based structuring would add value as an extra way of organizing the data? Instead of entering the site wondering how to answer a specific question, maybe people would like to mine the information to make broader decisions such as where in London would I like to move to? A series of maps based on each area could be very useful showing people how well an area is serviced by the public sector and data from within the site could be used to populate the map.</div><div class="separator" style="clear: both; text-align: left;"><br />
</div><div class="separator" style="clear: both; text-align: left;"><br />
</div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-48868688571125264472012-04-26T09:47:00.000+01:002012-04-26T09:47:39.137+01:00Color Blindness and Color BlendsI came across these color blends in a post on the web today (to save blushes, I'm not linking) from a mapping developer. Here's what they look like to the majority of us<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-XZd4A5-lG88/T5kIimqRKjI/AAAAAAAAA_s/EcbGQq0X9kQ/s1600/blends_normal_vision.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="293" src="http://3.bp.blogspot.com/-XZd4A5-lG88/T5kIimqRKjI/AAAAAAAAA_s/EcbGQq0X9kQ/s320/blends_normal_vision.png" width="320" /></a></div>
<br />
<br />
and here's how 6% of the male population see it (via the excellent <a href="http://colororacle.org/" target="_blank">color oracle freeware</a>)<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-swHvvat1xwk/T5kIhn_pI3I/AAAAAAAAA_o/5dzwjxXYCK8/s1600/blends_color_blindness_vision.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="299" src="http://4.bp.blogspot.com/-swHvvat1xwk/T5kIhn_pI3I/AAAAAAAAA_o/5dzwjxXYCK8/s320/blends_color_blindness_vision.png" width="320" /></a></div>
<br />
clearly the bottom two blends will be very difficult for color blind users to interpret. <br />
<br />
Color blindness is a lot more complex than I've explained here but generally blends from yellow to blue are much better than reds to greens. More <a href="http://googleearthdesign.blogspot.co.uk/2009/04/color-blindness.html" target="_blank">info on color blindness in maps here</a>.<br />
<br />
If you're interested in the more general uses of color in maps, the <a href="http://www.google.co.uk/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&ved=0CDYQFjAA&url=http%3A%2F%2Fwww.amazon.co.uk%2FInteracting-Geospatial-Technologies-Muki-Haklay%2Fdp%2F0470998245&ei=zwmZT7LTENTS4QT4p-XEBg&usg=AFQjCNGHzjIcXA7j_Ha0eeBKl-MgoWg5hQ" target="_blank">Haklay text book</a> has a good couple of chapters.Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-82245776291886309832012-04-04T10:50:00.000+01:002012-04-04T10:50:15.673+01:00Usability Problems with Zeros on Cluster MapsPlease excuse the lack of post recently, I've been particularly busy with teaching over the last month.<br />
<br />
<b>Some Experimental Results:</b> My PhD student Craig has some results from a usability experiment on the <a href="http://www.police.uk/crime/" target="_blank">UK Crime Maps</a> site. It's too early in the analysis to discuss in detail but one aspect is coming across very clearly: users are getting confused by the representation of postcodes with no crimes on cluster maps (<a href="http://webmapdesign.blogspot.co.uk/2011/09/point-clustering-usability-example.html" target="_blank">explanation of cluster maps</a>). <br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://2.bp.blogspot.com/-M05kKS_5n3c/T3wY96pF0zI/AAAAAAAAA9g/p7CuGIHzZYE/s1600/Zero_problem.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="306" src="http://2.bp.blogspot.com/-M05kKS_5n3c/T3wY96pF0zI/AAAAAAAAA9g/p7CuGIHzZYE/s400/Zero_problem.gif" width="400" /></a></div><br />
<br />
<div class="separator" style="clear: both; text-align: center;"></div><br />
<b>Problem: </b>When you zoom in on an area in the crime map, you are presented with a view as on the left. The number of crimes in the last month is shown for each postcode as a number in a blob, e.g. for the postcode mid left (above Thurleigh Rd) there were 4 crimes. The problem with this visualisation is that the boundaries of the postcodes aren't visible. If you look on the right I've illustrated roughly where two of the postcodes are with dotted red lines. The postcode on the left has 1 crime, the one on the right (Devereux Rd) has none and so hasn't got a blob at all. <br />
<br />
When users were asked to pick out the postcode with the least crime on the actual crime map (left) they failed to understand that no blob = no crime and identified the blob with the lowest number as the postcode with the lowest crime. <br />
<br />
<b>Solution:</b> On collated point maps zero crime postcodes should be represented by blobs with zeros in them. Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-48049902181089542332012-03-01T09:31:00.000+00:002012-03-01T09:31:14.809+00:00Colour in MapsOn my other blog I've previously touched on the use of color in maps:<br />
<br />
<ul><li><a href="http://googleearthdesign.blogspot.com/2009/04/color-blindness.html" target="_blank">Avoiding issues with color blindness</a></li>
<li><a href="http://googleearthdesign.blogspot.com/2009/07/colorbrewer-2-pick-colors-for-your-map.html" target="_blank">Help picking color palettes</a> (principally for thematic maps)</li>
<li>The <a href="http://googleearthdesign.blogspot.com/2010/05/google-map-styles.html" target="_blank">value of subtly colored base maps</a> for map mashups</li>
<li>The importance of <a href="http://googleearthdesign.blogspot.com/search?q=color" target="_blank">choosing 'natural' colors for symbols</a> (water = blue not red)</li>
</ul><div>In researching my currently running course on <a href="http://webmapdesign.blogspot.com/2011/09/my-new-course-in-web-maps.html" target="_blank">communicating with web maps</a> I came across some other best practices, mostly via the chapter on color in <a href="http://www.google.co.uk/url?sa=t&rct=j&q=haklay%20book&source=web&cd=1&ved=0CDcQFjAA&url=http%3A%2F%2Fwww.amazon.com%2FInteracting-Geospatial-Technologies-Muki-Haklay%2Fdp%2F0470998245&ei=xTlPT_CnL-Ku0QW4sY3wCw&usg=AFQjCNHqqv7bj17lfKAIveoYkMjTUxnj0g" target="_blank">Muki Haklay's book</a>.</div><div><br />
</div><div class="separator" style="clear: both; text-align: center;"><a href="http://1.bp.blogspot.com/-wdNP4Js_ZIg/T08_S3H-P2I/AAAAAAAAA8g/TqtlySeo7s4/s1600/OSM_SF.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="185" src="http://1.bp.blogspot.com/-wdNP4Js_ZIg/T08_S3H-P2I/AAAAAAAAA8g/TqtlySeo7s4/s320/OSM_SF.png" width="320" /></a></div><br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://1.bp.blogspot.com/-e6Apk-MlA4E/T08_T5DQwhI/AAAAAAAAA8o/Iwncy1Bv1jM/s1600/OSM_SF_red.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="185" src="http://1.bp.blogspot.com/-e6Apk-MlA4E/T08_T5DQwhI/AAAAAAAAA8o/Iwncy1Bv1jM/s320/OSM_SF_red.png" width="320" /></a></div><div><br />
</div><div><br />
</div><div><b>Background = Blue: </b>We evolved doing things like picking berries from bushes in Africa, its therefore not surprising that the natural background color of that African landscape, the blue of the sky, is one as one that we still naturally associate with background. Note how the red water above comes forward compared to the blue version and swamps out the map detail around it (map courtesy OSM)</div><div><br />
</div><div class="separator" style="clear: both; text-align: center;"><a href="http://4.bp.blogspot.com/-AMBoeNdcB04/T09BeahF0QI/AAAAAAAAA8w/IMzTCSuzmNE/s1600/220px-Hsv_color_circle.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/-AMBoeNdcB04/T09BeahF0QI/AAAAAAAAA8w/IMzTCSuzmNE/s1600/220px-Hsv_color_circle.png" /></a></div><div><br />
</div><div><br />
</div><div><b>Color Wheel Opposites: </b>The color wheel is a representation of 'color space' with hue around the edge. When choosing colors for symbols (such as placemarks) that need to visually stand out from each other, choose colors opposite each other on the color wheel. A well used variation of this is yellow and blue.</div><div><br />
</div><div><br />
</div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-45291036012450332312012-02-16T09:35:00.000+00:002012-02-16T09:35:37.783+00:00Basemaps and Learning CurvesI'm up against the wall in terms of time still so short blog post today on a couple of topics both via James Fee.<br />
<br />
<b>Subtle Basemaps: </b>one of the basic problems with mashups has been putting data over a map designed for route planning. Recently with Google maps API v3 and tools like <a href="http://www.google.co.uk/url?sa=t&rct=j&q=tile+mill&source=web&cd=1&ved=0CDYQFjAA&url=http%3A%2F%2Fmapbox.com%2Ftilemill%2F&ei=K8k8T6fOB4aP0AXPmszbBw&usg=AFQjCNEdeC1YWXlLdvCaMqsRCjQyi5VuOg" target="_blank">tile mill</a> people have started de-emphacizing background maps so that the data stands out better against the background map. I agree with <a href="http://spatiallyadjusted.com/2012/01/19/a-minimalist-openstreetmap-baselayer/" target="_blank">James</a> that the <a href="http://mapbox.com/blog/designing-minimalist-openstreetmap-baselayer/" target="_blank">OSM bright minimal style</a> is a interesting development in this line of work.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://2.bp.blogspot.com/-yN0aTI5vly0/TzzKlJpglBI/AAAAAAAAA8U/VfpoY1ytAkU/s1600/OSM_Bright_Style.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="160" src="http://2.bp.blogspot.com/-yN0aTI5vly0/TzzKlJpglBI/AAAAAAAAA8U/VfpoY1ytAkU/s320/OSM_Bright_Style.jpg" width="320" /></a></div><br />
I'd love to see some user test results to see how people fared working with a mashup based on this base map.<br />
<br />
<b>Learning Curves: </b>Also via <a href="http://spatiallyadjusted.com/2012/02/03/sophia-parafina-open-source-mapping-in-windows/" target="_blank">James</a> I read a <a href="http://sproke.blogspot.com/2012/02/game-changer-open-source-mapping-in.html" target="_blank">great quote about teaching OS mapping software to students</a>. <br />
<blockquote class="tr_bq"><span style="background-color: white; font-family: Verdana, sans-serif; font-size: 13px; line-height: 16px; text-align: left;">"One of the trepidations I have with teaching mapping courses using open source is that it usually requires some modicum of programming which is always way beyond the scope of any beginner class about making maps. In addition, open source tends to favor linux or unix based tool chains that require config/make/make install tap dance before starting anything. This is akin to <b>telling folks that they will need to forge their tools before they can start building a dog house</b>."</span></blockquote>Amen to that (emphasis mine). I'm teaching web cartography at the moment mostly using Google Earth because I want them to learn about color, symbology and chart junk, not some abstract javascript that they will forget a week after the course is over.<br />
<br />
The rest of the post goes on to explain why Sophia thinks TileMill for windows is a game changer.Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-18984276002518160332012-02-08T09:40:00.000+00:002012-02-08T09:40:04.738+00:00Grids are goodExcuse the use of map inserts rather than screenshots, I haven't got much time at the moment.<br />
<br />
Look at an old Ordnance survey map of the uk and you'll see it's covered by a thin, blue lined grid. On recent map systems such as Google Maps and OSM there is no grid. My discussion today argues that we should bring the grids back.<br />
<br />
<b>Grids No Longer Necessary? </b>To locate yourself on an old map such as OS a grid allowed you to use grid references. Web maps produce points at the right place without such a grid so because a grid adds to the visual clutter of a map, we're best rid of them?<br />
<br />
Nope.<br />
<br />
<b>Landmarks and Scale: A </b>grid is helpful because it gives a sense of scale to the map. If you're looking at part of the antarctic<br />
<br />
<iframe frameborder="0" height="350" marginheight="0" marginwidth="0" scrolling="no" src="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Antarctica&aq=0&oq=antarct&sll=51.508129,-0.128005&sspn=0.653028,1.661682&ie=UTF8&hq=&hnear=Antarctica&ll=-82.862752,-135&spn=3.306786,13.293457&t=h&z=7&output=embed" width="425"></iframe><br />
<small><a href="http://maps.google.com/maps?f=q&source=embed&hl=en&geocode=&q=Antarctica&aq=0&oq=antarct&sll=51.508129,-0.128005&sspn=0.653028,1.661682&ie=UTF8&hq=&hnear=Antarctica&ll=-82.862752,-135&spn=3.306786,13.293457&t=h&z=7" style="color: blue; text-align: left;">View Larger Map</a></small><br />
<br />
you have no sense of the size of what you're looking at. Fix a grid of 1km spacing over the top and you can immediately judge distances.<br />
<br />
<b>Point Landmarks</b>. To locate yourself on a map your brain looks for known features and fixes your position in relation to this point. Here in London that means that Londoners often describe an area in relation to underground (=metro) stations because that's how most of us get around. The problem with this is that in tests it's found that people tend to position points that they remember by a landmark too close to the landmark. So if my house was 1 mile away from Clapham South underground station if I was tested I'd tend to draw it closer, say 3/4 of a mile. <br />
<br />
<b>Line Landmarks</b> Another way we locate points is in relation to line features such as a major road or coastline. This has problems too. Consider the question, which is further west of these UK cities: Glasgow or Cardiff?<br />
<br />
<iframe frameborder="0" height="350" marginheight="0" marginwidth="0" scrolling="no" src="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=UK&aq=&sll=51.508129,-0.128005&sspn=0.32651,0.830841&g=London&ie=UTF8&hq=&hnear=United+Kingdom&ll=55.378051,-3.435973&spn=9.794001,26.586914&t=m&z=6&output=embed" width="425"></iframe><br />
<small><a href="http://maps.google.com/maps?f=q&source=embed&hl=en&geocode=&q=UK&aq=&sll=51.508129,-0.128005&sspn=0.32651,0.830841&g=London&ie=UTF8&hq=&hnear=United+Kingdom&ll=55.378051,-3.435973&spn=9.794001,26.586914&t=m&z=6" style="color: blue; text-align: left;">View Larger Map</a></small><br />
<br />
<b> <i>Glasgow is towards top of map in Scotland. Cardiff is due west of London and Bristol, you may have to zoom out or in a little </i></b><br />
<br />
Without looking at a map most Brits think that Cardiff is further west. That's because they have a mental map in which the East coast of the UK runs north south whereas it actually runs NNW-SSE and they warp space to accomodate this misconception. <br />
<br />
<b>Grid Solution</b> Because a grid runs exactly north-south and east-west it gets over the Glasgow-Cardiff problem. Also, it minimises the underground station problem as it represents a continuous set of landmarks rather than discrete points (although this point is worthy of more testing to prove this is the case). So a grid can deliver both a sense of scale and a landmark system which allows people to fix positions on a map and remember their positions correctly. <br />
<br />
<b>When to use Grids:</b> I suspect that its more useful to use a grid in an area without a strong set of landmarks (desert, tundra) rather than somewhere with good landmarks, if you put a grid over US cities with their right angled street systems I imagine users would ignore the map grid because the street system provides such a good system of landmarks already.Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-35445559386576471982012-01-20T09:41:00.000+00:002012-01-20T09:41:02.630+00:00National Rail into Google Maps in the UKIn an earlier post on <a href="http://webmapdesign.blogspot.com/2011/09/london-transport-maps-google-bus-mapper.html" target="_blank">web transit maps in London</a> I noted that when you used the public transport route calculator on Google Maps it didn't include national rail. That wasn't too much of a problem itself (it's obvious they were working on whatever licensing/data issues were holding up getting that data in) but my criticism was that the map didn't make that clear.<br />
<br />
The discussion has now become academic as I learn via Ed Parsons that <a href="http://www.edparsons.com/2012/01/multi-modal-travel-planning-comes-to-google-maps/" target="_blank">national rail trains are now included in their route planner</a>. Good work Google!Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-53656426761003413182012-01-13T12:14:00.000+00:002012-01-13T12:14:27.997+00:00Will Zooming Break the Map?My PhD student Craig has been testing university undergrads on interactive web maps. His results have revealed the fact that:<br />
<br />
<ul><li>Despite being set tasks that require users to zoom in to search effectively, some users don't use the zoom control</li>
<li>One user commented that s/he didn't want to zoom in as s/he might 'break the map' and 'not be able to get back'</li>
</ul><div><b>Digital Natives?</b> What is most interesting about this result is that these are undergrads, supposedly the '<a href="http://en.wikipedia.org/wiki/Digital_native" target="_blank">digital natives</a>' we hear so much about. The fact that some of them can't use basic map controls means we need to think hard about web map design when our audience will include people with generally low IT skills. A static, non-zoomable map may be the solution to go for even if it is less elegant as a solution.</div><div><br />
</div><div><b>Web Browsing Skills:</b> Will this issue continue in the future? There's a useful analogy in the development of user skills in operating web browsers: I remember teaching introductory ICT to mature students in 2000, lack of understanding about browser features such as back buttons and URLs was common at the time. That general lack of understanding has now disappeared because most people use browsers regularly. Use of web maps has been common since around 2005 but their use is (of course) less common than browsers so I wouldn't be surprised if basic skills associated with web maps were taking longer to spread through the population than web browser skills took.</div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-58085723483840666832011-12-22T10:32:00.003+00:002011-12-22T10:39:09.861+00:00Map Tales vs Google Earth ToursReaders who have read my other blog <a href="http://googleearthdesign.blogspot.com/"><span class="s2">Google Earth Design</span></a> will know I promote Google Earth Tours (GETs), the ability to record a virtual trip around Google Earth as a good communication tool for maps. I came across <a href="http://maptal.es/"><span class="s2">Map Tales</span></a>, a web map based service (<a href="http://adactio.com/journal/5040/"><span class="s2">More detail on Map Tales</span></a>) that allows you to create a set of locations linked by a story. I thought I'd compare the two as I think the idea of GETs on a web map is an interesting idea.<br />
<div class="p2"><br />
</div><div class="p2"><div class="separator" style="clear: both; text-align: center;"><a href="http://dl.getdropbox.com/u/504587/09_09_17/holder.html" target="_blank"><img border="0" height="275" src="http://1.bp.blogspot.com/_VSJmtRaPUNE/SrIqDZGjBAI/AAAAAAAAAso/8LMuYw3XuhQ/s400/screen.jpg" width="400" /></a></div><div style="text-align: center;"><i>click to open the tour</i></div></div><div class="p2"><br />
</div><div class="p3"><b>GETs in Detail:</b> Some key characteristics of a GET (and example above): </div><ol class="ol1"><li class="li3">A recording of a virtual flight around Google Earth: camera orientation, location and altitude is recorded throughout and can be replayed. </li>
<li class="li3">Easy to produce simple examples (Click a record button, fly around, click stop recording). </li>
<li class="li3">Layers can be turned on and off </li>
<li class="li3">Pop up balloons with text, images, video clips can be triggered and closed automatically </li>
<li class="li3">To produce them Google Earth is pretty much essential </li>
</ol><div class="p3"><b>GETs advantages over Map Tales</b>: The Map Tales service shares some characteristics of GETs, like them they are easy to control, produce and pop up information can be added easily (see 2 and 4 above). A Map Tale differs slightly in that it has 'steps' - a window of information presented for a unique location and the Tale stops at each step. There are major differences though: </div><ul class="ul1"><li class="li3"><b>No Layer Control: </b>in a Map Tale layers cannot be controlled which stops the author from useful structures such as having two markers from the map tale visible at the same time in an overview. This is very useful in helping users track the spatial relationships between the points. </li>
<li class="li3"><b>No Paths:</b> Not having layers also means paths, routes and roads can't be added.</li>
<li class="li3"><b>More Sophisticated:</b> GETs have a wider range of features including being able to add audio, using streetview, 3D topography and flight speed control.</li>
</ul><div class="p2"><br />
<br />
</div><br />
<iframe height="400" src="http://maptal.es/tales/470?embedded=true" style="border: 0; width: 100%;" width="480"></iframe><br />
<br />
<br />
<div class="p3"><b>Map Tales' </b><b>(see above or <a href="http://maptal.es/tales/470#intro" target="_blank">full size version</a>) </b><b>advantages over GETs :</b> </div><div class="p3">However, Map Tales have advantages because they're simpler:</div><ul class="ul1"><li class="li3"><b>No Software:</b> you don't need to install any software to produce a tale, it's all in the browser. </li>
<li class="li3"><b>Stepped controller</b> is an improvement over the VCR control in GETs. I find when playing a GET I'm often have to stop it at a place. You can do this with GETs (as in the link from the screen shot above) but you need to add pauses by hand editing the KML. </li>
<li class="li3"><b>Editing a Tale:</b> When you've completed your tale you can drag and drop the steps up and down the 'play' list. This kind of simple editing is not possible in a GET.</li>
<li class="li3"><b>Look: </b>The visual look of Map Tales is well designed and distinctive. For simple tales I think this design adds value but for more complex tales I think the lack of control of the site design (e.g. size of info window) would be a problem. To embed it above its size is a problem and it looks cramped.</li>
</ul><div class="p3">Overall I think Map Tales is a useful example of how a simple form of map based GET could look. If you want to produce anything but a simple tour I think GETs are definitely the to go. In addition, the inability to be able to view more than one marker at once or mark a line route is a serious disadvantage. However, the ability to edit tales and the stepper control are interesting features and I think with the ability to control layers it could be a useful tool especially in education.</div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com2tag:blogger.com,1999:blog-7884340795963936680.post-58382813623774192572011-12-14T10:45:00.000+00:002011-12-14T10:45:54.764+00:00oMaps, Google Map edits and Google Map UpdateBack from my break, had a great time in New Zealand and Australia although my brain still isn't quite in gear again. Today I've three topics to discuss:<br />
<br />
<b>Off 3G Mobile Map use: </b>While I was away, my iPhone 4 was invaluable for navigating around. Of course download fees on 3G outside of the UK for me are a daylight robbery so I limited myself to picking up data via WiFi hotspots. There are two techniques I used:<br />
<ul><li><b>Google Maps: </b>Navigate to the place you are going whilst on WiFi, so long as you have cached all the data you need, when you're moving in city the blue locator works and you can navigate around as normal. However, if you only stay on one zoom level whilst on WiFi you can't zoom in when you're on the ground - only the zoom levels you've cached are available. </li>
<li><b>OMaps: </b>The <a href="http://omapsiphone.com/" target="_blank">OMaps App on iPhone</a> works with OSM data and allows you to define an area and cache all the tiles at all levels prior to getting there. Its a bit fiddly, the tiles don't download quickly and you have to get the balance right between getting a big enough map and defining an area that's large with an unreasonable download time. Once you're through these hoops its very useful.</li>
</ul><div><b>Google on the Ball:</b> After my recent critique of Google/Bing/OSM maps with respect to the <a href="http://webmapdesign.blogspot.com/2011/11/google-bing-and-osm-maps-zooming.html" target="_blank">UK Houses of Parliament </a>and <a href="http://webmapdesign.blogspot.com/2011/11/google-bing-and-osm-maps-train-station.html" target="_blank">Clapham Junction</a> train station Google updated their symbolisation (discussed in more detail below) in both areas. I suspect the changes to Clapham Junction were part of <a href="http://google-latlong.blogspot.com/2011/12/updating-maps-of-united-kingdom-germany.html" target="_blank">a broader update</a> but the changes to the symbolisation of the Houses of Parliament look like they are a reaction to my comments and work much better. That sort of reaction is impressive.</div><div><br />
</div><div>I just checked Bing Maps, no change to their map. </div><div><br />
</div><div><b>Google Maps Update:</b> In the <a href="http://google-latlong.blogspot.com/2011/12/updating-maps-of-united-kingdom-germany.html" target="_blank">UK, Sweden, Germany and Finland Google have just added a major update to their map</a>. They point out in the post that map data has improved in terms of </div><div><ul><li>Water bodies </li>
<li>Parks</li>
</ul>After a quick glance at the UK map I also note some other changes I think they've made:</div><br />
<iframe frameborder="0" height="350" marginheight="0" marginwidth="0" scrolling="no" src="http://maps.google.com/?ie=UTF8&hq=&hnear=London,+United+Kingdom&ll=51.463165,-0.171511&spn=0.016296,0.019269&t=m&z=16&vpsrc=6&output=embed" width="425"></iframe><br />
<small><a href="http://maps.google.com/?ie=UTF8&hq=&hnear=London,+United+Kingdom&ll=51.463165,-0.171511&spn=0.016296,0.019269&t=m&z=16&vpsrc=6&source=embed" style="color: blue; text-align: left;">View Larger Map</a></small><br />
<br />
<div><ul><li>More detailed train lines and a change in symbolisation to dashed lines (see above)</li>
</ul><br />
<iframe frameborder="0" height="350" marginheight="0" marginwidth="0" scrolling="no" src="http://maps.google.com/?ie=UTF8&hq=&hnear=London,+United+Kingdom&ll=50.928277,-1.407237&spn=0.032973,0.038538&t=m&z=15&vpsrc=6&output=embed" width="425"></iframe><br />
<small><a href="http://maps.google.com/?ie=UTF8&hq=&hnear=London,+United+Kingdom&ll=50.928277,-1.407237&spn=0.032973,0.038538&t=m&z=15&vpsrc=6&source=embed" style="color: blue; text-align: left;">View Larger Map</a></small><br />
<br />
<br />
<ul><li>Parkland, common land, university campuses, cemeteries are marked by different colored polygons (see above)</li>
</ul><br />
<div>More data on a map obviously adds to its value but if the symbolisation is not well thought out you can get problems with visual clutter. I'll be discussing this update in terms of map usability in a later post.</div></div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-57402434269200408782011-11-16T17:35:00.000+00:002011-11-16T17:35:45.933+00:00Blog BreakI'm downing tools for a while but I'll be back 2nd week in December.Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-62673495228489144182011-11-16T13:55:00.001+00:002011-11-16T17:41:19.340+00:00Google, Bing and OSM Maps: Train Station SymbolizationAs part of my research for last weeks blog <a href="http://webmapdesign.blogspot.com/2011/11/google-bing-and-osm-maps-zooming.html">looking at how the three maps in the title handled symbolization with zooming</a>, I had a look at some other locations in London. The one that stuck out for me in terms of <i>usability</i> was <a href="http://en.wikipedia.org/wiki/Clapham_Junction_railway_station">Clapham Junction Train station</a> at a low altitude zoom level. This is a local station of mine and also happens to be the busiest station in the UK with over 100 trains an hour. With so many passengers it makes sense that it should be mapped well.<br />
<br />
<b>The User's Needs when Zoomed In: </b>What is a general user looking for if they access a web map of this station? If they are zoomed in close then chances are they are searching to answer these questions:<br />
<br />
<ol><li>Where is a station entrance with temporary parking? - I want to drop off someone by car.*</li>
<li>Where is a station entrance handy for me? - I'm getting to the station by bus/bike/foot?* </li>
<li>Where do I find food/drink/toilets/cash machine?</li>
</ol><div>If they are changing trains at Clapham they will probably follow the station signs rather than looking at a web map so 'where is the platform I need?' doesn't get onto the list. </div><div><br />
</div><b>Entrances and Exits are Key:</b> So from a user's point of view I think the primary information that a map of this scale should show are the station entrances and exits. If the user question is [3] then they still want to know about exits/entrances since often services are ouside the station and they will have to get in and out. Using the above list it seems to me that the map could also usefully show temporary parking, bus stops, cycle racks, food outlets, toilets and cash machines. However, the symbols showing these services should be secondary in visual impact to the entrances.<br />
<br />
Let's see how the map providers fare in meeting these user needs:<br />
<br />
<b>Entrance locations: </b>Before we begin the review we need to understand a little about the entrances to the station. On the Open Street Map below I have added the four entrances to the station as red squares. Its also important to know that the Brighton Yard entrance (bottom) is relatively new compared to the others.<br />
<b><br />
</b><br />
<b>Open Street Map of the Station:</b><br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://3.bp.blogspot.com/-jX2oOPjRJjo/TsN_sDUwI7I/AAAAAAAAA70/3QeHyW4ZmGs/s1600/OSM_CLJ.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://3.bp.blogspot.com/-jX2oOPjRJjo/TsN_sDUwI7I/AAAAAAAAA70/3QeHyW4ZmGs/s1600/OSM_CLJ.gif" /></a></div><div class="separator" style="clear: both; text-align: center;"><br />
</div><div class="separator" style="clear: both; text-align: center;"><br />
</div><div class="separator" style="clear: both; text-align: left;">First up, Open Street Map is packed with detailed information. All the entrances are marked except Brighton Yard, however, they are symbolized weakly as dotted red lines and are difficult to pick out. Services are marked on the map at many locations although I note that food outlets on the platforms and the access bridge are missing (I've now added them myself, because that's the point of Open Street Map). There is no opportunity to click symbols and access further information.</div><div class="separator" style="clear: both; text-align: left;"><br />
</div><div class="separator" style="clear: both; text-align: left;">Whilst Open Street Map has done well in terms of having the information available, my problem with this map is that it shows too much. Most of the information is there but by packing all the data onto the map it becomes visually complex and the entrances are not emphasized. A particular problem is the rail tracks: all the lines and sidings are shown but the location of these has no use for the average user as they will be navigating within the station guided by signs within the station. Also, the dashed line symbolisation just doesn't work when the lines are packed together.</div><div class="separator" style="clear: both; text-align: left;"><br />
</div><div class="separator" style="clear: both; text-align: left;">I discussed the 'too much' information problem in a <a href="http://webmapdesign.blogspot.com/2011/09/goldilocks-maps-enough-info-but-no-more.html">previous post.</a></div><b><br />
</b><br />
<b>Google's Map of the Station:</b><br />
<b><br />
</b><br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://2.bp.blogspot.com/-PVjQj886BKE/TsN-zB_wqhI/AAAAAAAAA7k/lDwU-ioWcDY/s1600/Google.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="292" src="http://2.bp.blogspot.com/-PVjQj886BKE/TsN-zB_wqhI/AAAAAAAAA7k/lDwU-ioWcDY/s400/Google.gif" width="400" /></a></div><br />
<a href="http://g.co/maps/3pdxx" target="_blank">Google's map</a> is far clearer when compared to the Open Street Map but important information is missing and the symbolisation is confusing. It shows roads and bus stops clearly but other services aren't well marked. Entrances to the station are missing. The multiple rail lines have been reduced to two which show the general directions of the lines leading out from the station - much better symbolisation. <br />
<br />
My main problem with this map is that rather than use a polygon and a single marker to show the station (<a href="http://webmapdesign.blogspot.com/2011/11/google-bing-and-osm-maps-zooming.html">see last weeks discussion</a>), Google has a confusing group of 3 markers. You would be mistaken for thinking the station was quite small and in three separate locations. In fact it's one large station that covers most of the above map, as you can see from the Open Street Map. Click the rail station symbol and you are not linked to anything to do with the station but see information about the nearest buses. Very odd.<br />
<br />
<br />
<b>Bing Map of the Station:</b><br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://1.bp.blogspot.com/-aFM1CkcD63Y/TsN-yosFP3I/AAAAAAAAA7c/ebRKwtg8wYM/s1600/bing.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="285" src="http://1.bp.blogspot.com/-aFM1CkcD63Y/TsN-yosFP3I/AAAAAAAAA7c/ebRKwtg8wYM/s400/bing.gif" width="400" /></a></div><br />
<br />
<div><a href="http://binged.it/uh1xlt" target="_blank">Bing's map</a> is similar to Google's in terms of clarity: Few train lines are shown, roads are clear and easy to see. Bing also uses a single marker at the main St John's hill entrance which is logical and an improvement on Google's map. When clicked this station symbol links to a route calculator which is more sensible. </div><div><br />
</div><div>However, the other entrances are not marked and no services are marked. At this zoom level I would expect at least some services marked and the lack of entrances is a real issue.</div><div><br />
</div><div><br />
</div><div><b>Conclusion:</b> I've outlined why I think at this scale of map, the key information users need about Clapham Junction station is the location of the entrances. The maps vary in how many entrances they mark but none of them show all of them with the required level of emphasis IMHO.</div><div><br />
</div><div>Looking at other data that could be usefully marked on the map; Open Street Map has the most detail but it is presented in a visually complex way. Bing maps goes to the other extreme with a very clear map but showing little useful information. Google's approach of mixing some service information on a relatively clear map represents the most sensible approach but they have used some very odd symbols in the process.</div><div><br />
</div><div><br />
</div><div>*<span style="font-size: x-small;">Obviously 'entrance' could be replaced by 'exit' in these questions for journeys going in the other direction. For clarity of discussion I just describe outgoing journeys in this post as return journeys are exactly the same from a map point of view.</span></div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-48547376931581566592011-11-08T16:21:00.000+00:002011-11-08T16:21:49.089+00:00Google, Bing and OSM Maps: Zooming Symbolization<span style="background-color: transparent;"><b>How Symbolisation changes with Zooming Out:</b> A couple of weeks ago I <a href="http://webmapdesign.blogspot.com/2011/10/3d-buildings-as-landmarks-in-mobile.html">sang the praises of Google’s 3D building symbolisation</a>. I said putting 3D building models into Google maps with a faded gray coloring could really help people using their maps to navigate around a city. Such models represent <b>symbolisation</b>: the simplification of reality (3D buildings) into simpler symbols that help understanding. This week I look at how the symbolisation of buildings changes as user’s zoom out from a close in view. I'm assuming that the user is doing some sort of navigation task again and I compare</span><br />
<ul><li><span style="background-color: transparent;">Google maps</span></li>
<li><span style="background-color: transparent;">Bing maps</span></li>
<li><span style="background-color: transparent;">OpenStreetMap</span></li>
</ul><b>Change Sucks:</b> The first thing to point out is that evidence from my PhD student Craig’s work on the usability of maps shows that changing symbolisation as users zoom out makes it difficult for users to track what’s going on. So any sybmolisation change, say from a building polygon to a point symbol, has a mental ‘cost’ to it, symbolisation should only change where there is good reason to do so. <br />
<br />
<b>Polygons to Points:</b> So how should building symbolisation change as a user zooms out from an urban landscape? A good best practise is to have buildings represented as polygons at low altitude. As the user zooms out, the polygons become difficult to differentiate visually so it makes sense to change symbolisation to a labelled point. This is exemplified by <a href="http://g.co/maps/7qvmc" target="_blank">Google’s rendering of the White house</a> as in the screen video below. (apologies for the quality and varying sizes of the videos below, I'm experimenting with a new screen capture tool and haven't got it all worked out yet)<br />
<br />
<iframe allowfullscreen="" frameborder="0" height="420" src="http://www.youtube.com/embed/v16X9mY-uGQ" width="560"></iframe><br />
<b><br />
</b><br />
<b>Points to note:</b><br />
<ul><li><span style="background-color: transparent;">The symbolisation starts out as a 3D gray model</span></li>
<li><span style="background-color: transparent;">It switches to a polygon on zooming out</span></li>
<li><span style="background-color: transparent;">At all times the building is represented by a labelled point. As the user zooms out the polygon disappears and we are left with just the labelled point.</span></li>
</ul><span style="background-color: transparent;">Its pretty faultless, every change in symbolisation is helping the user and it's an intuiative system.</span><br />
<br />
<b>Parliament by Google:</b> So how does the white house example compare with the UK seat of government,<a href="http://g.co/maps/s32yn" target="_blank"> the houses of parliament</a>?<br />
<br />
<iframe allowfullscreen="" frameborder="0" height="315" src="http://www.youtube.com/embed/0ubhrJMlwhY" width="560"></iframe><br />
<br />
Oh dear, nowhere near as good. A clear glitch that all labels and symbols disappear at altitude.<br />
<br />
<b>Parliament by Bing: </b> How does that compare to <a href="http://www.bing.com/maps/?v=2&cp=51.49801914341635~-0.1249572165523749&lvl=17&dir=0&sty=c&form=LMLTCC" target="_blank">Parliament by Bing Maps</a>? Bing uses a different approach, instead of having one base map that switches symbolisation as you zoom out they have incorporated an old static style road map as the base level which changes at altitude to what amounts to a completely different map.<br />
<br />
<iframe allowfullscreen="" frameborder="0" height="420" src="http://www.youtube.com/embed/ZQuJipfKdqc" width="560"></iframe><br />
<br />
As you can see, the symbolisation at the lowest level is better than Google's Houses of Parliament but less good (IMHO) than Google's White House. As you zoom out, the symbolisation stays the same which is easy to follow as a user, but the view becomes very cluttered. The switch to a completely different map system is clumsy at best.<br />
<br />
<b>OpenStreetMap:</b> In comparison <a href="http://www.openstreetmap.org/">OpenStreetMap</a> does well at low altitude with good labeling (shown here as an image rathe than a video):<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://1.bp.blogspot.com/-I0R3Tw-_Mds/TrkUFUwcqxI/AAAAAAAAA60/4qsp1-IIBXE/s1600/House_P_OSM.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="350" src="http://1.bp.blogspot.com/-I0R3Tw-_Mds/TrkUFUwcqxI/AAAAAAAAA60/4qsp1-IIBXE/s400/House_P_OSM.gif" width="500" /></a></div><br />
<br />
Their approach is to have labels without points which then disappear at altitude while the <b>polygons persist</b>. I think a labelled point at high altitude is the better system. This alternative technique isn't too bad visually as the polygons are a neutral color and, as we've discussed, keeping symbols the same helps users understand the map. However, if the polygons became paled out at high altitude (<span style="background-color: transparent;">so they blended in with the background) </span><span style="background-color: transparent;">then they would work better IMHO. This is because the road network operates as a landmark system </span><span style="background-color: transparent;">at altitude so needs to become visually dominant over the buildings. </span><br />
<span style="background-color: transparent;"><br />
</span><br />
<b>Conclusion: </b>I wouldn't want to generalize to judging the quality of these three mapping systems on the 'Houses of Parliament' test. As we've seen with Google, the quality can vary from place to place. Its also easy to pick holes with mapping systems in this way, there's an enormous amount of work in producing intelligent symbolisation for multiple zoom levels across the entire globe and the visibility of polygons, labels and points at different zoom levels has to be automated in some way. However, IMHO the symbolization could be improved in all of these three map systems and the building is important: its <span style="background-color: transparent;">the seat of government in a G20 country and a major landmark in a world class city. </span><span style="background-color: transparent;"> </span><span style="background-color: transparent;"> </span>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-39376940642834392522011-11-02T15:30:00.002+00:002011-11-03T12:07:52.153+00:00Streetiview vs Streetside from a users point of viewSo there has been a lot of blog posts on the internets comparing Bing's Streetside with Google's Streetview. Mostly these cover technical and privacy points:<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://4.bp.blogspot.com/-p5zyrFID4Eo/TrFeBOwSfUI/AAAAAAAAA6k/wo00on_3sfA/s1600/Streetview.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="361" src="http://4.bp.blogspot.com/-p5zyrFID4Eo/TrFeBOwSfUI/AAAAAAAAA6k/wo00on_3sfA/s400/Streetview.jpg" width="400" /></a></div><br />
<b>Streetview: </b>Much larger coverage (certainly in the UK), Full 360 degree view<br />
<br />
<br />
<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://3.bp.blogspot.com/-yq4tpqyiFWs/TrFeAoQ-p4I/AAAAAAAAA6c/luRSIG-GYS8/s1600/streetside.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="282" src="http://3.bp.blogspot.com/-yq4tpqyiFWs/TrFeAoQ-p4I/AAAAAAAAA6c/luRSIG-GYS8/s400/streetside.jpg" width="400" /></a></div><div><b>Streetside: </b>Avoided some of the privacy controversy by targetting 'super public' areas such as city centres rather than residential areas. Viewing is more limited to a row view of buildings that slides by.</div><div><br />
</div><div><div>No one has covered the usability issues in detail so I thought I'd make some observations, to do this I need to go off on a bit of a tangent into 3D virtual environments:</div></div><div><br />
</div><div><b>Less Control = Easier to Use: </b>I've just finished a draft of a paper in which I reviewed Google Earth Tours. One thing I discovered in the literature is that in 3D environments (Google Earth, Second Life) the 6 degrees of freedom* that a user needs to control can cause problems of usability:</div><div><ul><li><b>Walls aren't solid:</b> Users can crash through model walls which is disorienting</li>
<li><b>Desert Fog:</b> Users end up very close to a plane surface like the ground, they can't see any features to orient themselves or guess scale - they are said to be experiencing desert fog. </li>
<li><b>Peripheral Vision:</b> Because of the limited computer window into the environment they miss visual clues from their peripheral vision that they pick up in the real world (better in a <a href="http://en.wikipedia.org/wiki/Cave_Automatic_Virtual_Environment">CAVE</a> setup or similar of course) </li>
</ul></div><div>Limiting their degrees of freedom of movement can help users avoid these issues. An example is a tower in Second life - if a user can be 'locked' into moving around it so they can only fly a fixed distance from the tower and their vision is locked directly towards the tower they would avoid some of the problems listed above. Their degrees of freedom have been reduced from 6 down to 2 (they can only fly up/down outside the tower, orbit it left/right) but they can still explore it. Even more radical in a Google Earth tour users only have VCR play/pause/rewind controls effectively reducing their freedoms of movement down to 1. </div><div><br />
</div><div><b>Streetside Constrained Freedom:</b> Streetside has taken the same 'constrained view' approach. They allow a user to only look directly at the side of the road, this is sensible as in a cityscape as this is the most useful view. To switch view to the other side of the street you simply click a little 180 degrees view button which zooms you around. Streetside:</div><div><ul><li><b>Mutiple Controls:</b> Avoids problems of having to operate multiple controls (in Streetview they may expect double clicking to zoom them into a photo view, in fact it moves their position)</li>
<li><b>Look Sideways:</b> Allows users to move along a street whilst looking at buildings. In Streetview <strike>users have to face foreward to move foreward, to look at the buildings on the side of a road they need to stop and turn.</strike></li>
</ul><div><b><span class="Apple-style-span" style="font-size: x-small;">UPDATE 3rd Nov:</span> </b>Actually that's not strictly true. Streetside offers 'slippy slides' of the street going past which is better than Streetview's click-refresh operation. However, you can arrange Streetview so you're looking side on to the street and then click the arrows so you move along. Its quite clever actually. </div><ul><li><b>Fast:</b> Allows users to whisk along a street in a zoomed out view faster than moving through Streetview (in a little informal test I did myself, see the zoomed out view that allows this in the above screenshot )</li>
</ul>However, this comes at a cost. Streetview has the advantages:</div><div><ul><li><b>Less Disorientation:</b> I think its easier to become disorientated by moving down a street only looking at one side. Certainly for testing out a cycle route across a town, Streetview is more natural and would be the better tool.</li>
<li><b>Photo stitching</b> is better in Streetiview, in Streetside I noticed whole streets warped out of view. This may be a technology issue that is solved soon but at the moment it's a real issue.</li>
<li><b>3D Buildings:</b> While looking at Streetview, Google Maps also supplies 3D building models (<a href="http://webmapdesign.blogspot.com/2011/10/3d-buildings-as-landmarks-in-mobile.html">earlier post on this topic</a> see screenshot above) which further helps with orientation. </li>
</ul><b>Conclusion:</b></div><div>I think the Streetside approach is very sensible and may well be better than Streetview in cities. However, outside of urban areas you would need to use Streetview as the side of a road becomes far less interesting. IMHO the best product would offer both these approaches. </div><div><br />
</div><div><br />
</div><div>*<b>Avatar: </b>up/down, forwards/backwards, left/right</div><div> <b>Camera orientation</b>: yaw, pitch, roll</div><div><br />
</div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-85417822166054093632011-10-18T11:27:00.000+01:002011-10-18T11:27:59.643+01:003D buildings as Landmarks in Mobile Maps<div class="p1"><b>Maps and City Navigation:</b> Today I’m going to be looking at ways of including buildings as landmarks for user’s trying to navigate an urban landscape. How important are landmarks for navigation and recall? its relevant that memory champions who can memorize the sequence of a deck of cards in a minute use spatial landmarks as a system to aid their recall: The memory palace technique has the user walking through a building well known to them imagining vivid tableaus such as a moonwalking Einstein (<a href="http://www.nytimes.com/2011/03/13/books/review/book-review-moonwalking-with-einstein-by-joshua-foer.html?pagewanted=all"><span class="s1">the title of an excellent book on memory</span></a>) happening in different rooms. The technique taps into our spatial memory system and shows how powerful landmarks can be. </div><div class="p1"><br />
</div><div class="separator" style="clear: both; text-align: center;"><a href="http://3.bp.blogspot.com/-E3uPM004ehU/Tp08TZmEdkI/AAAAAAAAA6E/CyJp7kHVI3Q/s1600/streetview+landmark.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="http://3.bp.blogspot.com/-E3uPM004ehU/Tp08TZmEdkI/AAAAAAAAA6E/CyJp7kHVI3Q/s320/streetview+landmark.jpg" width="286" /></a></div><br />
<div class="p1"><br />
</div><div class="p1"><b>Google’s 3D buildings as Landmarks:</b> As an example I really like google's 3D buildings in google maps (see above, bottom screen shot). In a city scape the buildings can carry important landmark information for users trying to orient themselves using a map on a mobile device. A 'you are here' marker from GPS readings can make such orientation irrelevant but cities can cause a GPS trouble because of the 'urban canyon' effect so landmarks are still important.</div><div class="p2"><br />
</div><div class="p1">You could choose to put <b>full color</b> 3D buildings onto a mobile device map as landmarks but this has issues that are useful to consider: </div><ol class="ol1"><li class="li1"><b>Device processing time:</b> full color models would slow the device down, the data bandwidth needed is very demanding. </li>
<li class="li1"><b>Visual processing:</b> full color 3D can be complex for the user to process cognitively, for instance the color and structure of the buildings would make it more difficult to see the road pattern below.</li>
<li class="li1"><b>Bird’s eye View: </b>For way finding, the bird’s eye view of a building is often not its most salient feature visually. It is often the view from the pavement (sidewalk for US readers) like the colorful facade of the building or the grand doorway that provides the memorable image a user can latch onto (see top part of image above which relates to the location shown on the map). </li>
</ol>Google’s gray, plain rendering of buildings in 3D is a good solution to the first two issues but fails on the third.<br />
<b><br />
</b><br />
<b>Interesting 2D Alternative:</b> Another way of including buildings in maps so they can be used as landmarks is to use photos. A photo of an interesting building from road level at a node (road junctions or other important route points) mimics streetview functionality but pulls out the best landmark features of the view at that node (see top part of the image above which is taken from the streetview image of the map below). When a user trying to navigate a city reached such a junction and had a choice of routes she could locate herself using the building photo. IMHO this addresses the three problems listed above but unfortunately it introduces another issue: what makes a good visual landmark requires human input whereas Google’s gray building layer can be produced automatically. <br />
<ol class="ol1"></ol><div class="separator" style="clear: both; text-align: center;"><a href="http://2.bp.blogspot.com/-iyMyNzil4kg/Tp08WsZLROI/AAAAAAAAA6M/cApJtJUJZD0/s1600/landmarks+tube+map.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em; text-align: center;"><img border="0" height="206" src="http://2.bp.blogspot.com/-iyMyNzil4kg/Tp08WsZLROI/AAAAAAAAA6M/cApJtJUJZD0/s400/landmarks+tube+map.jpg" width="400" /></a></div><div style="text-align: left;"></div><b><b><br />
</b><br />
Interesting 3D Alternative: </b>A second alternative is to move into sub 3D view as illustrated above. Selected buildings at nodes are shown, they are rendered in gray at an enlarged scale (from a post by <a href="http://www.digitalurban.org/2007/07/iconic-london-3d-tube-map-update.html"><span class="s1">Digital Urban </span></a>)<br />
<br />
If you follow the link to the post you can also see the image placed into a zoomable Google Maps interface but at a 45 degree angle, this has a lot of potential for navigation but it has issues:<br />
<ol class="ol1"></ol><ul class="ul1"><li class="li1"><b>Plan View:</b> A plan view is better for viewing roads</li>
<li class="li1"><b>Single Direction View:</b> You can only see the building from one compass angle direction (North Eastwards in the above image). Often from ground level it’s a street level feature like a large doorway that is most salient to the viewer. Unlike features such as the Gherkin (the torpedo building in the above image) a model of a doorway doesn’t make any sense viewed from the wrong direction. </li>
</ul><div><b>Usability of 3D maps in Navigation: </b>Related to our discussion of 3D in navigation, the comments on <a href="http://googleearthdesign.blogspot.com/2011/06/tale-of-two-maps.html">this post</a> of mine about a 3D map of Southampton University's campus are interesting: they suggest that 3D may be causing usability problems for those who are not familiar with maps .</div><div><br />
</div><b>Conclusion:</b> Google have to provide a base map for any journey that their journey planner may suggest to a user that works on a mobile device. Overall, I think their current solution is arguably the best given the need to produce their maps automatically and addressing the three issues I list above. Where it would be worth trying out the alternatives I've suggested in this post would be a map for a particular route e.g. a map informing people how to get from a particular train station to a museum.<ul class="ul1"></ul>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-913938300779709292011-10-16T22:44:00.000+01:002011-10-16T22:44:35.658+01:00Steve Jobs on DesignI often quote examples from Steve Job's career as examples of good design, and by design I mean usability and a more holistic sense of knowing everything about a product that is important and getting all those things right. So I was pleased to find this quote from him via Stephen Fry:<br />
<br />
“In most people’s vocabularies, design means veneer. It’s interior decorating. It’s the fabric of the curtains and the sofa. But to me, nothing could be further from the meaning of design. Design is the fundamental soul of a man-made creation that ends up expressing itself in successive outer layers of the product or service.” <br />
<br />
Steve Jobs in an Interview with Fortune Magazine, 2000<br />
<div><br />
</div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-85432793259398476002011-10-05T13:28:00.000+01:002011-10-05T13:28:43.060+01:00Usability of GeoData: Sat Nav ExampleIn my review of the <a href="http://webmapdesign.blogspot.com/2011/09/london-transport-maps-google-bus-mapper.html">Google maps public transport route calculator</a> recently the major problem I found was that overland trains, a major and quick form of transport in London, were left out. This is an issue of the usability of data and I recently came across another transport example.<br />
<br />
I happened to drive across central London recently as I had to pick up a bike. If you don't know London that well, this really is a last resort transport solution as our streets are complex and crowded. I was lent an Android HTC phone to navigate with as it had a <a href="http://mobile.jack-frost.co.uk/google_maps_navigation_review_uk.php">Google Maps Navigtion app</a>. Apart from driving in London being terrifying if you're not used to it (as I'm not) the app worked well. Some positive notes:<br />
<br />
<ul><li><b>Voice prompts</b> allowing you to keep your eyes on the road</li>
<li><b>Free</b> rather than over $100 for TomTom on the iPhone. Thanks Google!</li>
<li><b>Dynamic Rerouting </b>when I went wrong, it rerouted me which is very helpful though its been possible on all the sat navs I've used to date.</li>
<li><b>One Way Streets: </b>It had data on which roads were one way and which weren't, a common problem in London. It incorporated this into its journey calculation flawlessly. </li>
</ul>Some things I didn't like:<br />
<br />
<ul><li><b>Voice Prompts on demand: </b>I'd prefer to have voice prompts on demand, there were times when it told me information I didn't need and other times where I was wondering where to go that I wanted to make it give me an update. Maybe it could talk when you touch the screen? This would mean your eyes could remain on the road.</li>
<li><b>Restricted Turns Data:</b> It didn't have a complete data base of the restricted turns in London (it may have none of this information). Its common in my home city that even though a street is not one way you are not allowed to turn right or left at a junction. </li>
</ul><div>The second of these is the more serious. On the way out I encountered the problem and got away with it. However, on the return journey I got lost and into some tiny medieval streets in London city. I totally lost my bearings, the app found me a route but it wanted me to turn left at a junction where it was forbidden. I drove away trying to find my way around the problem but being completely lost, I ended up coming in a big circle and found myself being instructed to turn left at the same restricted junction for the second time. I was tired and confused and I have never sworn so loudly at an inanimate object in my life as that poor HTC phone when I got to that junction for the second time.</div><div><br />
</div><div><b>Conclusion: </b>Its common that usability issues with web maps come from the interface or symbolisation, what I hope I've shown here is that if the data isn't complete, they can come from the data too. </div><div><br />
</div><div><br />
</div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-81239003984582587202011-09-30T16:24:00.001+01:002011-09-30T16:27:38.787+01:00Weasley Clock as Tube Map?This post is about how we can improve on a normal map to show the members of a work team where everyone is in real time.<br />
<br />
<b>Introduction:</b> One of the most fun of the magical items in the Harry Potter world is the <a href="http://en.wikipedia.org/wiki/Magical_objects_in_Harry_Potter#Detectors">Weasley clock </a>.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://2.bp.blogspot.com/-BKbs2crX828/ToXWwk7fvCI/AAAAAAAAA54/qDFb4_GGykk/s1600/clock.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="213" src="http://2.bp.blogspot.com/-BKbs2crX828/ToXWwk7fvCI/AAAAAAAAA54/qDFb4_GGykk/s320/clock.jpg" width="320" /></a></div><br />
It shows the general location of all family members with a hand for each family member (the photo above shows a mock up with not enough hands). Various hackers have had fun building <a href="http://blog.johnmckerrell.com/2009/06/01/hacking-location-into-hardware/">real non-magical versions</a>. <br />
<br />
<b>Whereabouts Clock: </b>Back in 2006 the basic idea was taken by Microsoft and <a href="http://research.microsoft.com/en-us/groups/sds/whereabouts_clock.aspx">developed to an actual device</a> which showed location of workers in their team to each other. It proved popular with the team who liked being able to see where people were at a glance and found it useful to see who was in the building. Key characterstics:<br />
<ul><li>It was an actual physical device and was always on</li>
<li>It used a weasley clock analogy with people's icons moving between 'home', 'in the building' and 'out'</li>
<li>Worked off SMS checkins</li>
<li>Only available for the work group, e.g. could not be shared with family groupings.</li>
</ul><b>Google+ and Latitude:</b> <a href="http://aboutfoursquare.com/did-google-just-sneak-a-foursquare-competitor-under-our-noses/">This post </a>from the 'about Foursquare' blog notes that the Google+ circles idea and Google latitude checkins is a powerful way to share 'where am I' information without running into privacy issues. E.g. it allows me to checkin to a supermarket so that my girlfriend knows I'm doing some shopping whilst not telling my boss because it's during work hours. <br />
<br />
The Whereabouts Clock appears to have never been developed beyond the original concept. Recent developments in Google+, Latitude and mobile devices leads me to think it's a concept that is worth revisiting. In the rest of this post I'll look at the problem purely from the visualisation and usability angles and produce a mock up of the main interface for a smart phone app. There would be a lot of work necessary on the technical side to make my ideas work but having a workable visualisation system is the core problem IMHO.<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://1.bp.blogspot.com/-7t28INKchvU/ToXXJ4J7JjI/AAAAAAAAA58/fEXjFeBjiek/s1600/Personal+Tube+map.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="http://1.bp.blogspot.com/-7t28INKchvU/ToXXJ4J7JjI/AAAAAAAAA58/fEXjFeBjiek/s320/Personal+Tube+map.png" width="267" /></a></div><br />
<br />
<b>Work Journey Tube map: </b>My solution is to suggest a single train or tube line map analogy for displaying the information. I've actually taken the background of the screenshot from a train journey planner app I have on my iPhone. This design comes from the idea that for a work team the key information is knowing where a person is on the usual home to work route*. In the UI sketch above, what were the train stations have been replaced with specific locations (Home desk, Office desk) but also with general areas (on campus, in transit. Strictly 'in transit' isn't an area but it is really: The space I move through to get from home to University Campus). <br />
<br />
<b>Description:</b> Team members are represented by colored blobs, their smart phones are tracking their position and converting that into general information for the visualisation, the arrows represent direction of movement of each team member. Jim is at his desk and his smart phone (or login from desk computer) predicts he is not moving at the moment. Dave is on campus and has just reached the Shackleton building and is coming in. Meanwhile I (Rich) have just got off the bus and am on campus heading to the Shackleton building. Sam is somewhere else than his work route in the UK. <br />
<br />
By clicking 'Rich' the screen displays my estimated time of arrival at various locations (blue text), shows my annotation saying what I am doing (yellow box left) and grays out the stations I've come through<br />
<br />
<b>Key Information and Outward links:</b> The visualisation offers key information on one screen, users would have no interest in where I am in Hampshire on my normal train journey, they just want to know I'm on the train headed to work. However, they are interested in fine grained data such as am I at my desk or elsewhere in the Shackleton building. Other information such as where I am on campus if not in the Shackleton building can be accessed by clicking on the map button bottom left which will link to a <a href="http://www.google.com/mobile/latitude/">standard latitude map visualisation</a>. The calendar icon (bottom) links to the team calendar since the ability to schedule a meeting will often be wanted if a team member is not immediately available.<br />
<br />
<b>But is it a Map? </b>I would argue that it is because it is showing locational information. It just happens to do it in a highly stylised manner. Like the tube map it warps real space as a way to improve clarity in terms of line length, however, it goes one step further as it takes polygons of a large variety of sizes and represents them as one 'station'. On the tube map this would be the equivalent of grouping together a number of stations and representing them as one.<br />
<br />
<b>Provisos:</b> I think the idea will appear in some form or the other in the future but there are a number of conditions that need to be met some of which I discuss below:<br />
<br />
<ul><li><b>Mobile Devices: </b>Obviously the system needs data input from smart devices so the whole team will need them. The data input could be from check ins or from passive tracking. I think there is every reason to expect the vast majority of people to have smart phones in the next few years.</li>
<li><b>Can I track you?: </b>As with many social network technologies, this one requires a critical mass of people to be using it for it to really take off. To start using it people would have to be happy with people tracking them. At the moment I think most people would have reservations but just as 'I don't want to be contactable all the time' was a common moan about mobile (cell) phones when they became common in the 90's I suspect over time people will come to accept broadcasting their location provided they have control over the data. Google+ circles provides just the sort of system.</li>
<li><b>Model</b>: If the system incorrectly predicted my movements you can imagine that users would soon abandon it, the model that predicts my movements needs to be smarter than just calculating that I am travelling towards my work desk therefore I am likely to end up to it as I may just happen to be walking from meeting to meeting and heading in a general deskward direction. The model therefore needs a certain sophistication and it could be a complex problem to solve. It could be mostly solved by tracking people for a month and using a combination of calendars and previous journey data to predict movements.</li>
</ul><div><b>And Finally: </b>One aspect of the Weasley clock was not a location at all, it was 'mortal peril'. I doubt that could be incorporated on my map anytime soon. <br />
<br />
*This assumes that as in my work place, people work from home a lot.</div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-11689159038113654352011-09-23T15:36:00.000+01:002011-09-23T15:36:32.544+01:00My New Course in Web MapsI'm part of a scheme producing a suite of innovative new courses at Southampton University. This is a promotional clip that explains what it's about:<br />
<br />
<script language="javascript" src="https://www.streaming.soton.ac.uk/js/load.php?vidid=32479e9" type="text/javascript">
Video
</script><br />
<br />
Although I gave them a Google Earth tour clip to use and I talk about Google Earth the course covers web maps far more than virtual globes.Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0tag:blogger.com,1999:blog-7884340795963936680.post-14139619179097021972011-09-22T16:20:00.000+01:002011-09-22T16:20:21.310+01:00Point Clustering Usability Example<span style="font-family: Times; font-size: medium;"></span><br />
<div class="p1"><div style="margin: 0px;"></div><div class="p1"><b>Intro:</b> A number of times before (<a href="http://googleearthdesign.blogspot.com/2011/07/3-crime-maps-point-collation.html">1</a>, <a href="http://googleearthdesign.blogspot.com/2011/04/investigation-into-placemark-clustering.html">2)</a> I’ve discussed point clustering maps. I thought it would be useful to present an actual case study of a mobile app* that makes use of clustering to explain why I think the technique has problems from a usability point of view. </div><div class="p2"><br />
</div><div class="p1"><b>Herd of Sheep Problem:</b> Clustering maps have appeared as a solution to an old cartographic problem: If you have too many points on screen they overlap each other producing a map that looks like a herd of sheep has wandered over it (particularly if you use white markers as below).</div><div class="p2"><br />
</div><div class="separator" style="clear: both; text-align: center;"><a href="http://2.bp.blogspot.com/-_KForegXW-o/TnsStNI9vLI/AAAAAAAAA5E/P48Qav6LGIY/s1600/Crowded_map.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="192" src="http://2.bp.blogspot.com/-_KForegXW-o/TnsStNI9vLI/AAAAAAAAA5E/P48Qav6LGIY/s320/Crowded_map.gif" width="320" /></a></div><div class="p4" style="text-align: center;"><i><span class="s1"><a href="https://web.barclayscyclehire.tfl.gov.uk/maps">Barclay's bike hire Stations map</a></span><span class="s2"> in Zoomed out view </span></i></div><div class="p2"><br />
</div><div class="p1"><b>The Technique:</b> The clustering solution involves sorting points into groups, each group then gets a maker (usually a circle) which is labelled with the number of points in the group. This reduces the total number of markers rendered on screen. As the user zooms in on an area big groups break up into smaller groups. At a low altitude the point icons themselves separate out from the groups. </div><div class="p2"><br />
</div><div class="p1"><b>Boris Bike Example:</b> My case study is the <a href="http://londoncycleapp.com/"><span class="s3">London Cycle App</span></a> for the iPhone which shows in real time where <a href="http://www.tfl.gov.uk/roadusers/cycling/14808.aspx"><span class="s3">Boris Bikes</span></a> (aka 'Barclays Bikes') can be hired from. Bikes can be picked up from a large number of docking stations and the app is very useful as bike stations often become empty as a typical day progresses. The app needs to deal with the herd of sheep problem, the screenshot above is actually the bike stations it needs to visualise, it does this using group clustering. We'll discuss the map's symbolization at high and medium zoom levels and compare that to the needs of an imaginary user who's using the app to find a bike to hire for a trip into town.</div><div class="p2" style="text-align: center;"><br />
</div><div class="p1"><b>High Alitude Zoom: </b>At this viewpoint we see two cluster circles which show how many bikes are available for hire in two groups (repeated 3 times below). <br />
<br />
<div class="p1"><br />
<div style="text-align: center;"><a href="http://3.bp.blogspot.com/-s8edyjjjKic/TntD9gNweyI/AAAAAAAAA5s/FNQMACeLFPo/s1600/Polygons.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="145" src="http://3.bp.blogspot.com/-s8edyjjjKic/TntD9gNweyI/AAAAAAAAA5s/FNQMACeLFPo/s400/Polygons.gif" width="400" /></a></div></div><div class="separator" style="clear: both; text-align: center;"></div><div class="p1" style="text-align: center;"><i>High Altitude View with different possible group catchments.</i></div><br />
<br />
The major usability issue here is that the catchment areas that the groups have been created from are not visible. Any of the dotted catchment areas I've added in the three screenshots above are possible. This is an issue for our user for two reasons:</div><div class="p1"><ul><li><b>Where are the bikes?</b> It isn't possible for our user to know precisely where the 230 and 178 bikes are so how can she know where to head to?</li>
<li><b>Density: </b>Knowing the <i>total</i> number of bikes in a group isn't as useful to her as knowing the <i>density</i> of bikes per square km. For example, if the centre map catchments applied she'd be sensible to head for the 230 group SW of Islington but if the right hand map catchments apply the 178 group may well be a better bet as it has less bikes but in a much smaller area.</li>
</ul></div><div class="p1"><b>Overlap?</b> Not knowing the catchments of the cluster groups isn't a complete fail, its just unnecessarily vague. However, what is clearly a serious problem is the group circles overlapping. That's plainly confusing for our imaginary user, it has no meaningful interpretation that I can think of.</div><div class="p2"><br />
<b>Alternatives: </b>I think that both heat maps and grid density maps (below) are better solutions to the herd of sheep problem in this context as they communicate the data as <i>density</i> of bikes rather than <i>total count</i>.<br />
</div><div class="p1" style="text-align: center;"><a href="http://3.bp.blogspot.com/-7xjczBIcrSE/TntD8rcUUxI/AAAAAAAAA5k/NRQhXKQs_vI/s1600/Grid+map.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="256" src="http://3.bp.blogspot.com/-7xjczBIcrSE/TntD8rcUUxI/AAAAAAAAA5k/NRQhXKQs_vI/s400/Grid+map.gif" width="400" /></a></div><div class="p1"><br />
</div><div class="separator" style="clear: both; text-align: center;"></div><div class="p1" style="text-align: center;"><i><span class="Apple-style-span" style="font-style: normal;"><a href="http://2.bp.blogspot.com/-pRW3MXfjtAg/TntD9GhE4ZI/AAAAAAAAA5o/G99hMjXivlM/s1600/Heat+Map.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="258" src="http://2.bp.blogspot.com/-pRW3MXfjtAg/TntD9GhE4ZI/AAAAAAAAA5o/G99hMjXivlM/s400/Heat+Map.gif" width="400" /></a></span> </i></div><div class="p1" style="text-align: center;"><i><br />
</i></div><div class="p1" style="text-align: center;"><i>Alternatives: heat map of house prices (bottom) </i><i>Grid map of mobile web coverage (top) from <a href="http://www.bbc.co.uk/news/technology-14582499"><span class="s3">this BBC site</span></a>). Boundary is of the whole bike scheme.</i></div><div class="p2"><br />
</div><div class="p1"> (Note that I didn't have the time to create actual maps of the data we're discussing, these are maps of different data sets over London but they illustrate the techniques). </div><div class="p2"><b></b></div><div class="p1"><b><br />
</b><br />
<b>High Zoom Best Alternative: No Data </b>My solution to the head of sheep problem is not heat or grid maps and is shown below:<br />
<div style="text-align: center;"><a href="http://2.bp.blogspot.com/-YnqF-0x6tuk/TntREWTNMgI/AAAAAAAAA50/OkUDRRdqd4I/s1600/Landscape_GE_screen.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="270" src="http://2.bp.blogspot.com/-YnqF-0x6tuk/TntREWTNMgI/AAAAAAAAA50/OkUDRRdqd4I/s400/Landscape_GE_screen.png" width="400" /></a></div><div class="separator" style="clear: both; text-align: center;"></div><br />
its slightly counter intuitive but I've come to it by thinking about what the user actually needs. She's probably getting into London by public transport and therefore knows the rough area that she wants to pick up a bike from. My reasoning is that at this zoom level, the <i>data </i>is actually a visual distraction<i>, </i>what she really wants is to see <i>landmarks</i> so she can zoom in on her chosen area. The bike availability is best kept off screen until she has zoomed in You can see I've used three landmark layers above:</div><ul class="ul1"><li class="li1"><b>Boundary:</b> A polygon showing the boundary of the area covered by the Boris bike scheme </li>
<li class="li1"><b>Big Train Stations:</b> The location of a number of mainline train stations. Not only are these well known landmarks in London but a large number of people wanting to pick up bikes will be arriving here (red pins).</li>
<li class="li1"><b>Bike Stations:</b> The location of the bike stations themselves (blue circles)*</li>
</ul><div class="p2"><b>Medium Zoom: </b>As the user zooms in from the High Altitude Zoom view, the two big clusters resolve into smaller groups (below left).<br />
<br />
<div class="separator" style="clear: both; text-align: center;"><a href="http://1.bp.blogspot.com/--ton5uOqmwg/TntGLxrbmLI/AAAAAAAAA5w/J6GDEJ4-P8Q/s1600/Med_Zoom.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="220" src="http://1.bp.blogspot.com/--ton5uOqmwg/TntGLxrbmLI/AAAAAAAAA5w/J6GDEJ4-P8Q/s400/Med_Zoom.jpg" width="400" /></a></div><div style="text-align: center;">Medium zoom screenshot (left) and suggested alternative (right) created by screen capture from excellent <span class="s4"><a href="http://bikes.oobrien.com/">oobr's bike share map</a></span></div><br />
With each further progression down the zoom levels the number of clusters, their size and their location changes. This change of symbolization proved highly confusing to users. My PhD student Craig did some user tests on a similar visualization, his observations show that users expected that the circles would persist across zoom levels - some even said they wanted to use them as landmarks and were very put out when they disappeared from the screen! </div><div class="p2"><br />
</div><div class="p1"><b>Medium Zoom, Improved View (</b>above, right)<b>: </b>At this zoom level, by reducing circle size, its actually possible to present circles representing all the bike stations with color coding showing where bikes are available (red = lots available, blue = few, circle size = number of docking points at each bike station). Our user can probably locate a station to head for without having to zoom in further, a good usability gain plus she avoids the problems of changing symbolization outlined above. The alternative map isn't optimized for an iPhone screen but I think you can see my point.</div><div class="p2"><br />
</div><div class="p1"><b>Conclusion:</b> My suggestions for improvements to the bike app screen shots at high and medium zoom levels involve not using a clustering technique at all. They could be combined as an complete alternative to the app; at high zoom levels the user sees just landmarks, when she zooms on her chosen area the map view switches to the medium zoom visualization illustrating bike availability. This alternative app would;</div><div class="p1"><br />
<ul><li>Avoid multiple confusing changes of symbolization with zoom (the most important advantage)</li>
<li>Avoid cluster circle overlaps</li>
<li>Avoid obscuring the view of the map by big cluster circles at high altitude zoom levels </li>
<li>Show landmarks to aid effective zooming in</li>
<li>Show the user bike location data precisely - the user only sees bike availability at each station, there is no ambiguity created by grouping stations. </li>
<li>Present the user with bike availability at the highest zoom level meaning she doesn't need to zoom in unnecessarily. </li>
</ul></div><div class="p1"><div class="separator" style="clear: both; text-align: center;"><br />
</div>I don't think this technique of avoiding point clustering completely would work in all situations but in the case of the Boris Bike app, I think it's the best solution.</div><div class="p2"><br />
</div><div class="p1"><b>Further Testing: </b>My PhD student Craig is going to be comparing the usability of alternatives such as the heat and grid map to the cluster circles in the future. So far preliminary results show there are serious issues with point clusters but also that there are issues with the alternatives as well.</div><div class="p2"><br />
</div><div class="p2"><br />
</div><div class="p1"><span class="Apple-style-span" style="color: #999999;">*I've got the boundary of the Boris Bike scheme and the station points wrong in some screenshots but I haven't corrected it because I'm short on time at the moment and it doesn't impact the discussion.</span></div></div>Rich Treveshttp://www.blogger.com/profile/00074610839485450953noreply@blogger.com0