AppsE-commerce
LVM Shop · 2026
Une application iOS et Android qui utilise directement le catalogue, les prix et le checkout Shopify de LVM Shop, sans serveur supplémentaire à maintenir. Publication sur les stores à venir.
Étude de cas
Café Lune : un torréfacteur liégeois, du sachet jusqu'à la boutique en ligne
Un petit torréfacteur de spécialité installé à Liège, qui torréfie avant l'aube. Café Lune n'existe pas : c'est un projet mené par le studio pour montrer comment nous construisons une boutique en ligne autour d'une identité, du logo et du sachet jusqu'au bouton « Payer » sur un téléphone.
- E-commerce
- Design
- B2C
- Cadre
- Projet studio (marque fictive)
- Secteur
- Torréfaction & e-commerce
- Date
- septembre 2026
- Technologies
- Next.js 16, React 19, TypeScript, Tailwind CSS v4, Base UI, SVG, Vercel
01
La lune dit la torréfaction
Tout part d'une idée simple : chaque café est une planche céleste. La phase de lune gravée sur le sachet indique le niveau de torréfaction, de la plus claire à la plus foncée.
Un code qu'on retrouve partout
Les coordonnées imprimées sont celles de la région d'origine, et le même code lunaire sert de filtre dans le catalogue.
La palette d'une nuit qui s'éclaircit
Un noir bleuté, un blanc lait, la pierre et une touche de rouille pour les actions. Une serif fine pour les titres, une sans-serif sobre pour le reste.
Des origines réelles, des fermes inventées
Plusieurs pistes de logo ont été présentées avant de choisir. Les noms des fermes et des producteurs sont inventés et ont été vérifiés ; les régions d'origine, elles, sont réelles.
Une charte en ligne
Le logo et ses déclinaisons, la palette et ses contrastes, les typographies, les sachets et le ton de voix, réunis sur une page du site.
Voir la charte de Café Lune (nouvel onglet)
Charte en ligne : le logo et ses déclinaisons.
02
Huit sachets, un seul modèle
Les huit sachets sortent du même dessin : une teinte, une phase de lune, des notes de dégustation et des coordonnées. Ils forment une gamme, et chacun se reconnaît au premier coup d'œil.
Un nouveau café, une entrée à ajouter
On ajoute un café aux données, et son sachet, sa fiche, sa carte et son image de partage suivent.
Le packaging mis en scène
Les photos posent les sachets sur de la pierre bleue et de l'enduit à la chaux, dans la lumière du petit matin.
Les sachets : la phase de lune indique la torréfaction. Fiche produit : format, mouture et prix recalculé.
03
Une boutique qui explique sans presser
Les clients visés ont entre 25 et 50 ans, préparent leur café à la maison et veulent comprendre ce qu'ils achètent. Le site les vouvoie, explique sans jargon, et n'affiche ni faux avis ni compteur d'urgence.
Un catalogue qu'on filtre
Par usage, torréfaction, origine et procédé. Chaque fiche recalcule le prix en direct selon le format et la mouture.
Un abonnement guidé
Trois questions, sur la méthode, les goûts et le rythme, mènent à une proposition de café, avec le prix par envoi et par mois.
Des guides de préparation
Cinq méthodes, avec un calculateur de doses et un minuteur pas à pas.
Catalogue filtrable par phase de torréfaction. L'abonnement guidé.
04
Une commande pensée pour le pouce
Une bonne part des clients commande depuis son téléphone. La commande tient donc en trois étapes : coordonnées, livraison, paiement.
Le panier toujours sous la main
Un tiroir avec code promo, la livraison offerte à partir d'un seuil, et le choix entre point relais et domicile.
La TVA belge détaillée
6 % sur le café, 21 % sur le matériel, affichés clairement avant de payer.
Un paiement honnêtement simulé
C'est une démo : aucun champ de carte, et l'écran final dit clairement qu'aucun paiement n'a été effectué.
Le tunnel de commande sur mobile.
05
Le résultat
Une boutique peut avoir l'allure d'une marque de caractère sans perdre en vitesse ni en clarté. Voici les mesures relevées sur le site en ligne.
96–99
Performance sur mobile
100
Accessibilité
0
Décalage au chargement (CLS)
Mesures Lighthouse (mobile, 4G simulée) sur l'accueil, le catalogue, une fiche café, la commande et la charte.
Accessible jusqu'au paiement
Les règles WCAG 2.2 AA sont respectées : 42 états du site audités sans aucune violation, tiroirs et commande compris. Les ajouts au panier et les changements de prix sont annoncés aux lecteurs d'écran.
Des prix calculés sans erreur
Formats, abonnement, code promo, TVA et livraison : chaque calcul est vérifié par des tests automatiques.
Notre expertise
Sites web
Des sites vitrines et des boutiques en ligne sur mesure : rapides, soignés sur tous les écrans, accessibles, et que vous pouvez faire évoluer sans tout reconstruire.
Questions fréquentes
Questions sur Café Lune
Ce que l'on nous demande à propos de ce projet.
Café Lune existe-t-il ?
Non. C'est un projet studio, une marque imaginaire créée pour montrer notre travail d'identité et de boutique en ligne sur un cas complet. La boutique est en ligne et se visite ; le paiement y est simulé.
Qu'est-ce que le studio a créé pour ce projet ?
Le nom, le logo, les huit sachets, la palette, les typographies, la charte en ligne, les photos produits et la boutique complète : catalogue, abonnement, guides et commande.
Peut-on proposer un abonnement sur une petite boutique ?
Oui. Ici, trois questions suffisent pour proposer le bon café et afficher le prix par envoi et par mois. Le principe vaut pour tout produit qu'on rachète régulièrement.
La boutique est-elle rapide sur téléphone ?
Oui : 96 à 99 en performance mobile dans Lighthouse selon les pages, et aucune page ne bouge pendant le chargement.
Comment la TVA est-elle gérée ?
La TVA belge est détaillée dans le panier : 6 % sur le café, 21 % sur le matériel. Le client voit le total exact avant de payer.
Ce type de boutique convient-il à mon commerce ?
Oui, si vous vendez à une clientèle qui aime comprendre ce qu'elle achète : café, thé, vin, cosmétiques, épicerie fine. La méthode reste la même : une identité forte, puis une boutique simple à utiliser sur téléphone.
IADesignHoreca & IA · 2026
Un assistant IA raconté de bout en bout : scénario, dialogues, voix synchronisées, interface animée, son et site de présentation, sans un seul faux chiffre.
DesignWebBrasserie & horeca · 2026
Une marque créée de zéro et déclinée jusqu'au site, qui reste rapide et accessible : Lighthouse mobile 96 à 97 en performance, 100 en accessibilité et en bonnes pratiques.