Simplicity has always been the hallmark of success for Vans, but their website doesn’t reflect that. The product is simple, the brand is iconic — the site should mirror that, not complicate it.
Vans built its brand on a unique hybridity — skateboarding shoes that transcend typical sneaker hype, crafted with simplicity and an organic community spirit. Yet, Vans.com feels outdated and cluttered, betraying the effortless unity that the brand represents. The actual job for you as a PM is to upgrade the flagship site so it mirrors the simplicity and timelessness that Vans products embody.
The stakes are clear: a poor website experience undermines customer trust and engagement, especially in a competitive retail landscape where mobile is king but desktop still commands significant attention. Vans’ website must become a seamless extension of its brand — simple, intuitive, and community-oriented.
The trap of complexity on a simple brand
Vans’ strength lies in its simplicity and craftsmanship. Customers admire the brand for its “Friends & Family” atmosphere and the effortless unity it fosters. However, the website does not reflect these values. Instead, it overwhelms visitors with too many options and counterintuitive navigation.
This is a classic product-to-website mismatch: the product promises simplicity, but the digital experience feels complex. The actual job is to strip away unnecessary options and design elements to surface what truly matters to the customer. This is not about removing features arbitrarily but about aligning digital design with brand identity and user needs.
The pattern is consistent: a brand with a strong, simple identity will lose its edge if its website is cluttered and confusing.
What simplicity means for Vans.com
Simplicity is not minimalism for its own sake. For Vans, it means:
- Clear pathways to purchase — customers should reach their desired product with minimal friction.
- Highlighting craftsmanship and community — the brand story and culture must be woven into the shopping experience.
- Reducing choice overload — too many options paralyze users, especially newcomers.
- Mobile-first but desktop-respectful — while mobile traffic is dominant, desktop users expect a rich, immersive experience.
In practice, this means the homepage and product pages should focus on key collections, featured collaborations, and the “Friends & Family” ethos that sets Vans apart.
Improving product pages without compromising integrity
Product pages are where Vans’ craftsmanship and unique hybridity must shine. The challenge is to present detailed information without overwhelming the visitor.
Key principles:
- Visual hierarchy: Use large, high-quality images that tell the product story without clutter.
- Essential information only: Material details, fit, and sizing should be concise and easy to find.
- Social proof and community: Showcase user-generated content or stories that reinforce brand values.
- Streamlined options: Limit variants to those most relevant; avoid overwhelming dropdowns or confusing filters.
This preserves the product’s integrity while enhancing user confidence and reducing bounce rates.
Goals for the website redesign
The company’s goals for the Vans website should be:
- Reflect the brand’s timeless simplicity and craftsmanship digitally. The site must feel like an extension of the product’s values.
- Enhance user experience to increase conversion and reduce drop-offs. Clear navigation and focused product pages will drive sales.
- Strengthen community engagement through digital channels. The “Friends & Family” culture can be amplified with social features and storytelling.
- Optimize for mobile without neglecting desktop users. Both experiences should be tailored but consistent.
- Create a scalable platform for future collaborations and content. The site must support organic fashion collaborations seamlessly.
Designing a user flow that highlights Vans’ USP
The user flow must prioritize the features that define Vans’ unique selling proposition: simplicity, craftsmanship, and community.
Step 1: Discover the brand story
Landing on Vans.com, users should immediately sense the brand’s ethos. This can be achieved through:
- A hero banner featuring current collaborations or campaigns that evoke community.
- Clear calls to action directing users to flagship collections or limited editions.
- Easy access to brand stories, craftsmanship videos, or “Friends & Family” events.
Step 2: Explore curated collections
Instead of overwhelming users with all products, the site should guide them through curated collections:
- Skateboarding shoes
- Apparel
- Collaborations
- New arrivals
Curated categories reduce choice paralysis and highlight what Vans is known for.
Step 3: Product detail with integrity
From collections, users land on product pages with:
- Large, clean images and zoom functionality.
- Concise product descriptions focusing on craftsmanship and materials.
- Size guides that are easy to find and understand.
- User reviews and social proof integrated subtly.
- Clear “Add to Cart” and “Wishlist” buttons.
Step 4: Community and sharing
After purchase or product exploration, users should be encouraged to engage with the community:
- Links to Vans social media channels.
- Invitations to join “The Family” newsletter or events.
- User-generated content galleries showcasing real customers.
Step 5: Checkout with minimal friction
The checkout process must be streamlined:
- Minimal required fields.
- Multiple payment options.
- Clear progress indicators.
- Easy access to customer support.
Balancing simplicity and richness: lessons from Indian e-commerce
Indian users often expect rich content but can be overwhelmed by clutter. Brands like Flipkart and Myntra balance this by:
- Prioritizing fast-loading pages with clean layouts.
- Using progressive disclosure — show essential info upfront, with optional deeper details.
- Leveraging vernacular content and localized campaigns to build community.
Vans can adopt similar tactics to respect its global brand while catering to diverse user needs.
Mobile vs desktop: why both matter
Despite mobile’s dominance, desktop remains critical for immersive brand experiences and detailed product discovery. Vans must:
- Optimize mobile for quick browsing and purchases.
- Offer richer storytelling and community features on desktop.
- Ensure consistent branding and navigation across devices.
Measuring success: key metrics for the redesign
To know if the redesign works, track:
- Bounce rate on homepage and product pages.
- Conversion rate improvements.
- Average session duration.
- Engagement with community features.
- Mobile vs desktop traffic and conversion splits.
- Analyze Vans.com homepage and product pages. Identify 3-5 key pain points that contradict brand simplicity.
- Draft a homepage wireframe that highlights Vans’ brand story and curated collections.
- Sketch a product page layout that balances detailed information with clean design.
- Map out a user flow from landing page to checkout emphasizing simplicity and community.
- List 3 success metrics you would track post-launch.
Test yourself: The Vans website redesign challenge
You are the PM leading the Vans website redesign. The current site feels outdated, cluttered, and does not reflect Vans’ brand simplicity. Mobile traffic is high, but desktop users complain about poor UI. Your CEO wants a quick fix that adds more promotional banners and product options to boost sales. Your design lead wants a minimalist redesign focusing on storytelling and streamlined navigation. You have a budget for a 3-month project.
The call: How do you balance the CEO’s demand for promotional content with the design lead’s minimalist approach and the need to preserve Vans’ brand integrity?
Your reasoning:
Where to go next
- If you want to deepen your design sense: 5 Tactics for Product Managers to Improve Their Design Sense
- If you want to master user flows and wireframing: User Flows and Wireframing
- If you want to learn e-commerce UX best practices: E-commerce UX Fundamentals
- If you want to understand brand strategy in product: Brand Strategy for Product Managers
- If you want to handle stakeholder conflicts: Managing Stakeholder Expectations