2021

Hackney Windrush

A website to celebrate a generation
Web Design
Web Development

Context

Hackney Council is the local government for the London borough of Hackney. In August 2018, they were the first council in the UK to pass a comprehensive motion regarding the Windrush generation scandal, and celebrates Windrush Day every year on the 22nd of June –  the date the ship HMT Empire Windrush landed at Tilbury Docks in 1948.

Goal

We were commissioned to design a micro-site that helped raise awareness of Hackney Council's commitment to the Windrush Generation. This was a joint project that involved another creative team called Blanguage, who handled the research and testing phases of the project. I worked with my business partner who covered the design to develop and launch a new website that met the strict accessibility guidelines and 1-month timeframe.

Research

Information Architecture

To begin the project and translate their idea, the client provided us with some wireframes and a loose sitemap. My first task was to analyse them both to gauge their appropriateness in respect to what could be feasibly built within the timeframe we were set.

The main issue with client site maps put together by clients and not designers is that they can sometimes overcomplicate journeys and not accurately map out what can actually be developed. With all things considered I designed and presented the official site map to first establish the scale of the project and to reaffirm the key actions we wanted users to take on each page.

With a solid map of the website structure and a review of the intended design aesthetic the designer began to produce some low resolution wireframes to illustrate how users could navigate across the website, highlighting key sections and a layout that could be optimised across different screen sizes.

The main action we wanted users to take on the website was to register their attendance to local events that were being hosted in their area, so with the wireframes we were able to show the journey that would make this possible.

While the wireframes were being developed I focused on the dynamic content, and designed the database that the Hackney team would eventually use to maintain and update their website.

Design

Database Design

From the initial sitemap and confirmation from the client I established the databases needed and detailed the content within each. I wanted the databases to be flexible enough to cover the variety of content and be straightforward enough that any member of the Hackney Council could interpret and create new instances when needed. This was presented to the client to make sure they understood what they would need to fill out in order to create new articles, resources, stories and events. This was then shown to the designer to correlate the database items to design components and produce high-fidelity wireframes.

We used feedback and rounds of iterations to get the wireframes ready for development. Important decisions were made to keep the scale of the website down, like to direct users to off-site booking forms, in order to ensure we weren't overcomplicating the build and keeping within the timeframe.

We also hosted additional rounds of user testing when we had finalised the wireframes and at stages the design to ensure we were appealing to our desired cohort. At the point where we were satisfied with what we had, I used Webflow to develop the final website, and set up the custom CMS on the backend to ensure the client could manage the website content after the onboarding phase.

After building the website I tested the usability against the WCAG accessibility guidelines, ensuring it met the AA levels and produced a report that detailed this and included details for areas that hadn't met particular standards.