Mobile-web homepage redesign
A mobile-web homepage redesign at one of South Africa's largest online fashion retailers - rebuilt to help first-time buyers grasp the offering, find products and convert, without losing the brand's editorial campaigns.
Executive summary
Superbalist's mobile-web conversion was sitting below the industry standard, and first-time buyers were taking too long to convert. I led the mobile-web homepage redesign - grounding it in heatmaps, scroll-depth analysis and competitor research, then building a componentised homepage that finally showed products and told the brand story. The relaunch lifted mobile conversion, time on homepage and page value, and cemented a mobile-first approach to new features.
Project context
Analytics showed our mobile-web conversion rate was lower than the industry standard. The homepage - the first impression for most new users - wasn't pulling its weight, so we set out to address the key customer problems and streamline the micro-conversions that move a first-time visitor toward their first purchase.
Role & ownership
As the UX designer on the project, I owned the research, the homepage structure and the design system behind it, working closely with product, growth, marketing and UI.
- Ran the data analysis - heatmaps and scroll-depth maps - to understand how users moved through the homepage.
- Led competitor analysis across local and international retailers.
- Built customisable wireframe components so marketing campaigns and UX best practice could coexist.
- Designed multiple layouts and ran A/B tests with product and growth.
Problem
First-time buyers took longer to convert, dragging down mobile-web conversion. The homepage didn't display a single product - users had to dig through the navigation to reach the catalogue, which made for shallow interaction and a weak first impression. New users needed to understand the value proposition, explore the offering, find products they liked and act on them, all within the short window before they decide whether to stay.
Constraints
- The homepage had to serve the marketing and brand team's editorial campaigns - their space needs, business goals and contractual obligations - alongside UX best practice.
- Campaign photography cycled monthly, so the layout had to flex around fresh creative without breaking.
- We had to introduce products and offers without pushing advertising on new users too quickly.
- The A/B test was cut short by technical circumstances, so we had to read early signals carefully.
Research & evidence
Two strands of evidence shaped the direction:
Heatmaps and scroll-depth maps showed users leaning on the navigation to reach products - shallow interaction with the homepage itself - while several existing elements took up valuable space without converting.
Local and international competitors enticed users with sub-categories and product showcases right on the homepage - a seamless storytelling experience. Ours showed no products at all, forcing users onto extra pages to see what we sold.
Key decisions
Product carousels showcase a diverse, representative sample directly on the homepage, so users grasp the breadth of the catalogue at a glance instead of guessing.
Department cards surface the less-known Kids, Men and Home + Living departments alongside the popular Womenswear, correcting the first-glance impression of what Superbalist sells.
Customisable wireframe components let the marketing and brand team build editorial campaigns within UX guardrails - brand banners diluting offers so advertising never hits new users too hard.
Key value and brand propositions - free shipping, returns, the apps - and main categories were brought into homepage content rather than buried in a carousel many users never see.
Design response
A componentised homepage that balances brand storytelling with product discovery - each block earning its place above the fold.
Impact
Even with the A/B test cut short by technical issues, the early results were positive enough to adopt the new design - and after launch we saw a meaningful increase in mobile-web conversion, higher average time on the mobile homepage, and improved page value. The project's success became part of the case for a mobile-first approach to designing new features.
Reflection
The biggest lesson was the value of frequent, agile testing with real users throughout the process - and of rapid research operations that surface concerns early, before they're baked into a build. The cut-short A/B test made that point the hard way.
It also pushed me to invest in better analytics - measuring the impact of UX changes on business metrics, and reporting them in a way the whole team could act on.