BES homepage design

British Ecological Society

Strategy & UX
BES homepage design
Client: BES & Made Noise
Project: Stakeholder and user research; content planning; IA; interface design, build management; population
Partner: Made Noise & BrightMinded

Being able to work with the British Ecological Society membership audience, and having the opportunity to shape the brand and website together is something we’re immensely proud off. 

UI and UX sketch and design for BES website


We were so chuffed to be working with the British Ecological Society, (BES) a brand that we’d admired and worked with for a number of years in various guises. We could see how we could help unify their brand and bring order and clam to their online and offline communications, but inflicting our opinions on their brand isn’t the way we work.

Working in partnership with Made Noise we spent time getting to understand and empathise with the internal team, key stakeholders, membership and their wider audience. By the end of the process we’d interviewed and gained feedback from over 204 people, which was no mean feat.

Once we the research was completed and evaluated, we spent time digesting this feedback with a working group from BES. Together we established what were quick wins; no-gos; what was working well; versus what could be improved. This process gave us all brilliant insights to help shape their brand, digital communications and assess their strategy.

British Ecological Society website design wireframes

Working together

Using the insights we’d gained from the strategy work, we ran a workshop to help understand BES’ website and wider digital audiences needs. Their previous the website content was siloed to align with the organisation’s own internal structure and was painful in parts for the internal team to use. Through this process we developed personae and profiles, we planned user journeys through the website. We also spent time assessing what content the users needed, versus what capacity and appetite their was to meet these requirements. This was a way the organisation hadn’t worked before, and our output was a comprehensive user-centred information architecture and content plan for the new website.  

There were a number of templates that we identified that would be required to suit the different user and content requirements. We carefully planned the wireframes and ensured that the content was fit-for-purpose from the user’s perspective, that tasks were made simple and easy to complete and how the content would reflow for mobile devices/

Leading on from this work we specced the website and worked with our technology partners BrightMinded to assess how we could structure the new CMS to work in harmony with everyone’s requirements.

Content really is King

No mater how good a website IA or design is, poor content will always bring the impression of the site down. BES were sat on mountains of brilliant content, but it needed more structure and a knowledgeable, but accessible tone. We provided advice and training for writing of the web and how to strike the right tone.

As part of our website training and the wider brand we provided advice on optimising images for the web, as well as picture researching and guidelines.

As the resource for managing the website was limited, it was important that we worked smart and provided as much help and support to the in-house team. For the future, we helped sense check how content would be managed and what we could do to ensure the website supported them and their users.

BES website UI design for a hub page

Bringing it all to life

The responsive interface design was developed from the newly developed brand by Made Noise. We kept the design clean and clear to aid movement through the site and also support download speeds for mobile users. We worked with BES to plan and populate their content and provided support and and best practice principles. Together we worked through the details and planing for every page, including a fun 404 page, which while we always hope it might never be seen, might pop up from time to time.

What Twitter said:

UI and UX sketch and design for BES website
British Ecological Society events page website design

We liked: working with the internal comms team to empathise with their needs and pain points, and then to balance these with their end user’s needs.