Making A-Z easy as 1, 2, 3

Hippo Blue – Web Redesign

BRIEF

Brief

Brief

Create the website for one of Hippo Blue's most engaging products, giving users the freedom to create a highly customisable children's book that can include their family and friends — the ABC Jungle.

Hippo Blue is a personalised children's product company.
The company rebranded and required a digital rollout/redesign including website and marketing collateral. I lead the digital design and web development of this project, along with EDMs and other advertising pieces.

abc-jungle-characters
PROCESS

Process

Process

Process

Unpacking the A-Z of product customisation

This was not your average ABCs book. Not only could the main hero of the book be customised, but so could the names for every letter of the alphabet. The complexity of the challenge was crafting this customisation journey to be fun and user-friendly. With 28 points of customisation, the experience needed to be seamless on various screen sizes, especially on mobile devices where space is a premium.

Redefining the Hippo Blue web experience

When a website goes through numerous versions of minor visual changes, there is bound to be disparate layers of UI and inconsistent user experience. This was the top priority that needed to be addressed for the website. I created an asset inventory of the existing website UI and reviewed the user journeys that were already in place.

After receiving stakeholder buy-in, the collective decision was to redesign the website UI/UX from ground up, as opposed to just a 'reskin' of current UI elements and layouts.

I ran workshops with the team and gathered insights into how the users are currently navigating the site and how we would like to improve their user journey with the introduction of 'worlds' within the Hippo Blue brand.

I went through many iterations of wireframes with the Hippo Blue team to explore how we could tackle simplify this product creation journey. Sketching out ideas quickly allowed me to collaborate well with the team on what worked and what didn't.

abc-jungle-wireframe-collage-angled

Another important factor to consider was existing site data. In order to focus efforts in the right area, I explored Hippo Blue's analytics data and found that the subsection of our audience for this type of product would most likely visit the site on a mobile device. Therefore it highlighted the need to design a great customer experience on smaller screens.

I wanted the experience to be immersive, allowing not only parents but also the child to be involved in the creation of their own story book. The book's jungle theme aesthetics were used right throughout the journey which carried the sense of fun throughout.

Creating magic in the marketing

Aligning with the rebrand and introduction of 'worlds' within Hippo Blue, the visual style of marketing was revitalised. I led the design of new EDM templates/layouts, social media and other advertising with a new imagery style that combined photography with illustration and animation. This brought to life the 'worlds' concept into children's everyday life.

invite-animation
abc-jungle-screens-desktop
abc-jungle-screens-mobile

Continuing to chart new terrain

Post-launch, I continued to improve on the site experience. Design changes were supported by research data such as heatmaps and session recordings. I also performed A/B testing on different layouts, such as re-ordering sections of the page or navigation elements. These processes substantiated my design decisions moving forward on optimising the UX.

RESULTS

Results

Results

Created a fun website which solved the complex customisation challenge with a great user experience for both mobile devices and large desktop displays alike. The product launch was a success and sales continued to increase as I optimised the website design.

  • A fresh, consistent and unified digital brand presence
  • Created a comphrensive visual design system with reusable component code that improves effeciency on design and development time
  • Improved user engagement rates and sales

Other projects I've worked on

Hippo Blue Web RedesignWeb design, UX, UI design, marketing collateral

abacáBranding, Print and Packaging Design

NuaBabyWeb Design and Development

Collins 234Web Development

Mills OakleyWeb Development