Fil & Thé est un café-couture de 40 m² à Aix-en-Provence qui réunit trois activités : un salon de thé, un atelier de couture avec location de machines en accès libre et cours encadrés, et un service d’impression de patrons au format A0. Le projet demandait un site capable d’automatiser entièrement les réservations et les paiements pour limiter la gestion administrative en boutique. J’ai conçu le parcours complet et livré une maquette navigable de 21 pages, en version mobile, tablette et ordinateur.
Le parti pris de conception
Une identité chaleureuse et provençale — terracotta, sauge et lavande sur fond crème, titres en serif et touches manuscrites — pour un lieu qui doit donner envie de pousser la porte, avec un parcours de réservation aussi simple qu’une commande en ligne.
Deuxième parti pris : les règles métier sont visibles dès la maquette. Les créneaux d’accès libre affichent leur jauge de places en temps réel, les pass d’heures deviennent un solde de crédits déduit à chaque réservation, les annulations rendent automatiquement les crédits selon le délai, et le dépôt d’un patron PDF calcule le nombre de pages A0 et le prix. Côté gérantes, une « Vue Journée » pensée pour le smartphone et la tablette du comptoir centralise réservations, ateliers et impressions à traiter.
Livré
- Site vitrine : accueil, le lieu et l’équipe, carte du café, tarifs et formules, infos pratiques et contact
- Réservation d’une machine en accès libre : choix de la machine, de la date et de la durée, créneaux avec jauge de places, utilisation des crédits du pass
- Agenda des ateliers et fiche d’atelier avec places restantes et liste d’attente
- Panier et paiement Stripe (carte, Apple Pay, Google Pay), confirmation et e-mail de rappel
- Pass d’heures et abonnements, espace client avec solde de crédits et annulation en libre-service
- Impression de patrons A0 : dépôt du PDF, comptage des pages, retrait en boutique ou envoi postal
- Boutique de mercerie : catalogue avec filtres et fiche produit vendue au mètre
- Back-office : Vue Journée (mobile, tablette, ordinateur), planning et capacités des machines, gestion des ateliers, clients et crédits, commandes, stock et codes promo, réglages des tarifs et de la politique d’annulation
Technologies utilisées
- Vue 3 en application monopage, Vue Router, 21 pages avec des adresses propres
- Affichage adapté automatiquement au téléphone, à la tablette et à l’ordinateur, avec une variante dédiée par format
- Tailwind CSS avec le système de design « Terracotta & Atelier » (palette, typographies Newsreader, DM Sans et Caveat)
- Conception assistée par IA des écrans, puis conversion automatisée en composants Vue
- Architecture cible en production : WordPress, WooCommerce et module de réservation, paiement Stripe, SEO local
- Hébergement Apache / Virtualmin, HTTPS
