Boutique en ligne
d'une librairie-cave varoise
Création de la boutique en ligne d'un commerce indépendant qui réunit librairie et cave à vin. Mission : porter en ligne l'offre du lieu physique sous forme de box livre + vin.
- E-commerce box
- Thelia 2
- Box abonnement
En un coup d'œil
- ClientDes Livres et du Vin
- Année2018
- Durée4 mois
- TypeE-commerce box
- LieuLe Rayol-Canadel-sur-Mer (83820)
- SecteurLibrairie-cave · E-commerce box
- TechnologieThelia 2
- URLwww.deslivresetduvin.com
- E-commerce box
- Thelia 2
- Box abonnement
Le brief et la problématique
Le client tient un lieu de proximité où coexistent un rayon librairie et une cave à vin orientée domaines du Sud. L'idée à porter en ligne : prolonger cette double offre par une box composée d'un livre et d'une à deux bouteilles, vendue par abonnement ou offerte en cadeau.
Cahier des charges en quatre points : un design fidèle à la boutique physique, un catalogue limité, un tunnel lisible pour un public peu familier des abonnements, un back-office tenable par le client sans profil technique.
La problématique
Faire entrer un modèle d'abonnement avec parcours cadeau différencié dans une plateforme e-commerce conçue d'abord pour la vente unitaire, sans alourdir l'exploitation quotidienne.
Objectifs du projet
- Livrer un thème front fidèle à l'identité du commerce physique
- Modéliser le catalogue pour couvrir les formules sur cadence récurrente
- Séparer le tunnel cadeau du tunnel abonnement
- Mettre en place un espace client et un paiement sécurisé
- Embarquer la mesure d'audience dès la mise en ligne
Trois défis propres à ce projet
Défi 01
Modèle box sur moteur produit-unitaire
Thelia est conçu pour vendre des objets à l'unité. Construire un produit-formule dont la valeur réside dans une promesse récurrente et un contenu changeant a demandé de poser une structure de catalogue qui rentre dans les codes natifs du moteur.
Défi 02
Deux psychologies d'achat, une seule maison
Acheter pour soi ne mobilise pas les mêmes attentes qu'offrir. Le parcours cadeau possède sa porte d'entrée propre depuis l'accueil, son tunnel dédié et une voie d'activation côté bénéficiaire. Les deux flux cohabitent sans se contaminer.
Défi 03
Autonomie d'exploitation
Le pari technique : ne pas interposer d'écran d'administration maison entre le client et son outil. La plateforme étant nativement francophone et logique pour un profil commerçant, toute surcouche aurait introduit une dépendance permanente à l'agence pour des opérations courantes. Choix d'architecture délibéré, pas une économie.
La solution mise en place
Nous avons retenu Thelia 2 pour son moteur Symfony robuste, son back-office en français et son adéquation à un catalogue court. L'effort de développement s'est concentré sur ce que la plateforme ne fait pas seule : identité visuelle, modélisation produit adaptée à l'abonnement, et hiérarchisation des parcours d'achat. La gestion produit, les commandes, les comptes clients et le paiement restent assurés par les briques standard du moteur, ce qui garantit la maintenabilité du site dans la durée et la liberté du client face aux évolutions futures.
Axe 01 · Direction artistique
Un design qui parle de proximité
Photographies du client, palette chaude, typographie éditoriale, sections ancrées en accueil (Concept, Box, Formules, Actus). Aucun habillage du marché ne portait ce ton. Le visuel s'aligne sur ce qu'un visiteur trouve en poussant la porte de la boutique physique.
Axe 02 · Catalogue
Trois formules lisibles en un écran
Plaisir, Classique, Prestige : trois cartes alignées, contenu et cadence affichés sans clic. La comparaison précède l'engagement. L'acheteur sait ce qu'il prend avant d'entrer dans le tunnel.
Axe 03 · Funnel
Quatre étapes visibles dès l'accueil
Sélection, informations, règlement, réception : la mécanique d'achat est affichée en page d'accueil. Rien n'est caché derrière le tunnel. La promesse de simplicité s'incarne dans l'interface plutôt que dans un argumentaire.
Axe 04 · Mesure
Tracking embarqué au go-live
Le site embarque dès le lancement un dispositif d'observation des comportements réels — orchestration des tags, mesure d'audience, sessions enregistrées — pour arbitrer les ajustements post-lancement sur faits plutôt que sur hypothèses.
Le sur-mesure posé au-dessus de Thelia
Au-dessus du moteur Thelia, cinq partis pris donnent au site son visage propre : une home longue ancrée plutôt qu'une arborescence éclatée, des hooks de la plateforme entièrement re-stylés, deux portes d'entrée d'achat visibles dès l'écran d'accueil, une couche d'animations légère, et un traitement éditorial du sur-mesure côté coffrets.
Ce qui a été développé
Page d'accueil ancrée monopage
Accueil, Concept, Box, Formules sont des sections ancrées d'une même page longue, plutôt que des pages distinctes. Le visiteur scrolle sans changer d'URL jusqu'à arriver au choix de formule. Le seul vrai changement de page intervient au moment où il entre dans le tunnel.
Hooks Thelia ré-habillés
Les hooks natifs (recherche, compte client, panier) sont conservés mais entièrement re-stylés pour correspondre au thème éditorial. La logique reste celle de Thelia, l'apparence reste celle de la marque.
Deux entrées d'accueil pour deux tunnels
« S'abonner à la box » et « Offrir la box » sont deux CTA visibles dès le premier écran. Chacun mène à un tunnel distinct. Une troisième porte, « J'ai reçu un cadeau », permet au bénéficiaire d'activer sa première box sans repasser par l'achat.
Animations sobres au scroll
Slick pour le carrousel formules, AOS pour les apparitions au scroll des sections concept et box. Les effets restent légers et n'entrent jamais en conflit avec la mécanique d'achat.
Composition sur appel
Les coffrets personnalisés ne passent pas par le catalogue : un encart sur la page formules invite à appeler la boutique. Une vente complexe ne mérite pas un formulaire web compliqué.
- 5partis-pris customposés au-dessus du moteur
- 2portes d'achatvisibles dès l'accueil
- 1home monopagesections ancrées, sans changement d'URL
Sous le capot
Thème Thelia compilé en assets dist
Les CSS et JS du thème sont versionnés et compilés sous /assets/frontOffice/default/template-assets/dist avec empreintes de cache dans les noms de fichiers. Les ressources sont servies en cache long sans risque de version périmée côté visiteur.
Briques front éprouvées
jQuery + jQuery UI pour les interactions, Slick pour les carrousels, AOS pour les animations de scroll, Font Awesome 5 pour les icônes. Aucune dépendance exotique. Toutes les briques sont restées maintenues et stables sur la durée du projet.
Données quantitatives et qualitatives croisées
Le dispositif d'observation combine une couche quantitative (volumes, conversions, sources de trafic) et une couche qualitative (sessions filmées). Le croisement des deux évite les conclusions hâtives tirées d'un chiffre isolé : un taux d'abandon prend sens quand on voit le visiteur hésiter sur un élément précis.
Hébergement et SSL gérés à l'année
Site servi par nginx sur infrastructure mutualisée Plesk. Certificat HTTPS, redirections gérées au niveau serveur, sauvegardes planifiées côté hébergeur. La maintenance d'exploitation reste contenue.
Le projet en images
Cinq étapes, du brief à la mise en ligne
La démarche projet suivie sur Des Livres et du Vin tient en cinq étapes successives, du cadrage initial au déploiement en production.
Étape 01
Cadrage
- Immersion sur place
- Arrêt des formules de box
- Validation du périmètre fonctionnel
- Choix de Thelia
Étape 02
Design
- Maquettes home et formules
- Charte éditoriale
- Direction artistique
- Validation graphique
Étape 03
Développement
- Thème custom Thelia
- Modélisation produit
- Séparation des tunnels
- Espace client
Étape 04
Intégration
- Fiches formules
- Page concept
- Première actu rédigée
- Contenu rédactionnel
Étape 05
Mise en ligne
- Déploiement production
- Branchement tracking
- Formation back-office
- Suivi post-lancement
Stack technique du projet
Les briques techniques mobilisées, choisies pour leur stabilité et leur maintenabilité sur la durée.
- Plateforme
- Thelia 2
- PHP / Symfony
- Éditeur OpenStudio
- Front
- Thème custom
- jQuery + jQuery UI
- Slick carousel
- AOS animations
- Font Awesome 5
- Back-office
- Thelia natif
- Hooks Search / Customer / Cart
- Mesure
- Google Tag Manager
- Google Analytics
- Smartlook
- Infra
- nginx
- Plesk
Quelques pages du site réalisé
Extrait du design livré
Les chiffres du projet
Données structurelles · www.deslivresetduvin.com
- 3formules au cataloguePlaisir, Classique, Prestige
- Bimestrielrythme d'envoiun livre + une à deux bouteilles
- 4étapes du tunnelaffichées dès l'accueil
- 2tunnels distinctsabonnement et cadeau
- 5sections d'accueil ancréesnavigation sans changement d'URL
- 3hooks plateforme restylésrecherche, compte client, panier
Quatre pôles mobilisés sur ce projet
E-commerce sur Thelia
Nous maîtrisons Thelia depuis sa version 2, ses hooks, son moteur de catalogue et son back-office. Sur des projets de catalogue court tenu par des commerçants indépendants, Thelia offre un compromis rare entre robustesse Symfony, sobriété d'exploitation et absence d'abonnement plateforme. La version 2 reste pertinente pour des sites livrés à durée de vie longue.
Voir l'expertiseDirection artistique pour commerce de proximité
Un commerçant de quartier ne se vend pas comme une marketplace. Le travail graphique consiste à transposer en ligne ce qui fait la singularité du lieu physique : visages, palette, ton, choix typographiques. Le thème devient un prolongement visuel du comptoir.
Voir l'expertiseModélisation catalogue et tunnels de vente
Faire entrer un modèle commercial non standard dans un moteur e-commerce généraliste demande de hiérarchiser ce qui sera structuré comme produit, ce qui sera structuré comme variante, et ce qui sera traité comme parcours. Cette modélisation conditionne toute la suite : ergonomie front, ergonomie back-office, lisibilité catalogue.
Voir l'expertiseAutonomie d'exploitation client
Une boutique livrée n'est pas une boutique vivante. Sur ce type de mission, nous documentons les flux d'administration courants, formons les exploitants à la prise en main et veillons à ce que la documentation officielle de la plateforme suffise au quotidien. La livraison comprend la passation, pas seulement le code.
Voir l'expertise
Vos questions, nos réponses
Une boutique en ligne sobre, pensée pour durer ?
De l'audit fonctionnel à la mise en ligne, nous accompagnons les commerçants indépendants sur des plateformes e-commerce maîtrisables dans le temps. Premier échange gratuit, sans engagement.
Réponse sous vingt-quatre heures · Devis gratuit · Sans engagement
