Bluecadet worked with the Outrider Foundation on branding, editorial strategies, and product development to establish them as a leading voice for global change. By establishing an early strategic partnership, Bluecadet was able to build the site from the ground up and help Outrider understand what their website should look like based on their mission.
The Outrider Foundation was created in 2017 to educate the public on the dangers of nuclear proliferation and global climate change, and named after a member of the vanguard who clears the way ahead. But how do you clear the way ahead in a field already well trod by think-tanks, think-pieces, and popular documentaries? Show people what happens if a nuclear bomb detonates in their backyard. Here's how they did it with Outrider Bomb Blast
One of the most popular elements of the outrider.org is its commitment to visual storytelling and interactive tools - most notably the nuclear blast simulator, Bomb Blast. The Bomb Blast page features a loop of various archival video footage, and prompts visitors to "Experience the power of a nuclear blast in your area." Visitors are able to manually enter a location of their choice or enable location services.
Once a location is selected, a map appears with a blast and then a visual indicator of the bomb's effects: radiation, fireball, shock wave, and heat. The number of fatalities and injuries caused by the bomb are also available. Visitors can choose between different types of blasts and bombs to simulate different effects. There is also a link at the bottom of the page to "Learn What You Can Do About Nukes," calling visitors to action and be informed. There is also a strong social strategy involved in Bomb Blast, as visitors can enter the site through the landing page, or click through a pre-shared location that someone else had interacted with.
Once a location is selected, a map appears with a blast and then a visual indicator of the bomb's effects: radiation, fireball, shock wave, and heat.
Technologies - throughout the case study
The bomb blast interactive is a visualization of two separate calculations. Given the bomb yield, detonation height, and geographic location of a nuclear blast, it displays the estimated radii of the blast's effects, and the estimated injuries and fatalities of the blast at the given location. These calculations were made by Alex Wellerstein, a historian of science and nuclear weapons, professor at the Stevens Institute of Technology, and creator of the original Nukemap.
To calculate the blast radii, Alex created JavaScript ports of calculations made by the U.S. Atomic Energy Commission in 1963, and the U.S. Department of Defense and Energy Research and Development Administration in 1977. To calculate the casualties, Alex applied injury and fatality rate estimates made in a 1973 report by the Defense Civil Preparedness Agency to a spatial query run on the LandScan Global Population database. You can read more about the data and calculations here.
Blast Effect
To produce the blast effect, we have two separate canvas elements. The first canvas draws the Mapbox map. The second is positioned on top, and contains just the blast layer effects. While mapbox provides the ability to draw one canvas into another, we found we could achieve a more consistent frame rate for our blast effect by keeping the canvases separate.
To produce the blast effect, we have two separate canvas elements. The first canvas draws the Mapbox map. The second is positioned on top, and contains just the blast layer effects.
For the initial blast, each layer is drawn using a png sequence of images produced by our motion designers. We experimented with various methods, but ultimately ended up using a WebGL canvas context for the best performance. Once the initial blast is complete, each layer just renders a static image texture. To achieve the slow ambient motion, we applied a fragment shader to each layer. To size the blast, we used some of mapbox's utility functions to convert the geographic size (from the blast calculations) to positions on screen.
Bluecadet and Outrider collaborated with Alex Wellerstein, creator of Nuke Map, on Bomb Blasts, an interactive tool that personalizes the devastating impact of nuclear weapons and encourages the public to learn more and to take action. The map enables users to type in an address or use their current location, and then Bomb Blast's target audience is anyone who is impacted by the threat of nuclear war.
The map is powered by Mapbox, which was a delight to work with. We used its map, map style editor, and geocoding api. Using an iterative approach, we quickly built a rough, but feature-complete, prototype. (the initial prototype is pictured below). We were then able to experiment with different map styles, UI elements, and visual treatments for the blast, all on a functional interactive.
Visual storytelling and interactive tools like the nuclear blast simulator were a key part of Bluecadet's strategy to transform Outrider from a grant-making organization to an international foundation. The brand identity, web platform, and editorial voice Bluecadet created for the Foundation has an accessible yet authoritative sensibility designed to cultivate an engaged, contemporary audience.
In addition to creative interactive timelines and tools like the nuclear blast simulator, Bluecadet's production team populated the site with extensively researched multimedia features that integrate galleries of rarely seen imagery, archival video clips, and unique data visualizations into the narrative flow to create a dynamic reading experience.
Company Info
Established in 2007, Bluecadet is an Emmy Award-winning digital agency that creates world-class websites, apps, interactive installations, and immersive environments. We collaborate with leading museums, cultural institutions, universities, and nonprofit organizations to educate, engage, and entertain.