A modern redesign for the charity's biggest annual fundraising campaign.

Arguably the charity's most prominent fundraiser, the annual World's Biggest Coffee Morning (WBCM) sees local communities come together over a cuppa and refreshments. As part of the event, guests are encouraged to bring their own culinary creations, portions of which are then sold with all proceeds going to Macmillan Cancer Support.

Although the current recipe page offers an impressive amount of information for budding chefs, it suffers from a poorly-conceived layout and information hierarchy. Key information for each recipe - such as serving size and preparation time - cannot be seen without clicking through to the detailed recipe page, nor can users find a suitable recipe quicker by filtering the total list against these criteria.

The new design offers a far clearer visual hierarchy by introducing a 'featured recipe' - shamelessly using the tantalising imagery afforded by this kind of product, instantly capturing the user's attention and nudging them to browse on.

Each curated group (i.e. cakes and traybakes) are now neatly grouped in rows - which scroll horizontally in order to reveal more items - as opposed to sprawling endlessly down the page; applying progressive disclosure in this way not only encourages discovery through meaningful interaction, but also aids immensely in bringing a sense of order to the page layout.

Another way in which the new design helps users find a suitable recipe quicker is by surfacing key details on the recipe card, while simultaneously allowing users to show/hide recipes that aren't suitable for their needs by using the filter menu on the left side of the screen.

Clicking 'Find out more' on any item from the overview page takes the user through to a comprehensive recipe page, detailing a full list of ingredients and preparation instructions. Each recipe can be quickly printed or shared with a friend using the buttons next to the recipe title, while a list of similar recipes found after the preparation instructions helpfully guides the user towards a suitable alternative should they need it, without having to restart their search from square one.