Proforest

Not for Profit, Design, UX, Development

Proforest is a unique, non-profit group. They support companies, governments, civil society and other organisations to work towards the responsible production and sourcing of agricultural and forest commodities. Through their consultancy services, they help companies put their sustainability commitments into action, both within and beyond their own supply chains. These cover issues like protecting and restoring forests and natural ecosystems, respecting workers’ rights, advancing gender equality, and engaging with communities and indigenous people. Proforest also facilitates pre-competitive collaboration with peer companies and other stakeholders like governments, civil society and communities.

The challenges

Proforest approached us because there current website had never been intended to handle the large amount of content that it grew to have and this was causing them several frustrating issues:

Poor discoverability of content, especially key resources and documents
A lack of brand cohesion, the website did not present them as the forward thinking modern organisation that they are.
Confusing information architecture that was never intended to hold so much information
A lack of design flexibility and components making content updates challenging and time consuming
Low search engine visibility
Inconsistent visual styles
Incomplete multilingual functionality
Ineffective site search further contributing to discoverability challenges

Planning & Strategy

Proforest’s existing website had grown over time and had outgrown its intended usage. To deliver best in class content management for a site of this size TYPO3 was an easy choice, it’s hierarchical file and folder structure combined with powerful native multilingual functionality and record based content allows us to plan and create an enterprise level website that is ready to scale as Proforest grows.

We held a series of discovery workshops to ensure we understood Proforests offering and feed this into every stage of the new websites development.

As their existing website had a rich history of knowledge and news items a full migration would be needed to ensure all historical content was available on the new website with extensive url remapping to ensure well ranked pages still maintained their discoverability and back links from other sites were still maintained.

We created low fidelity wireframes to quickly explore content hierarchy options and to also run through user journeys to ensure content was found where expected whilst still ensuring brand messaging could be incorporated into a user’s experience of the website.

Design process

Using style tiles for this project allowed us to explore different tangents of visual design without spending a lot of time. Proforest already had a cohesive brand identity so our job was not to reinvent the wheel but to tighten up and refine the current aesthetic to ensure a modern and appropriate look was achieved but was still in keeping with existing marketing collateral.

Once a visual direction had been decided using the style tiles we combined these with our core wireframe set. Starting with a few key pages to begin the process of defining our design system allowed us to gain client buy in before moving into a more component based approach, creating a suite that could be combined together for endless layout possibilities.

Development & Optimisation

The website is entirely editable using the enterprise level CMS, Typo3. It’s important that Proforest can easily update content without the need to keep asking us for help. This is especially true with a website that has ever changing priorities and includes such a large collection of news,resources, projects, and a sizable team.

A powerful site wide search enables content to be searched and filtered to guide users to their desired content with minimal effort.

Website performance is really important to us. By using clean, semantic and fast loading code, the website is well optimised for search engines and to improve the load times for users. The website currently scores 100 out of 100 on Google’s page speed insight tool Lighthouse which analyses various factors including performance, accessibility, best practices & search engine optimisation.

The Result

Proforests new website has a clean and minimal design, it’s fully responsive, multilingual, easy to browse and ready to grow even more however needed.

Full training has been provided to the Proforest team to ensure they can easily keep the site up to date and the extensive component library means that layout options are almost infinite.

The new website provides Proforest with a powerful asset that is ready to grow with the organisation and evolve as their priorities shift over time. We look forward to continuing our relationship with Proforest and supporting the growth and success of their important work.

View the Proforest website