MG Website Redisign

A Sleek, Intuitive Shopping Experience

UI/UX Design
E-Commerce

UI/UX Design

E-Commerce

July 2024

"Madam Glam was founded with a rebellious mind and a lofty objective: to create salon-quality, carefully sourced nail and gel polishes."

Madam Glam approached us with the goal of enhancing the visual appeal and improving the overall shopping experience for their products. The existing website, having been in use for several years, had become outdated and presented usability challenges that made the shopping process less intuitive.

Our objective was to retain the core elements while updating the site to a more modern design.

homepage

The previous homepage featured two square banners in the hero section. To create a more engaging experience, Madam Glam wanted to shift to an exclusively video banner. We enhanced the banner area, introducing dynamic visuals that capture the brand's essence. Additionally, we added a section to highlight the new VIP and Elite programs, providing users with essential information right on the homepage.

To address the issues with the header, which in the old version was overly cluttered and took up half the screen on mobile devices, we streamlined its design. The new header is more compact and disappears upon scrolling, offering a cleaner and more intuitive navigation.

We also improved the menu by incorporating images and products from selected collections, allowing users to preview items before even entering the collection page.

Product presentation was a key focus area. We changed how products are displayed, particularly emphasizing the importance of showing the gel polish behind the bottle. This approach helps customers better understand the actual appearance of the product, providing a more accurate representation before they even visit the product page.

Product Page

The product pages underwent a complete redesign. Instead of simple 3D product images, we now feature a mix of visuals that showcase the gel polish both in the bottle and applied on nails.

A stock status message has been added to inform customers about product availability. We also introduced a recommendation section for similar shades and a tutorial video section, which provides specific usage instructions based on the formula.

Additionally, a banner displaying Madam Glam's retail points of sale was included to enhance customer engagement.

Collection Page

The collections page was also revamped to provide a better user experience. We reworked the collection presentation section, introduced promotional banners, and improved the filtering options, making it easier for customers to find and explore products.

Before & After

This redesign project successfully modernized Madam Glam's online presence, creating a more visually appealing, user-friendly, and intuitive shopping experience.

Next Project