This is the story of how we transformed Brighton & Hove City Council’s website from bland and difficult to use, to a vibrant and intuitive experience which helps people with their everyday lives.
Brighton & Hove City Council had an urgent need to reduce costs while still providing a good service to citizens and businesses. To achieve this, the council urgently needed a design transformation to provide far more effective digital experiences, and for their team to have a system that would enable them to make improvements into the future.
It was clear from citizen feedback, stakeholder interviews, and our own expertise that the Brighton & Hove City Council (BHCC) website was falling short on a number of fronts. It was hard for citizens to find the information they needed, the existing digital services were often complicated to use, and there were major inconsistencies in experience throughout the digital estate.
Our job was to enable the council’s small but dedicated digital team to improve and create better digital services over the coming years. We would do this by simplifying and redesigning fundamental user journeys, and organising these into a system comprising a library of styles, components, and guidelines.
We tackled the challenge with a three-pronged approach. Firstly we set about improving the way citizens find information important to their lives. Next we applied took the council’s iconic offline branding and applied to the website. Finally we wrapped up the outputs in a design system that we specifically created to be used, maintained, and expanded by the council’s digital team.
The simple answer is to find out what people need and to make it easy for them to find it. In order to set a precedent the council’s team could follow, we focussed on one of the most widely used parts of the council site - the Cityclean service. Providing a key source of information, citizens come here to learn everything from what can be recycled, to discovering community composting initiatives, through to bin collection days.
We made this information much easier to find by using our tried and tested methodologies. We analysed website data and contact centre calls to establish a hierarchy of needs; we removed unused and out-of-date pages; ran card sorts to understand how citizens think about topics; and introduced a controlled vocabulary to help cross-reference information for improved findability.
Armed with this understanding of what people need, we designed a system of service hubs, sub-hubs and topic pages that could be easily applied across all the council services.
BHCC has a really strong visual identity. It makes bold use of colour and type, recognisable throughout the city on signs, billboards and in print. The website and digital services, however, sorely lacked any of this dynamic brand.
Building upon the usability improvements, we provided BHCC with a major improvement to the overall websites’s visual appearance, bringing it much more in line with the council’s branding.
Running parallel to the work described here was a service design project, which included redesigns of data inputs and form flows. We combined these with the user journey and information designs detailed earlier to provide a flexible pattern library of templates and components which could be used in multiple configurations. These formed an initial basis for the design system, to which we added web-specific brand guidelines, instructions to developers and guides for designers of new and redesigned services and information.
The design system, combined with learning from our nimble approach to service design, has been proved a success. The BHCC digital team have relied upon it when independently designing new services and updating old parts of the site. What’s more the team is expanding the BHCC design system in the open.
If you want to find out more about design systems, please have a listen to episode 1 of the Clearleft podcast.