
Maquette Website — Passion Squash
La Maison du Squash
Passion Squash est un projet de site e-commerce dédié au squash, conçu pour La Maison du Squash. L'objectif était de créer une boutique en ligne moderne et performante proposant une large gamme de matériel et de vêtements adaptés à tous les niveaux de jeu, avec commande en ligne, livraison à domicile ou retrait en club local.
Contexte du projet
La Maison du Squash souhaitait développer sa présence en ligne avec un site e-commerce capable de rivaliser avec les grandes enseignes sportives. Le défi était de concevoir une expérience d'achat intuitive, adaptée à une clientèle allant du débutant au joueur compétitif, tout en mettant en valeur l'expertise de la boutique physique.
Conception du design system
J'ai créé un design system complet composé de 16 composants réutilisables sur Figma : barre de navigation, grille de catégories, étiquettes produit (marque, niveau, promotion), boutons d'action, sélecteurs de taille, de couleur et de quantité, cards produit et éléments de pagination.
Ce design system garantit une cohérence visuelle sur l'ensemble du site et facilite l'évolution future de l'interface. Chaque composant a été pensé pour s'adapter aux différentes tailles d'écran (responsive design).
Architecture des pages
Le site a été maquetté dans sa totalité, couvrant l'ensemble du parcours utilisateur :
- ▸Page d'accueil : mise en avant des catégories phares, promotions et nouveautés
- ▸Catalogue produits : filtrage par catégorie (Vêtements Femmes/Hommes/Enfants, Chaussures, Bagageries, Raquettes, Balles, Accessoires), tri et pagination
- ▸Fiche produit détaillée : visuels haute qualité, tags (marque, catégorie, niveau de jeu), prix, sélecteurs taille/couleur/quantité, description complète et caractéristiques techniques
- ▸Connexion et inscription : formulaires ergonomiques avec validation
- ▸Panier : tableau récapitulatif avec gestion des quantités, champ code promo, calcul automatique des frais d'expédition
- ▸Tunnel de paiement : processus en 2 étapes avec intégration PayPal
- ▸Confirmation de commande : récapitulatif et suivi
- ▸Blog : articles sur le squash, conseils d'équipement et actualités
Développement WordPress et WooCommerce
Le développement technique a été réalisé sous WordPress avec WooCommerce, permettant une gestion autonome du catalogue par le client. J'ai configuré les extensions nécessaires pour le paiement en ligne, la gestion des stocks et le calcul des frais de livraison.
La formation LiveMentor m'a permis d'acquérir des compétences avancées en création de sites e-commerce WordPress, rendant le site plus accessible, ergonomique et optimisé pour le référencement naturel.
Compétences développées
- ▸Conception d'un design system complet et scalable
- ▸Maquettage UI/UX d'un parcours e-commerce de A à Z
- ▸Développement et configuration WordPress / WooCommerce
- ▸Responsive design et accessibilité web
- ▸Gestion d'un projet de A à Z : du brief client à la mise en ligne
Outils utilisés
Figma, WordPress, WooCommerce, Adobe Photoshop, plugins WordPress (paiement, shipping, SEO).