Syed’s Boutique

Project overview

Syed’s Boutique is a UK-based fashion brand that blends timeless eastern aesthetics with contemporary web experiences. When they approached me, their digital storefront needed a serious transformation. It lacked polish, didn’t align with their premium fashion identity, and was underperforming in both conversions and mobile responsiveness.

Client:

Syed’s Boutique

Platform:

WordPress + WooCommerce

Industry:

Eastern Wear (Pakistani/Indian)

Location:

United Kingdom

Role:

UI/UX | Frontend Dev | Performance | Branding

Visit Project:
The Challenges: 
  • The site had no consistent branding, poor typography, and a dated layout.

  • Customers struggled with product discovery and a cluttered checkout process

  • The product images and offers weren’t being showcased effectively.

  • Over 70% of traffic came from mobile, but the site wasn’t optimized for it.

  • The site lacked scanning-friendly design, filtering options, and smart categorization.

The goal: 

  • Develop a smooth and cohesive eCommerce journey

  • Craft visually engaging and appealing designs

  • Connect with the South Asian diaspora audience

  • Focus on usability and intuitive user experience

  • Optimize for mobile-first accessibility and performance

Approach

Discovery & Strategy

I started by understanding the brand—its tone, customer base, and values. I ran a UX audit to identify pain points across the funnel (homepage → product → cart → checkout) and analyzed heatmaps, bounce data, and session recordings from their old site.

Key Takeaways:

  • Their audience is highly visual.

  • Trust and ease of use are crucial to conversion.

  • Mobile-first design is non-negotiable.

Low-fidelity wireframes ensured clarity in content hierarchy. Once approved, I moved to high-fidelity mockups.

Design System & Wireframes

I crafted a clean, culturally inspired design system using:

  • Primary Palette: Deep maroons and golds (luxury + tradition).

  • Typography: Sophisticated serif headers with crisp sans-serif body text.

  • Grids & Spacing: Breathable layout for high-end appeal.

  • Component Library: Reusable cards, modals, product tiles, badges, and size selectors.

Development

Built using WordPress + WooCommerce:

  • Elementor Pro for custom section building with lightweight design.
  • Custom Product Filtering based on category, fabric, price, and color.
  • AJAX-enhanced Add to Cart and Quick View features.
  • Custom single-product templates to highlight embroidery or fabric detail.
  • SEO-rich product pages with clean URL structures and schema markup.

Performance & Optimization

  • Lazy Loading + compressed image delivery via WebP.
  • Cloudflare CDN for global delivery and page speed.
  • GTmetrix Score: A (98 Performance | 100 Structure)
  • Mobile Core Web Vitals: Passed across all thresholds.
  • Clean minimal JS and deferred non-critical scripts.

Final Outcome

The final site is an elegant blend of culture and conversion. Visitors are greeted with a bold, immersive hero section showcasing their latest arrivals. Navigation is frictionless, with mobile-first accessibility at the core. Every collection, be it Lawn, Embroidered, or Luxury Pret, is positioned to drive engagement and trust.

Mobile First, Emotion Driven.

The website mirrors the boutique experience—personal, curated, and intentional.

Key Features

  • Custom Mega Menu with image-rich dropdowns
  • Location-based shipping estimator
  • Personalized WhatsApp shopping CTA for UK & EU customers
  • Review section and size guide on each product page
  • Back-in-stock notifications and wishlist

📱 Responsiveness & Accessibility

  • Responsive Design: Ensured seamless adaptation across devices
  • Accessibility: Used high-contrast color combinations, readable fonts, alt-text, and logical tab flow for keyboard users

Technologies Used:

  • Frontend: HTML5, CSS3, JavaScript (vanilla), Elementor Pro
  • Backend: WordPress CMS, WooCommerce
  • Performance Tools: Cloudflare, WP Rocket, ShortPixel
  • SEO: RankMath, Schema, Custom Meta Automation

Thank you for viewing my project. I’d love to hear your thoughts or answer any questions you may have. Feel free to reach out!

Contact Me

Whether you’re curious about my work, want to discuss a project, or just say hello—I’d love to hear from you. Let’s connect and create something great together.