Having decided on a basic methodology for the decision making process, we are now in the process of developing UI mockups, which we can present to stakeholders to get their opinion of the system. UI mockups allow an early view on the look & feel , i.e. usability of the system, and allow the designer to easily collect feedback from users and integrate changes without having to modify/rewrite code.  For my project, I also hope that I can give stakeholders a better understanding of the system development process and of the project’s main aims through this showcase.

I have been looking at different methodologies for producing such UI mockups, and how they have been applied to GIS & SDSS type projects. I must say that I have only found sparse evidence of systematic efforts by GIS practitioners to apply usability principles through the use of mockups  in GIS development activities. My view also is corroborated by Muki in his recent blog post, where he argues that usability and the processes in software development that ensure good usability still seem to be considered a nice to have, and the GIS industry lacks a “usability culture“, inherent other industry sectors.

But I digress…  As always, there are multiple methods of doing UI mockups. One of the most straightforward and widely used methods uses paper, pen and scissors to physically create the UI elements, which can then be arranged into an UI mockup. This of course is very flexible as you can easily create and assemble together whatever user interface elements one needs or wants.A digital equivalent is to use PowerPoint or any other general purpose drawing tool to generate the UI mockup. But there are also drawbacks. Physical UI mockups can get lost/destroyed, are not easy to revise, and changes can’t easily be tracked. Digital mockups made with PowerPoint are also cumbersome to generate, and one needs to invest a lot of time into generating basic UI elements (altough some templates to get you started are available). With PowerPoint mockups, you can even generate basic interactivity inside the mockup by creating links between slides, altough this is still cumbersome.

Obviously, a specific quick and dirty design tool for mockups would be great, and thats exactly what I found with Balsamiq Mockups. They have both a free online tool version as well as a desktop application version available, which supports features such as dynamic links between screens. Also, Balsamiq Mockups intentionally uses hand-drawn UI elements to generate “paper quality mockups“, so that people don’t get attached to “that pretty color gradient” or think that your mockup has actual code behind it and is “practically done”.

I just spent the afternoon creating such a mockup for my project, and I am more than happy with the results, even though they only offer a basic “map” element which is specific to GIS. But the rest of the template of pre defined UI elements is rich enough to model most GIS related UI.

I would urge any GIS developer who hasn’t used mockups for their application development process before to give it a try and enjoy the benefits of better usability for their applications and happier users!

I just wanted to draw attention to this great set of videos that give a great overview of one of the first large scale Geographical Information Systems, in this case the Canada Geographic Information System (CGIS). Dr Roger Tomlinson was the initiator, planner and director of this for the time very ambitious project, which meant that he has gone down in history as the “father” of GIS.  I feel quite proud to note that he wrote his PhD thesis here at University College London!

From the Wikipedia article:

The Canada Geographic Information System (CGIS) was developed in the 1960s and 1970s to assist in regulatory procedures of land-use management and resource monitoring. At that time, Canada was beginning to realize problems associated with its seemingly endless boundaries, in combination with natural resource availability. The government therefore decided to launch a national program to assist in management and inventory of its resources. The simple automated computer processes designed to store and process large amounts of data enabled Canada to begin a national land-use management program and become a foremost promoter of geographic information systems (GIS).

HeatMapApi.com is a new service which allows Google Maps mashups to integrate heat map representations easily. Heat maps,  or more generally point to raster interpolations allow the graphical representation of point patterns through the use of continuous colors identifying areas of higher or lower density of points. Areas where this has been employed are crime hotspots analysis or economic activity analysis.

A novel concept in Web 2.0 mashups, I was interested in finding out what the methodology was behind the generation of these rasters. Sadly, I couldn’t find a definitive answer on the algorithm that the website uses to generate its hotspot maps. They do expose in their API two variables that can influence the generation of the heatmaps, decay and boost, but without information on the algorithm behind it, the setting of these values remains a pure exercise in trial and error, and seeing what “looks” best. Also, because the parameters are set as “optional”, most developers will be tempted into a one size fits all approach, smoothing out interesting patterns in the data, or creating hotspots that are not statistically viable, creating masses of effectively meaningless maps.

Mashup developers thus will more than ever the spatial analysis literacy skills to understand the processes, models and algorithms that lie behind the pretty maps.

Note: This is not a new problem, but has been present all through the development of Exploratory Spatial Data Analysis over the past 20-30 years in academia and commercial settings, and a lot can be learned from this past experience.