malala-featimage.jpg

Malala Fund, Girls' Education Report Cards

 

Malala Fund, Girls’ Education
Report Cards Website

Client Malala Fund
Scope Web Design

Malala Fund partnered with Threespot to build a digital tool that showcases how girls education is being supported across the globe. As the UN Sustainable Development Goals (SDG) 2030 deadline grows closer, Malala Fund has been issuing report cards to countries, assessing their commitment to our next generation. This project was nominated for a Webby, and won a Silver Anthem Award in 2024.

Team

Jack Nank, Creative Director
Aysha Fuller, Producer
Bren Lau, UX Strategist
Megan Lewin-Smith, Design Lead
Clare Mahr, Design Support
Ted Whitehead + Amaka Mgboji, Development

reportcards.malala.org


Report Card Background

Previous report cards were laid out in digital pdf. However, Malala Fund’s team wanted a product that could be updated frequently, and offer researchers, activists, and girls further detail on how various countries were supporting girls’ education via policy decisions and progress towards meeting SDG (measured using relevant SDG 4 Benchmark Indicators).


Challenge

The design challenge was to create a system inspired by the print piece, that balanced the serious nature of the data with the hopeful, rich aesthetic of Malala Fund’s iconic visual identity.


Solution

Our solution was to use their lightest colors as the background to the site, set type in its darkest colors, and use the brighter hues very sparingly as accents. After the exciting, immersive homepage, site visitors can focus on the in-depth content of interior pages in a clean environment. Strategically placed iconography, rules, and color coding are used to keep the overall spirit of the Malala Fund identity present, without overpowering the data itself. I also created hover states for the data tables, so visitors can use their cursor to focus on each line of information.

Figma prototype
To navigate, click within the frame to advance to the next page, or hover your cursor at the bottom of the frame to reveal arrow controls.