Whistlefish 2.0 Shopify Website Design Case Study

Navigation plays a huge role in Whistlefish’s user journey, especially on mobile where the majority of browsing takes place. I designed a mobile-first navigation system that made it effortless to filter products while keeping Whistlefish’s signature imagery front and centre. This ensured usability without sacrificing brand storytelling.

A key innovation was the ability for users to drill down through collections and sub-collections from a single block. On a small screen, this design allowed shoppers to navigate multiple levels of categories quickly, without clutter or confusion.

This approach saved space, simplified browsing, and made it far easier for users to find exactly what they wanted.

Whistlefish’s main products, greetings cards, are more lower priced products compared to most other Shopify stores I deal with. Popular bundles include “10 for £10” or “15 for £10” deals. So they needed a different collection page UX.

On the old site, every add-to-cart triggered a full slide-out cart, which frustrated users and slowed the flow. On the new site, I introduced:

• A subtle slide-in message instead of a full cart takeover

• Dynamic buttons that transform into quantity selectors after adding an item

This made it much easier to add multiples and take advantage of bundle offers, directly supporting higher AOV.

Product pages were redesigned to be clean, elegant, and intuitive, with every element placed where users expect it. The simplified layout keeps the focus on the product imagery while also highlighting key details, such as the type of ink used. Subtle upsells, like the Rewards Club, were integrated to add value without distracting from the main purchase journey.

A custom search experience was created to separate results into clear categories: popular searches, collections, and products. Strong visual hierarchy and considered layouts make it quick and easy for users to find what they need, without having to sift through irrelevant results.

The cart was redesigned with conversion in mind. Key improvements included:

• Delivery messaging to reduce uncertainty

• Clear product messaging showing how many more items were needed to unlock an offer

• Automatic application of promotions once thresholds were reached

Since Whistlefish runs multiple offer types across different products, this clarity was essential in reducing friction and driving more completed baskets.