Selecting cartographic symbols can, depending on the target message, dramatically vary in difficulty. In the context of bike-share systems, which I shall define, let us look at some examples. A bike-share system, third generation, usually consists of stations containing a certain number of bike docks with bikes locked in them. Registered users can easily and quickly check-out a bike, typically for half an hour for free, ride to another station and check the bike back in. In the context of mapping there are actually many elements that can be mapped. A big challenge is communicating effectively the fullness of bike-share stations cartographically. A map must clearly show station locations and whether they have:
Displaying all these attributes concurrently is not nearly as easy as it initially appears. I will explore what symbols are currently used in online bike-share status maps and try and design an improved set.
At the simplest level we can simply show the presence of stations using one symbol at various locations on a map and ignore the attributes. The symbol can be anything, no need to make it resemble a bicycle or a station as the context communicates what we are looking at. Stations are nominal data showing the presence, absence or location. In this case all icons are exactly the same.
By clicking on the markers on the vel’oh! map the attributes are displayed.
We can increase the complexity while staying nominal by looking at the quality of the stations. We can now vary the symbol shape or colour depending on the quality of the stations. We can for example make all stations which have bicycles one color and shape and those that do not, another.
The same could be done in the opposite manner if we were to look for spaces rather than bicycles. Finding empty docks can be a problem if you are cycling into the business core during the day or the outer fringes of the bike-share system in the evenings.
Let us focus now focus on designing symbols that communicate the five criteria listed above. The Spotcycle iOS app, below, uses transparency to communicate the amount of bikes present at a station. Invisible means empty, no bikes, with many docks available and red opaque means the station is full of bikes and has no docks available for parking. Red is being used for active stations and black for those offline. An additional piece of information is being communicated through the circle sizes, the number of active docks at the station. This is not one of the five criteria listed as I do not believe it has enough importance to bother communicating. Bike-share users just want to know where they can find or park a bike.
The Oliver O’Brien (OOB) Bike-share maps, above, also uses transparency but uniformly improve map visibility behind the symbols. Again circle size shows the stations active dock number. Colour hue is being used to communicate the amount of bikes/docks available. In addition outline styling is used to emphasize when there are no docs or bikes available. I do not find these outlines as effective as they could be. I believe black could be used uniformly for both extremes rather than cyan and yellow.
We’ve completed a review of some of the existing bike-share maps. Let’s see if we can design a better symbol set. In the Spotcycle and OOB maps the ratios of bicycles to spaces was rational meaning the exact values were translated into colours or transparency values. It is quite difficult to differentiate the variation and also in this case unnecessary. I have decided to show categories of values rather than showing actually values as this will remove visual variations and that makes it hard to distinguish station states. I will show only six symbols meaning:
I decided early on that I would use a symbol similar to the typical Google Maps type marker. It has the benefit of allowing a clear view of the location while using stronger colours than when using transparency. The downside is definitely that these more complex shapes that add clutter to the map when compared to the OOB maps. I find Google Maps default colour scheme too vivid to show the data on. I switched the view to the Terrain map which is cleaner with light grey and green tones. The highway and street codes/numbers are quite distracting however – more on this later.
The maps created are meant to be easily useful for determining which station to head to in order to find a bike or a dock. The OOB maps I believe are more analytical. Created to get an idea of the pulse of the bike flows.
My idea was to use the marker as a metaphoric container for bikes. Vel’oh! uses blue as their colour and would their use as a fill colour could implicitly communicate their level of presence. I would use the border styling to communicate the warning levels of low or no bikes or docks present.
The blue lines at different stages within the glyph cause too much stimuli and chaos. I would prefer symbols with more homogeneity.
The second style adds explicit dots and removes the coloured borders for uniform black ones. The dots serve as a compromise to the information contained in the borders previously. I enjoy the added contrast of this design but still do not like the half filled symbols.
The third try attempts to reduce colour variation used for the symbols and increase contrast as the yellow was not as explicit as the other symbols. I still find the partially filled glyphs too complex – do not stare it may cause epilepsy. If not yet then the next one may.
The arrows, while adding a new emphasis for the lost yellow border, still add clutter. Clearly the partially filled symbol metaphor is not working no matter what I do.
The uniform symbols give the map a cleaner appearance. Placing the yellow outlines within the uniformly coloured symbols does not solve the contrast problem from the white on the insides of the symbols.
Adding shadows to the markers really changes their feel. They look much more planted in the ground than laying on it. This obviously still does little to solve the yellow-white lack of contrast.
The inner border reduces the number of colours and distraction yet isn’t as clear as an individual symbol.
The last example above is where the map stands now. I hope to, if I have time, continue to play around with the markers as I’m not completely satisfied yet. There still exists some contrast problems and the markers do not easily/explicitly communicate the values they represent. Currently a symbol legend is still required. Ideally a good symbol set could explicitly communicate their value. That’s what I hope to accomplish.
I have since designed a better symbol that is much more intuitive, has fewer colours and a simpler less distracting shape. The palette:
The live page: