BlueDot Inc. is a company that analyzes the propagation of disease worldwide. With that description, it was a pleasant shock to be a part of an in-house Design Team in the summer of 2017. Getting to know BlueDot's products, with lots of data backing software and print products that needed to read crystal-clear, there was actually an unending barrage of challenging design work. I got to participate in a particularly exciting one when an opportunity to participate in the EDIT festival came up in the middle of the summer and we seized it. The festival pitted design and futurism against the 17 Millenium Goals, with showcases ranging from aquaculture to threats from globalization (us!) packed into the abandoned Unilever soap factory on the east end of Toronto. We chose to highlight the new "proximity" of the global neighbourhood with the proliferation of shorter and more frequent flights crossing the globe, and the fact that humans are not the only passengers on flights. SARS was an infamous example that locked the global flight network and still saw the cross-continental spread of the disease, consequently spurring the founding the lab that would become BlueDot.
We were given a corner of the third floor propped between a floor manager's office box and a huge sliding doorway with about 10 feet in the middle.
The decision to go with a projector setup was unanimous and immediate. No TV hassles, capitalizing on the whole wall area, and no problems from occlusion because of the high ceilings. That said, we had initially planned on a dark and somewhat omonous design, but that flew out the window when we realized how close to:
- The huge windows to the left
- Something titled plainly as the "drone zone"
that we would be. We switched gears and went for something that would capture a bit more attention: a brilliant, panning gradient underlying a spinning, responsive 3D globe. Flight lines would draw in whenever the audience entered a destination, showing the flow of "passengers" travelling between that destination and its "closest neighbours": the most popular routes.
In the back, I aggregated a complete database of flight itineraries into statistics on flight times and a weighted graph of destinations. In the front, a React application managed the timing and structure, and puppeteered the visuals through d3, in particular d3-geo and d3-geo-projection. The globe was an orthographic projection that was animated by slerping between waypoints (in az-el space) (e.g. destinations) and along preset paths (e.g. along flight lines, along lines of latitude). Flight lines were hairier than expected because d3 has no 3D support (ironically) so they were drawn as Bezier curves and split in the middle for proper occlusion.
The festival lasted ten days and hosted thousands of attendants, and the demo survived! It comprised of four screens:
A home screen that cycled through major cities. Vancouver is featured above.
A screen revealing the diseases present in this destination
Home sweet home: a reminder of the new "proximity" of the destination to Toronto
And it still sees use when BlueDot goes to public events!
PC: Deepit Bhatia, at UofT's latest "Donuts with the Dean" at Dalla Lana School of Public Health