Responses by Pietro Lodi, lead UX designer; Oscar Senar, data analyst and engineer; and Jan Wouter Dekker, product owner, CLEVER°FRANKE.
Background: “Climate change is reshaping our world,” say Pietro Lodi, Oscar Senar and Jan Wouter Dekker. “Across Africa, climate change has already increased ‘climate mobility,’ a phrase referring to forced migration and displacement. To showcase the impacts of climate change on the continent, we launched a digital platform and an ‘African Shifts’ report. This provided evidence, knowledge and policy recommendations for COP27 climate change negotiations in Egypt, where climate adaptation strategies were high on the agenda.”
Design core: “Key inspirations for the design are the African people on the front lines of climate mobility, the natural environment and the hopeful outlook toward an actionable agenda,” Lodi, Senar and Wouter Dekker explain. “We decided to juxtapose portrait photography with simple, effective data visualizations, resulting in synergy in which they serve as a context for one another. Visualizations feature bold, colorful charts and mobility maps that truly bring the data to life. While the climate situation is critical, the story of climate mobility is about adaptation and looking forward. Vibrant color palettes and typography combinations frame the entire experience in a positive visual language.”
Favorite details: “If I had to pick one detail I’m particularly proud of, it would be the eleven maps on the chapter overview,” says Lodi. “They have an aesthetic quality and an ability to present rich data in a bite-sized narrative that leaves readers wanting to learn more. Each of them balances several aspects delicately: the monochrome base map plays with the natural matter of the Earth’s surface through lights and shadows, the bubble map visualizes people projected to move due to the climate crisis, and the location provides interesting insights into its local stories.”
Challenges: “Creating a platform while the content was still being produced,” the three say. “We needed to answer how we could combine media, research, data and political actions into one cohesive experience without finalized content.”
Navigation structure: “With such a vast amount of content, we wanted users to grasp the complexity and richness of the research instantly,” say Lodi, Senar and Wouter Dekker. “For that reason, the homepage is an introduction to the five chapters that build the main narrative. We also wanted eleven storylines to be available right from the homepage. The map of the African continent shows each of those stories mapped to a unique location, emphasizing the local aspect of climate challenges and actions.”
Special technical features: “The 3-D maps in the story introductions serve as a data closeup to show how the reality will be very different across locations within the same continent,” the three say. “We built these maps using high-resolution, publicly available elevation data to generate the scenes and consequences of climate mobility in these specific locations. After rendering the 3-D maps, we geolocated them and used them on a Mapbox layout to create the transitions that ‘fly’ across locations as users go through the stories’ overview. This way, we emphasized the diverse geographical aspect of climate change in Africa by geolocating the 3-D maps over the continent and animating the transitions as users go through the stories overview.”
Click on an image to view more from each project