With B-Reel’s “Foursquare Time Machine” users can explore and relive all their check-ins, discover new places to go and create their very own shareable infographic.
Location-based social networking app, Foursquare, came to B-reel with the concept of a “Foursquare Time Machine” - a data visualisation experience that takes the user back in time all the way to their first check-in.
Based on their history and interests, the Time Machine gives you a list of custom recommendations of places to check out next. As a sharable takeaway, the experience generates a beautiful custom infographic of all your check-ins and stats.
“A lot of focus was put on making the data really come alive,” says B-Reel.
“In true B-Reel style we dove straight into building and tinkering from a day one. With only six weeks from start to finish, we began an iterative process where the technical possibilities and code influenced the look and vice versa.
“A big challenge was the variation of user data across the board. In order to make the experience dynamic for everyone - regardless of the user having 50 or 5000 check-ins, traveling the world or exploring a single corner of it - we focused on making the playback of user data flexible. By taking an adaptive cross-browser approach we are able to smoothly visualize full check-in histories even for the most passionate Foursquare users.”
Play mode plays back your lifetime of foursquare history. To provide the smoothest and sharpest experience possible, as well as a rich musical backing and audio feedback, B-Reel used a wide spectrum of HTML5 technologies including Canvas, CSS3D, WebGL and WebAudio.
In Explore Mode the user can step through each individual check-in with detail. A scrubber ramps up and down the speed of playback. By analysing your data, the app provides you with recommendations of where to go next.
“The ultimate goal of the experience is to inspire Foursquare users to do more. The data they have is powerful and this experience allows us to showcase it in a way that is fun for the casual user but also goes deeper for those that want to see even more.”