Vans Redesign
Overview
I led the redesign of the Vans website to align with the Canvas Design System, improving user experience, accessibility, and visual appeal. Collaborating with product, UX, and development teams, I ensured the redesign was technically feasible, consistent, and optimized for desktop and mobile. The project increased checkout conversions, avoided accessibility fines, and enhanced overall site performance.
Objective
Increase checkout conversions and improve user experience.
Ensure WCAG accessibility compliance.
Align the site with Canvas Design System standards.
Create a visually engaging and intuitive interface.
Challenges
Integrating legacy pages into Canvas while maintaining Vans’ brand identity.
Improving usability for complex PDPs, including color and size selectors.
Reducing visual clutter and consolidating typography without compromising style.
Ensuring accessibility compliance across all pages.
Approach
Evaluated the existing website to define redesign goals and identify pain points.
Conducted user research through surveys, interviews, and usability testing.
Redesigned site structure with improved navigation and user flows.
Applied Canvas components consistently across typography, color schemes, and UI elements.
Enhanced UI: increased negative space, improved selectors, and streamlined typography.
Created interactive prototypes and iteratively tested usability.
Collaborated with developers for responsive, accessible, and high-performing implementation.
Solution
Redesigned PDPs and PLPs with Canvas-aligned components and clear hierarchy.
Streamlined navigation and checkout flow to reduce friction.
Optimized interactive elements for usability and engagement.
Improved accessibility and visual clarity across the site.
Outcome
Checkout conversions from the PDP increased by 9%.
Avoided $1.2M annually in WCAG accessibility fines.
Enhanced site performance and Google rankings.
Received positive user feedback highlighting improved clarity, navigation, and visual appeal.