FSNet: Food Systems Research Network
Client: University of Pretoria
Project lead & client management: Design for Development
UX and Visual Design: Unfold
Website development: Matogen digital
FSNet-Africa, a major capacity-strengthening programme based at the University of Pretoria, focuses on advancing interdisciplinary food systems research across the continent. They needed a website that could support their diverse network of early-career researchers, mentors, and stakeholders. The priority was clear: build a clean, fast, and lightweight site with strong structure, clear content, and easy access to key resources.
Logo Development
The FSNet-Africa logo was designed to reflect the network’s focus on interconnected African food systems. The tree motif speaks to growth, research, and the relationship between knowledge (roots) and impact (branches).
To create a distinctive visual identity, we paired earthy browns with fresh greens and warm accent colours, a palette that feels both natural and vibrant. The logo was developed in multiple configurations (full lockup, horizontal, and icon-only), making it flexible across digital and print platforms while remaining clear and recognisable.
Structuring the site
We began by mapping out a sitemap that balances FSNet-Africa’s multi-layered content. This includes fellows, host institutions, projects, events, and publications, all while keeping the user journey simple and intuitive.
The Resources section was a key focus. It needed to accommodate policy briefs, academic outputs, reports, and multimedia content without making the site feel heavy or complex. To support this, we designed a modular content system that allows for easy growth and helps users find what they need quickly.
Prototyping the Experience
Using a mobile-first Adobe XD prototype, we tested how users navigate dense research material while keeping the experience light and fast. This interactive prototype helped FSNet-Africa visualise how different content types connect. It was especially useful for illustrating the relationships between fellows, their projects, and the outputs they generate. All of this was done before development began, giving the team a clear path forward.
A Resource Hub That Works
FSNet-Africa generates a wide variety of research outputs, so the Resources page needed to be powerful, user-friendly, and fast.
We developed a lightweight, responsive filtering system that lets users sort resources by:
- Country
- Research theme
- Publication type
- Author
- Year
The filtering system is intentionally minimal and efficient, designed to load quickly and work seamlessly, even on low-bandwidth connections.
Making Navigation Easy
With content spanning multiple countries and research areas, it was essential to make navigation seamless.
We introduced submenus, clear content grouping, and contextual links to help users move easily between fellows, projects, and resources without getting lost. News, events, and editorial updates are structured for intuitive browsing, ensuring a smooth and consistent experience across both mobile and desktop devices.
Delivering Impact
FSNet-Africa’s website is more than a digital collection. It’s a lightweight, efficient research ecosystem.
By focusing on clear structure, fast performance, and intuitive filtering tools, we built a platform that grows with the programme and makes it easy for users to access the knowledge they need.
We’re incredibly proud of this work and hope it continues to support researchers, policymakers, and partners driving meaningful change across African food systems.
