The International Institute for Sustainable Development (IISD) is an independent think tank championing sustainable solutions to 21st century problems. Their mission is to promote human development and environmental sustainability. The Big Data for Resilience Kaleidoscope explores the links between Big Data and resilience building through the experiences of seven international organizations. Team Lead Angélica V. Ospina trusted Machine to bring her BD4R-k project to life through an interactive online prototype.
The Kaleidoscope design consists of 6 interactive layers, each which holds a varying number of components that reveal valuable insight and evidence to the user. Powered by json data inputted into the backend template, the individual components’ gradient intensity is determined by a strong vs weak grading system. For example: areas of lower color intensity would indicate that that particular component needs to be strengthened.
We worked to ensure the user experience and interaction with the Kaleidoscope was supported by an introductory tutorial which guides the user through every control, function and feature before they begin. Users can zoom in and out, pan around as well as hide and reveal the individual Kaleidoscope layers to better suit their experience. Clicking on the “Randomizer” will generate a unique rotation of every layer while clicking “Meaningful Connections” allows the user to investigate different components viewed within a triangular boundary.
Our developers created the BD4R-k prototype and website completely using jQuery and custom SVG code. The Greensock Suite of jQuery animation plugins proved to be extremely valuable during development, providing the tools needed to replicate authentic movement. For example, the ThrowPropsPlugin allows the Kaleidoscope to use actual physics when being panned around by the user.
A minimalist site map allows for the user to easily navigate through the website, revealing the About, In Action and Contact page. The In Action page houses the Kaleidoscopes of 7 international organizations each with their own model applied. The user can begin to explore further or jump off to the organization’s website. Completely responsive and mobile-friendly, the BD4R-k can be used anywhere, at anytime, to explore the limitations, risks and opportunities of using Big Data to build resilience.
Let’s work together
Our talented Ottawa web designers and developers have tackled projects large and small for over fifteen years.
Contact us today, and see your next WordPress project on these pages.