Nicole Zimmermann's profile

Steps into the Unknown | Webdesign and programming

AIM
Since I am going travelling for some days I wanted to create
a landingpage visualising my movements. It should be non-intrusive,
running in the background and the visualisation should not reveal too
much about my whereabouts and actions.
 
_ learning javascript
_ responsive site
_ data visualization with real-time data
 
 
IDEA
Making use of one of many tracking apps of devices in order to passively generate
data visualising my travels. People being more interested in my experiences can find links
on my landingpage to social media accounts such as twitter, facebook and instagram.
 
Since most apps eat up too much of my precious battery-life and demand much more
attention I was willing to give I had to find a more practicable solution to track my steps.
 
 
 
 
 
 
 
 
 
 
 
 
 
SOLUTION
The Fitbit Zip - Device can be worn on your body and will count your steps, burned calories, most active moments … and much more data you produce day by day.
It has a battery life between 3-4 months and syncs data wirelessly via bluetooth 4.0 with your smarthone.
Once the smartphone has an internet connection the data is being uploaded to the fitbit server. From there I was able to generate an API usable for my datavisualisation.
 
_ longlasting battery life
_ easy update via bluetooth 4.0
_ not dependend on constant internet connection
_ runs in the background / non-intrusive
_ data visualising my movements without giving away too much
DESIGN
I wanted to use colors representing my journey. The destination I am looking forward to the most ist the great barrier reef. I google this keyword, took a screenshot, ran it through a color analyser and used the most dominant blue it returned.
Orange should serve as a contrast and represent the warmth of the sun which I hopefully encounter often.
 
The font is the Google Font "Lekton". 
I designed the site mostly inside the browser working with google chrome developer view and many other extensions and little helpers such as jsfiddle, skeleton.css, moment.js and odometer.js.
PROGRAMMING
Turns out using an API from an external provider wasn’t as easy as I hoped. I received valuable feedback, explanations and much more help from attening the Open Tech School JavaScript meet-ups. They majourly helped me in making this project happen.
 
FINAL NOTE
The days that I have got left to pack my memories-bag are those left until my arrival back on european soil. 
 
For those interested in my destinations:
From day 90 to 80 I will be in and around Cambodia,
from day 80 to 68 in Thailand,
from day 69 to 46 in Japan and last but not least
from day 46 to 0 I will be driving down the east-coast of Australia.
 
AND
Thank you to everybody who helped me realising this project!
 
URL
 
Total amout of steps is the exact number I ended up with at the end of my travels.
The number of remaining days is the age I turned while travelling.
 
Steps into the Unknown | Webdesign and programming
Published:

Steps into the Unknown | Webdesign and programming

Since I am going travelling for some days I wanted to create a landingpage visualising my movements. It should be non-intrusive, running in the b Read More

Published: