Faces of Energy
Role: Design lead
Studio: Beyond Words Studio
United Nations tasked Beyond Words Studio with creating an engaging and informative dashboard experience that maps stakeholder engagement on gender equality, social inclusion, and women’s empowerment at the intersection of sustainable energy and climate change agendas. They wanted the dashboard to showcase a map populated with the number of opportunities by country and region for filtering and discovery. They also wanted the map to be updateable as they would be adding or changing data as they received program updates.
Part of the research: Left to right, Sifted dashboard, Abu Dhabi Department of Municipalities and Transport, Institute for future cities
User research and requirements
United Nations already had a clear idea of their target user group: stakeholders interested in connecting with programs or organizations with a focus on energy and gender. After interviews with the United Nations team, we came up with a clear set of user requirements for the dashboard:
- View the number of programs/organizations globally by region or country
- Filter programs/organizations by certain themes
- Examine a country or region to see a breakdown of programs/organizations
- View summary stats for country/region
- Overview of access or scoring for various energy themes for each country
- Further breakdown of programs/organizations on the country/regional level that can be viewed across different lenses of information
- List of programs/organizations with top-level information for users to research or contact
We also performed visual research of existing map-based dashboards to explore what was/wasn’t working for each.
One of many early sketches
Sketching and concepting
We knew that the map would be the dashboard's primary focus, so we wanted to build various filters and pop-up states for the user to interact with. We started with more abstract representations of the map but through wireframing and client feedback settled on a more traditional map representation.
Since we determined there were only two filters for the map, we wanted a design that exposed both so that the user didn’t have to work too hard to filter the map.
We also wanted this dashboard to work on mobile so we started by sketching out country/region pop-ups that were simple enough to work on narrow screens.
Faces of Energy typography and palette
Design and implementation
Once the high-fidelity wireframes were signed off we could start iterating on the design of the dashboard. We used the main UN blue and typography as our base but had more freedom in building out a colour palette that would work best for this piece.
We iterated on several designs with the client, incorporating feedback at each stage. We also worked closely with developers at this stage to make sure responsive designs were straightforward to implement and wouldn’t cause any blockers.
In conclusionVisit site
The final design features an interactive map allowing users to explore the different energy programs and organizations worldwide. Users can click on each story to learn more about the individual and their contribution to the energy industry.