top of page

The Baillie Gifford Prize for Non-Fiction

The 25th anniversary of the award was approaching and the awards team wanted a website that could reflect the quality of the books. They aimed to shift the emphasis from each year's winner to highlighting their carefully curated collection of non-fiction works. They needed a complete redesign of the website's front end and a comprehensive overhaul of the back-end CMS.
BGP hero.png

Agreed brief:

Develop an elegant design that gives prominence to the site's rich content, putting the collection at the forefront of the design. Create templates that incorporate fluid typography and layouts to ensure no matter what size viewport the user is using the content always shines.

BGP workshop.jpg

In-person ideation workshop run at the client's office

My approach:

I aimed to make the books the stars of this website. I did not want the design to draw attention to itself. At the same time, the experience should be a pleasure. Every page is a possible landing page and point for onward discovery, so every page needed to look and feel great. 

 

Parts of the brand (such as the logo and the colour scheme) needed to remain the same. However, I used the palette of typography and layout to create a suitably refined structure to display the content. I created three different grid layouts, all of them relatively simple to maintain a minimal aesthetic. The only design element allowed to break free from the grid structure were the book covers themselves.

Grid struture.png

The arrangement and organisation of essential content on the website using a grid structure

Tasks I completed:

  • Carried out discovery activities with the Lead UX Designer, including running an in-person ideation workshop.

  • Progressed design concepts from initial wireframes to high-fidelity design layouts.

  • Designed component and layout designs using Utopia fluid responsive design approach.

  • Collaborated with the Lead UX Designer to develop a ‘new reads’ feature using insights gained from the ideation workshop.

  • Presented multiple design reviews with the client, product team and senior stakeholder.

  • Proactively sought input from both the product team designers and the broader Clearleft design community to gain insights to enhance my design work and expertise.

  • Collaborated with the Design Engineer/Developer to address and resolve the technical challenges that occurred in build.

Layouts.png

Collaboration: 

Design Engineer/Developer, Project Manager, Lead UX Designer and stakeholders. 

 

Duration: 

8 weeks

Status:

You can explore the live site here and also read more about what my team did in Clearleft's case study

bottom of page