Not for profit, Design, UX, CMS Development

Powering infrastructure growth in Africa

The Challenge

Over the last few years many of the infrastructure projects that the Africa50 fund was facilitating were coming to fruition and the incumbent Africa50 website had not kept pace with the organisation's growth and ambition - the site needed to be re-architected and redesigned to place the activity and projects of Africa50 front and center to the website experience.

A focus on how projects were presented to the public and key stakeholders was of particular importance. We needed to illustrate the importance of these projects, the investment effort made, and the results and benefits these infrastructure projects bring to the continent's population.


A focus on the user's experience

After our initial discovery workshops and audience analysis with the Africa50 communications team, key sections, pages, and user journeys were identified as key to the audience experience. We then started a series of design sprints, creating low-fidelity prototypes to test these key elements of the website and to fully explore the information hierarchy and architecture.


Developing and extending the Africa50 brand

In a parallel sprint, we took Africa50 through a collaborative visual design process, starting with style tiles (or moodboards) and narrowing down to designing key pages of the site. We took the existing Africa50 brand, realised in their Annual Reports and other printed collateral, and extended their visual style for online interactive use.

Emphasis was made on the details - animated statistics, page transitions, embedded video, animated iconography and diagrams: all come together to create a modern and dynamic online presence, reflecting the ambition and character of the organisation.


The Result

Due to the nature and location of Africa50’s activities, the website has high mobile traffic and is often accessed in locations with poor bandwidth. Producing a website that worked seamlessly across all devices and performs in low bandwidth environments was a key aspect of the project's technical requirements. 

Our mobile and content first design processes made sure that the mobile experience was paramount in our thinking, and our technical solution - the enterprise-class CMS TYPO3 and our own bespoke front end coding and programming, ensured that the new Africa50 website  scores high on Google's own page speed insight tools.