An international development charity improving road safety and healthcare access across sub-Saharan Africa.
Their refreshed brand had rolled out across print and social but the website hadn't caught up. Key pages were buried in the navigation and the site needed to meet WCAG 2.2 AA standards throughout.
Designed in Figma, the challenge was taking an existing print identity and making it work on screen. Typefaces, colour and layout all needed rethinking for digital without losing what made the brand work in print.
The Design
The brand assets existed in print. My job was translating them for screen: adapting the colour system, typography and layout so the site felt consistent with everything Transaid had already put out, without just lifting print assets and dropping them into a browser. Navigation was restructured from the ground up, bringing key pages to the surface so stakeholders could find what they needed without working for it.
The Map
The homepage features an interactive map of Africa showing Transaid's active and completed programmes by country. It was the most considered part of the design. A charity operating at that scale needs something that communicates reach immediately and a map does that in a way copy alone cannot.
Accessability
WCAG 2.2 AA compliance shaped decisions throughout rather than being addressed at the end. Colour contrast, type sizing, content hierarchy and keyboard navigation were all considered at the design stage. The finished site is fully compliant and Transaid's team manages all content independently, including a digital library of 421 documents with filtering and search built in.
