From outdated to trust-building online store
Ludmilla Ramos
|
Web Designer
Ragatex
|
2018
Project Overview
Before the redesign, Mocca Sant’s website looked dated, lacked credibility, and didn’t reflect the craftsmanship of its products. After rethinking the brand identity, structure, and visuals, the site became a polished showcase that impressed visitors, built trust, and supported off-site sales through a professional, user-friendly experience.
Impact
→ Full rebrand
Developed a distinctive visual identity, colour palette, logo, and brand tone to position a centuries-old shoemaker as a premium, credible e-commerce brand.
→ Structured for trust and easy product discovery
Created sitemap, mega-menu navigation, and product category hierarchy to streamline browsing and highlight hero products.
→ Compliant and ready for European markets
Designed and implemented GDPR-compliant pages and policies, ensuring legal transparency and building user confidence.
→ Optimised template for brand and market fit
Selected and customised a Prestashop theme to maximise visual appeal, product focus, and scalability for resale via flash sales platforms.
→ Replicable framework for multiple brands
Store structure, category taxonomy, and content strategy were later adapted to other brand projects, reducing setup and onboarding time.
Problem-Solving
A store no one would trust with their credit card
When I joined the project, Mocca Sant’s online store was in bad shape. It didn’t reflect the heritage or quality of the shoes, and it failed to connect with its style-conscious European audience. The brand felt outdated, navigation was clunky, and there were no trust signals or legal compliance in place.
To make things trickier:
Purchases happened off-site on flash sales platforms, so the website had to sell the brand, not the product directly.
The experience wasn’t optimised for discovery or for gathering user insights to guide future decisions.
Goals
Strategic vision:
Trust first, sales second
The goal was to turn Mocca Sant’s site into a confidence-boosting brand touchpoint — one that made visitors think “this brand is the real deal” before clicking through to buy elsewhere.
We needed to:
Elevate the brand’s look and feel to match its craftsmanship.
Make it competitive with other high-quality footwear sites.
Build a scalable framework that could be reused for 4–5 other brands.
Challenges & Constraints
Tight scope, big ambitions
The situation was a bit like designing a luxury store inside a rented shopfront.
Locked into Prestashop: improvements had to happen within the limits of a chosen template.
No in-house dev team: every solution had to be efficient and budget-friendly.
Minimal user data: we relied on competitive benchmarking and a proto-persona to guide design.
Replicability requirement: the approach had to work again, fast, for multiple brands with the same structure.
The Process
From market scan to brand glow-up
We knew Mocca Sant’s online presence wasn’t hitting the right note. It looked dated, felt generic, and didn’t carry the premium edge needed to compete in the luxury footwear space.
To get a clearer picture, I ran a competitive benchmark — reviewing competitor websites for colour palettes, typography, and overall brand and web design styles. This gave me a feel for how the high-end players presented themselves and where Mocca Sant could stand out.
Alongside this, I spoke with the team to understand their customers’ preferences and values. From these conversations, I created a proto-persona — a working profile of our ideal customer — to guide branding and design decisions toward a more polished, credible, and competitive look.
Shaping the brand’s new look
So, it became clear how the company envisioned its place in the market — even if the approach leaned more on marketing goals than user-centred research.
This perspective shaped the foundation of the visual identity: an elegant, modern-yet-traditional style that echoed the craftsmanship of the shoes while signalling credibility and premium quality. The goal was to balance heritage with a contemporary appeal that would feel at home in the luxury segment.
A vision came to life
With no research budget (and AI still just a buzzword back then), I relied entirely on UX best practices to create a functional, seamless sitemap.
The customer journey was crucial — not just for design direction, but as a clear blueprint to show the CEO, e-commerce team, and IT managers exactly where the website fit into the bigger picture. It helped us understand what users would likely prioritise when landing on the site, and how to design for that purpose.
From there, the concept was straightforward: visuals first, products second. The goal was to impress at first glance and earn trust through aesthetics and usability. That meant high-quality imagery, elegant navigation, payment acceptance flags, GDPR compliance (terms, privacy policy, cookies banner), and an overall professional look — much like the shoes themselves: crafted, refined, and built to last.
Homepage idea to this online store.
The original brand name was modified.
I selected a flexible Prestashop theme that could be adapted for other brand sites without looking identical, while keeping the same core principles: visual impact and trust as the main drivers.
Looking back, starting forward
This project wasn’t glamorous — the website existed more as a trust anchor than a true sales channel — but it was the first time I truly connected branding, design, and marketing into one experience. Working within tight constraints, I learned that a website is never “just a template.” It’s a system that requires strategy, structure, and a user perspective to meet business goals. Today, I see the flaws in that early work, but also recognise it as the moment I stopped treating design as a hobby and began building my career for real.
