We recently helped to design and launch the new British Film Institute (BFI) website, which went live in August.
As part of changing how film lovers experience and engage with BFI’s digital service, we’ve been redesigning the online look and feel, focusing on typography, colour and the visual style of the new website.
The BFI Design System
To bring all this work together and create a sustainable and flexible platform for future development, while keeping the codebase as lean as possible, we created a living design system.
We prioritised our areas of focus by what would improve the overall user experience and introduce a noticeable improvement for a large number of people. With this in mind, services that have met a particular user need effectively could then be easily lifted and applied by other teams to a different service area.
We built the new website with Drupal as a headless content management system, specifically to accommodate a variety of data sources, and recognise BFI’s many different services. This meant the website remained the central source for all things BFI, with the ability to bring together content that had never before been joined up.
The decoupled front-end does the work of bringing all these data sources together, and a decoupled design system generates the pages using building block components of the design system that we like to call slices.