Jan 24, 2013

Bechmarking

The second part of the Dynamic Visualization course started last Thursday, and our task was to do some well-structured benchmarking. We had been looking into other similar apps and services already during the fall's course, but perhaps not in such a systematic way. What we found already then was that none of the environmental apps we looked into were that engaging or well designed and that most geo-location based apps we found were pretty similar: based on google maps with some pins and additional layers.

The main points of benchmarking were to find concrete ideas we could use, and to learn from others' mistakes. Below are some of or findings regarding a few services we looked into in more detail.




What's good here:
  • First impression was very promising. The layout and Look&Feel gave a promise of good quality content and meaningful interaction. 
  • When studying the titles of the content user gets a feeling of comprehensive and versatile content. 
  • The design itself is appealing and suitable for the content
  • The design of the map is nice and clean and could work also in mobile devices. 

What we must avoid:
  • Poor and clumsy interaction
    • The map is not really dynamic part of the user interface, it is just illustration with minimum amount of functions. The map does not work as an interface.
    • The journeys are not interactive in a dynamic sense: The user can select a journey from the list and then follow the given narration. The content of the journey is still images and text. 
    • There is no visible timeline or visual cues how time passes by -- you can find some years in the text but time is not navigational element. 
  • Content and design inconsistency
    • There is no information considering the amount of content per journey -- it varies from 2 images to n images.
  • Confusing design and poor communications
    • Difficult to divide which parts of the webpage are functional (ui) and which parts are graphics. 
    • Do not promise too much -- you do not want to disappoint the users
    • How to give a general overview of the project (app, webpage) to new users --> graphics, info text, titles --> what is this service about. 

2) The urban mediator (website / demo)


What we can use
  • Closely related to our project in a way that location-based information is displayed on a map with symbols. 
  • They're using open street maps, while we're planning to use google maps. Why was open street maps chosen? Is there something we don't know that makes it more suitable?
  • They give people the option to view a list of the data, or the data on a map --> sort of similar to what we want to do.
  • Clickable symbols open a popup screen on top of the map to display photos, comments etc. --> pop-ups won't probably work in a mobile environment, but how about tablets/dekstop?
  • They have a desktop and a mobile version of it --> Should we only concentrate on mobile at this point?

What we can do better
  • Design: right now the service isn't really working, and it looks outdated (at least based on the demo)
  • Communications: when entering the urban mediator site, its hard to figure out to whom it is made for. Developers? The general public?
  • Usability: It's not that clear what you should do when entering the site. We want to make it obvious.



This is not a pretty example, but it is the first one we have found that uses gradient coloring to represent data on a map. It represents how the world's population is divided across the globe, which makes it a valid example for us: it is realistic to assume that places with the most population have the largest amount of reviews, making our gradient coloring equally unevenly distributed.

Tests for local environment

Here are some samples from early map tests for local environment with different color gradients.


Masked color gradient tests.
Some try-outs in Illustrator with gradient spots where transparency didn't really work.


The map of Finland with Illustrator's gradient spots.
Different color schemes with Google map.

From Google earth came the idea for logo with a paper cut figure inside a globe. 
This has to be rethinked, since the customer isn't quite happy with it:












Some test pictures for facial expressions: