96 Elephants uses storytelling and powerful photography to try and help end the illegal ivory trade.
US-based Viget Labs has created an awareness-focused web experience to enlist support for the Wildlife Conservation Society's mission to protect African elephants. Its most recent campaign is 96 Elephants, so-called because that's how many elephants are killed every day in Africa.
The educational narrative is told through a series of single-page chapters, each detailing the very real complications at play in the ongoing effort to end the illegal act of killing elephants for their tusks. Despite the primary goal of driving sign-ups for a petition, the Viget team has done an artful job of balancing the immediacy that the omnipresent call-to-action presents against the more emotionally compelling, story-driven content. A nice touch in the experience was using Convio Open's API to allow the form submission to occur without the user ever having to leave the page they are currently on.
To bring this all to life, the team used HTML, CSS and JavaScript, employing Sass, Backbone.js and the JavaScript compiler CoffeeScript. Yet, front and centre is the haunting art direction that compels you to stop and confront the emotional mission. The beautiful, edge-to-edge photography and magazine-like layout made the effort to build it responsively a challenge. Instead of starting with the desktop, the site was built mobile-first. That allowed the design decisions to be purposefully considered for small-screens instead of acting as a watered down proxy of the desktop experience.
Christopher is vice president of design for Happy Cog and co-founder of PhilaMade. He educates clients on the benefits of a user-focused and research-driven design process. This article originally appeared in net magazine issue 253.
Thank you for reading 5 articles this month* Join now for unlimited access
