Zaron Cosmetics — Beauty & Cosmetics Website Redesign
Zaron Cosmetics is a premier beauty and makeup brand based in Lagos, Nigeria, specializing in manufactured lipsticks, powders, foundations, and skincare tailored for diverse skin tones. To support both physical retail and digital commerce, the platform was redesigned to overhaul user experience, introducing mobile-first accessibility, shade matching, frictionless checkout, and instant repurchase functionality.
Measureable outcomes include:
+35% Increase in Completed Orders within the first month post-launch.
+20% Boost in User Retention driven by quick reorder catalogues and guest checkout accessibility.
Significantly Improved Customer Feedback logged across WhatsApp support channels praising the mobile shopping experience and shade selection flow.
year
2026
role
Web Designer
industry
E-commerce, Beauty & Cosmetics
tools used
timeline
2 weeks
the problem
What are we Solving?
Zaron’s legacy website suffered from a non-responsive mobile layout that made navigation difficult for smartphone shoppers. The lack of a digital shade-matching tool led to user uncertainty around buying foundation or powder online. Furthermore, forced account creation, a multi-step checkout process, and the absence of purchase history catalogs resulted in abandoned carts and missed repeat orders.
research & Findings
Here’s what I found
68% of site visitors browsed from mobile devices but experienced layout breaking, slow load times, and broken interactive elements.
81% of drop-offs during checkout occurred because forced account creation added unnecessary steps before order completion.
72% of first-time buyers hesitated to complete purchases due to uncertainty over selecting the correct foundation and powder shade online.
64% of returning customers expressed frustration at having to manually search for previously purchased cosmetics instead of using a quick reorder option.
Proposed Solution
What we decided to build
A fresh, modern, and accessible e-commerce platform designed with a mobile-first philosophy, streamlined conversion funnels, and tailored shade selection features.
The redesigned UI introduces an interactive Find Your Shade tool, quick guest checkout modals, mobile-optimized megamenus, and a dedicated Buy Again catalogue. These improvements deliver an elevated visual identity while removing barriers to purchase across all device sizes.
01
Interactive "Find Your Shade" Matcher
Integrates digital shade-testing workflows directly on product pages, allowing users to match foundation, compact powders, and lip shades accurately before adding items to their bag.
02
Mobile-First Responsive Design & Navigation
Rebuilds the entire storefront with fluid mobile responsiveness, featuring clean touch targets, slide-out drawer menus, and sticky bottom navigation for seamless smartphone browsing.
03
Frictionless Guest Checkout Modal
Eliminates mandatory user registration by allowing customers to complete orders in minimal steps through a streamlined guest checkout drawer with instant delivery address inputs.
04
Personalized "Buy Again" Catalogue
Provides returning users with a dedicated order history view that enables one-click item repurchases directly from their account dashboard or navigation menu.
05
Visual Mega Menu & Categorized Browsing
Organizes extensive product catalogs—such as Makeup, Skincare, Best Sellers, and New Arrivals—into visual mega menus featuring imagery, category swatches, and quick filter dropdowns.
06
Instant Slide-Out Shopping Bag & Address Manager
Features a side-drawer shopping bag that updates real-time order totals, offers pickup station versus direct delivery toggles, and allows instant address editing without leaving the product page.
07
Beauty Journal & Editorial Content
Integrates a content-led editorial section ("Your Beauty Journal") connecting beauty tips, product recommendations, and skincare guides directly to shoppable product cards.
other UI screens
