IDEA

isoscope_konzept-03.png

We drive to the closest supermarket, take the bike to the gym or walk to the cafe next door for a nice chat among friends. Getting around — thus mobility — is an essential part of our being. We were especially intrigued by those situations when our mobility is compromised such as in traffic jams or during tough driving conditions. How do those restrictions impact our journeys through the city and who is affected most? Obviously, a car can hardly bypass a traffic jam, whereas a bike is more flexible to continue its journey. Let alone the pedestrian who can stroll wherever he wants to.

Isoscope tries to answer the questions above by comparing different means of transport and their sensitivity for disturbances.

Isoscope_concept2.png

Once you are stuck in bad traffic conditions, you will need more time to cover the planned distance. In other words: stuck in a traffic jam, you will cover a smaller distance in a predefined amount of time.

This is, what Isoscope is about: layered shapes show the area around a chosen location that is reachable within a chosen travel time.

As traffic conditions change throughout the day, there are 24 layered shapes - each representing one hour of the day.

Isoscope Endpräsentation (11).png
Isoscope_Concept4.png

With Isoscope one can easily see and compare the influence of traffic conditions on our mobility or compare the reach of different means of transport. Within or among cities. Worldwide.

PROCESS

From initial sketches and scribbles to a running interactive prototype.

sketches.png
prozess1.png

As we advanced in the ideation of Isoscope and agreed on some kind of organic shapes representing our „mobility scope“, we made our first programming steps in Processing using the [HERE API](https://developer.here.com/ „HERE API“). Initially, we tried to calculate all possible routes from a given location within a specific time. Only afterwards we came across the HERE Isoline API that calculates areas reachable within a given time automatically.

Since we wanted Isoscope to be platform-independent, we changed the programming environment from Processing to JavaScript. Several iterations regarding the look of the shapes, map style and UI elements and functionality finally led to Isoscope V 1.0.

Bildschirmfoto 2014-02-13 um 21.41.47.png

RESULT

Video showing the basic functions while exploring Berlin, Barcelona, Paris, London, Boston and New York.

[Go ahead and check your home town, favorite spot or any other place on the globe: Explore Isoscope!](http://www.flaviogortana.com/isoscope „Isoscope“)

New York – Brooklyn Bridge | 4min

New-York2.png

Boston – Boston Common | 10min

Boston.png

Barcelona – Plaça de les Glòries Catalanes | 6min

Barcelona2.png

Cape Town – Foreshore | 10min

Cape-Town.png

OUTLOOK: The Isocope-ID

Playing around with Isoscope, you will soon realize the different characters of the organic shapes according to the city's traffic infrastructure (e.g. density, road quality) or natural boundaries. No city equals another which led us to the idea of an Isoscope-ID:

A grid of Isoscope-shapes is applied on an urban area. Reducing the shapes to their minimum and maximum dimensions results in a grid of organic ring-like shapes. Once converted into circles of different width, you'll get a unique identifier of the covered area: the Isoscope-ID like the following one for Los Angeles.

ringe_losangeles_7.png

Besides the integration of new features we are considering to smooth the interaction of scrolling through time by adding animation. On the one hand this would increase the user experience and on the other hand this would enable a nearly stepless morphing of the outlines.

Furtermore, the possibility to compare cities or areas needs some more attention, since for the moment this is only doable by making and comparing screenshots. The integration of something like a split screen mode could be useful in this case.

Even though we haven't still finished all of our intentions, there is already a whole world to explore with Isoscope. So happy exploring!

Artwork_NY.png