Mothercare weaning Event, landing page design

At mothercare, there are various events that take place across the website. These events gave more exposure to great promotions and new products. The weaning event offered a look at the top products and tips to ensure that customers babies transition from liquids to solids tantrum-free!

The Approach

The weaning event brought with it the opportunity to make use of the creative assets provided to us by mothercare. We had a good time using the colour palette and images. We made sure that the design was playful, however, we still followed the mothercare guidelines, so it was still familiar.

ecommerce landing page designThe colour palette was used in order to separate the categories on the page; orange for cleaning, yellow for highchairs, and green for feeding.

New photographs of the products were taken which brought the page to life. The colours of the products were colourful, bright, and matched the colour palette that was provided.

Mobile first

As the majority of websites are viewed on mobile devices, it was important to intentionally design the mobile layout first and let that determine the user journey. We worked with the UX team at mothercare to make sure that the design was optimised for the viewfinder without compromising on the quality of the content.

In order to reduce the scroll on the landing page, we used carousels where possible to show the products, which can be swiped left and right.

mobile landing page design

mobile landing page designCSS Animations

The design of the landing page was simple, however, I wanted to enhance the experience by using animations for the content. I made use of a jQuery plugin and animated the logo to “bob” up and down, and applied the same animation to the weaning advice boxes.

View the landing page on the mothercare website.