Case Study · UI/UX Design

Ecommerce
Redesign — 2024

Role
Lead UI/UX Designer
Timeline
6 Weeks
Tools
Figma · Shopify
Outcome
+34% Conversion
Scroll to read
Client
Client Name Here
Industry
Fashion / Retail
Platform
Shopify
Year
2024
Overview

The client had a product people loved. The website was killing the sale.

Describe the project context here — who the client is, what they sell, what was broken. Write it like you're telling a story to a hiring manager over coffee. What problem landed in your lap?

Keep it honest. What was the brief? What were the constraints — budget, timeline, tech stack? This section sets up the drama before you explain how you solved it.

Before — Original Design
Before: Original homepage design
The Problem

Conversion was bleeding out

Describe the specific problems you found — high bounce rate, confusing nav, weak CTA, slow load, poor mobile experience, trust signals missing. Use numbers if you have them: "bounce rate was 78%", "mobile accounted for 65% of traffic".

The Goal

A store that sells while you sleep

What was the measurable target? Increase add-to-cart rate, reduce abandonment, lift average order value, improve mobile UX score. Be specific — this shows you think like a strategist, not just a designer.


How I approached it.

01

Discovery & Audit

Walk through what you researched — heatmaps, session recordings, customer interviews, competitor analysis, analytics deep-dive. Show that you didn't just open Figma and start drawing. What did you learn that surprised you?

02

Information Architecture

How did you restructure the navigation, product hierarchy, and checkout flow? Add a before/after sitemap image or a user journey diagram here. This is where you prove you think in systems, not screens.

03

Wireframing & Rapid Iteration

Lo-fi to mid-fi wireframes. How many iterations? Did you test early with users? What did testing reveal that changed the direction? Replace with your actual wireframe screenshots below.

04

Visual Design & Handoff

High-fidelity UI, design system components, responsive layouts. How did you document it for developers? What made the handoff smooth? Mention Figma components, spacing tokens, interaction specs.

Wireframes
Design System

Final Design — Desktop
Final design — Desktop homepage
Mobile Home
Product Page
Checkout Flow

Numbers don't lie.

+34%
Conversion Rate
vs. 30-day pre-launch average
−41%
Cart Abandonment
Streamlined checkout flow
+28%
Avg. Order Value
Improved upsell placement
"Replace this with what the client actually said — or what the data showed. A specific, honest quote lands harder than a generic one. If you don't have one, describe the moment you saw the results come in."
— Client Name, Founder · Company Name

Describe what you learned. What would you do differently? What did this project teach you about design, business, or users? This is the section that separates designers who ship from designers who think.

Next Case Study
Brand Identity System →
← Back to Portfolio