Mode nuit étoilée

Horiot Studio · version texte

Une personne, des produits sur mesure, avec l’IA comme partenaire de réflexion.

  1. anchor

    À propos

    Studio indépendant fondé en 2026, une seule personne, l'IA comme levier concret, livraison rapide sans rien lâcher sur l'exécution.

    Horiot Studio est un studio digital indépendant, fondé en 2026. Une seule personne en face, l’IA utilisée comme un vrai levier de production, pas comme un argument, et des projets livrés plus vite sans rien lâcher sur l’exécution ni sur le design.

    Le studio

    Une structure volontairement légère : une personne, une relation directe, pas d’intermédiaires. Chaque projet est traité avec le même niveau d’exigence, du cadrage à la livraison, qu’il s’agisse d’un module sur mesure en deux semaines ou d’une plateforme complète sur plusieurs mois. Selon les projets, je m’entoure d’expertises complémentaires pour mobiliser les bonnes compétences sans alourdir la structure.

    Le parcours

    Développeur et designer depuis plus de 10 ans, j’ai travaillé sur des dizaines de projets digitaux, dont plusieurs années chez Murdeau où j’ai couvert à la fois le développement et le design. J’ai lancé Horiot Studio en 2026 pour porter cette approche en indépendant, tout en continuant à accompagner Murdeau comme partenaire externe.

  2. anchor

    Approche

    L'IA comme levier concret, pas comme argument marketing.

    L’IA comme levier

    L’intelligence artificielle n’est pas un argument marketing, c’est une partie concrète de la façon de travailler : explorer plus de solutions, prototyper vite, structurer la technique, automatiser, développer des outils et des intégrations.

    Comment ça se passe

    01 · Tu m’écris. Un email direct, pas un formulaire. Le problème, la contrainte de temps, le budget même flou.

    02 · On cadre. Un appel pour aligner objectifs, usages et périmètre. Je reformule jusqu’à ce qu’on soit d’accord sur le problème, avant la moindre ligne de code.

    03 · Une proposition, dans un espace privé. Pas un devis PDF : une proposition en ligne, protégée par mot de passe, où le cadrage, le plan et le prix sont au même endroit, chaque section avec son espace de retours. Pour un projet frontend, quatre directions de design ; pour un projet plus large, souvent une démo. On décide sur du concret. Cet espace est un outil que je construis et maintiens : Proposals, avec une démo ouverte (code d’accès atelier).

    04 · J’implémente jusqu’au live. Le code, puis la copie, ajustés jusqu’à ce que tu sois content.

    Ce que je développe

    Plateformes & outils métiers. Sites, configurateurs, back-offices, outils internes, pour les marques qui ont besoin d’un système, pas juste d’une page.

    E-commerce sur mesure. Shopify et au-delà : sections, modules, intégrations qui s’insèrent dans une boutique existante.

    Expériences & lancements. Landings éditoriales, scrollytelling, pages de marque qui portent un moment fort.

  3. anchor

    Clients

    Projets réalisés en collaboration avec des marques et entreprises, avec aussi quelques chantiers déjà en perspective.

    Une sélection de projets réalisés pour des clients, du cadrage à la livraison.

    Chaque projet est traité avec le même niveau d’exigence, peu importe la taille de l’engagement : un module sur mesure en deux semaines et une plateforme complète sur plusieurs mois reçoivent la même attention au détail.

    Trois relations, trois formes de projet

    Murdeau, fabricant breton d’un système breveté de récupération d’eau de pluie modulaire. Plusieurs années chez eux comme développeur et designer avant le studio, et une collaboration qui continue aujourd’hui comme partenaire externe : un e-commerce complet et un configurateur 3D à trois modes, tunnel Stripe, devis pré-remplis et back-office métier.

    BA111OD, marque horlogère indépendante. Trois chantiers en parallèle : un outil de vente interne utilisé chaque jour par l’équipe commerciale, un ensemble de sections Shopify sur mesure, et une expérience de lancement pour la Chapter 4 · Tourbillon T.V.D.

    L’atelier des choix, cabinet de coaching et de mentoring à Neuchâtel. Un site éditorial d’une page, pensé comme un manifeste et entièrement pilotable par la cliente.

    Des clients en France et en Suisse, des projets qui vont de l’outil métier à la page de marque, et à chaque fois la même façon de travailler : un cadrage précis, une proposition en ligne, puis l’implémentation jusqu’au live.

    Et ensuite

    Aux côtés des projets déjà livrés, quelques refontes et extensions sont aussi en train de se dessiner pour les mois à venir. Le prochain chantier envisagé côté Murdeau, par exemple : une webapp en réalité augmentée pour placer une configuration à l’échelle dans son propre jardin.

  4. anchor

    Atelier

    Projets personnels et expérimentations.

    L’atelier est l’espace où je construis pour moi : des outils que j’utilise au quotidien, des expérimentations techniques, des idées qui n’ont pas encore trouvé leur place ailleurs. C’est aussi là que je teste des approches avant de les proposer aux clients. Ce qui fonctionne finit par remonter dans le travail client.

    Ce qu’il y a dedans

    Proposals. Le portail privé où mes prospects reçoivent leur proposition : versionnée, commentable, avec le devis à l’écran et en PDF depuis la même source. Construit pour mon usage, devenu l’étape 03 de ma façon de travailler. Démo publique, code d’accès « atelier ».

    Démos. Cinq configurateurs génériques à essayer sans compte, un par métier : carport et pergola, portail et clôture, cave à vin enterrée, escalier sur mesure, piscine conteneur. 3D et plan technique, prix en direct, demande de devis simulée. Ce que je mets entre les mains des fabricants avant le premier appel, plutôt que de le décrire.

    Vault Tools. Plus de quarante outils de traitement de fichiers qui tournent entièrement dans le navigateur grâce à WebAssembly. Aucun fichier ne quitte la machine.

    Cold Star. Un jeu incrémental de science-fiction pour le navigateur, en Rust compilé en WebAssembly. Le projet le moins raisonnable de la liste.

    Pourquoi le montrer

    Un portfolio client montre ce qu’on a livré. L’atelier montre ce qu’on sait faire quand personne ne cadre le brief : les choix techniques, le niveau de finition, ce qu’on maintient dans la durée sans y être obligé.

  5. anchor

    Contact

    Un projet en tête ? Décris-le brièvement, je reviens vers toi sous 24h.

    Un projet en tête ? Décris-le brièvement et je reviens vers toi sous 24 heures.

    Écrire à [email protected].

    Pas de formulaire de contact, un email direct est plus honnête. Mentionne dans ton message :

    • le problème que tu essaies de résoudre
    • la contrainte de temps (si elle existe)
    • le budget approximatif (même très flou)

    Je réponds à tout le monde, même pour dire non. Les réponses arrivent généralement sous 24 heures ouvrées.

    Ce qui se passe ensuite

    Un appel pour cadrer : objectifs, usages, périmètre. Je reformule jusqu’à ce qu’on soit d’accord sur le problème, avant la moindre ligne de code. Puis une proposition dans un espace privé en ligne, avec le cadrage, le plan et le prix au même endroit, et un espace de retours par section. Le déroulé complet est décrit dans l’approche, et les questions qu’on se pose avant un premier appel ont leurs réponses dans la FAQ.

    Pour quel genre de projet

    Trois grandes formes : des plateformes et outils métiers (sites, configurateurs, back-offices), de l’e-commerce sur mesure (Shopify et au-delà, des modules qui s’insèrent dans une boutique existante), et des expériences de lancement (landings éditoriales, scrollytelling, pages de marque). Les projets clients donnent une idée concrète de chacune.

    Le studio est basé à Quimper, en Bretagne, avec des clients en France et en Suisse.

  6. project

    Murdeau

    Fabricant breton d'un système breveté de récupération d'eau de pluie modulaire. Collaboration longue durée sur leur e-commerce et configurateur 3D, avec de nouveaux chantiers déjà envisagés.

    Murdeau

    Murdeau fabrique en Bretagne, depuis 2009, un système breveté de récupération d’eau de pluie « modulaire & intelligent », des réservoirs aériens empilables, sans terrassement, durables et recyclables. « Pas de terrassement, pas de bitume à enlever », pour reprendre la phrase du site lui-même.

    C’est un produit industriel structurellement complexe : trois modules de base, une modularité sans limite, des configurations qui dépendent de la surface de toiture, du volume d’eau visé, et de l’espace disponible chez le client. Les outils e-commerce généralistes sont inadaptés dès qu’on essaie d’exprimer « plusieurs configurations avec des géométries différentes » pour le même besoin.

    La collaboration

    J’ai travaillé plusieurs années chez Murdeau, en tant que développeur et designer, avant de lancer Horiot Studio. Je continue aujourd’hui à travailler pour eux comme partenaire externe, une relation de confiance construite sur la durée, avec une connaissance profonde du produit et de ses contraintes techniques.

    Prochain chantier envisagé : une webapp en réalité augmentée pour placer une configuration à l’échelle dans son propre jardin, et rendre l’encombrement réel du système tangible avant l’achat.

  7. project· maintenu

    Murdeau · E-commerce & Configurateur 3D

    Site e-commerce complet et configurateur 3D à trois modes pour le système breveté de récupération d'eau de pluie modulaire : tunnel Stripe, devis pré-remplis et back-office métier (inventaire, commandes, distributeurs).

    Contexte

    Le site Murdeau existant ne tenait plus, ni la vitrine, ni la mécanique commerciale derrière. Un produit structurellement complexe (trois modules, une modularité sans limite, trois façons d’arriver à une configuration), et une équipe qui gérait l’inventaire, les commandes et le réseau de distributeurs à coups de tableurs et d’emails.

    Le projet remplace le site par une plateforme complète : vitrine, configurateur 3D propriétaire, tunnel e-commerce Stripe et back-office métier, sur www.murdeau.bzh.

    Le configurateur : trois portes d’entrée

    Le cœur du projet. Le configurateur ne part pas d’un catalogue à feuilleter, il part du problème du client. Par besoin : surface de toiture, pluviométrie, usages, et une « capacité recommandée avec justification ». Par volume cible : plusieurs géométries pour l’atteindre. Par contrainte d’espace : les solutions viables classées par capacité, et si rien ne rentre, il le dit.

    Écran d'accueil du configurateur Murdeau, choix entre les trois modes d'entrée
    L'entrée du configurateur, trois portes selon la question que se pose le visiteur.

    Les trois modes convergent vers un builder 3D qui rend la configuration, calcule le prix, liste modules et accessoires, puis bascule vers le panier ou vers un devis pré-rempli selon la complexité du projet.

    Sous le capot, le moteur encode les règles physiques du produit : socle 100 L obligatoire en pied de colonne, 1 600 L et 3,90 m maximum par colonne, toutes les colonnes à la même hauteur parce que l’eau s’équilibre entre modules connectés. Il explore les dispositions en grille, note chaque candidat, et déduit de la géométrie le nombre de kits de jonction nécessaires.

    Vue builder 3D du configurateur, configuration en cours avec liste des modules et prix
    Le builder, point de convergence des trois modes, où la configuration prend forme.

    Du configurateur à l’opération

    Pour les configurations standards, un checkout Stripe complet : paiement, facture, accusé de commande, date de livraison estimée. Pour les projets atypiques, un devis structuré, déjà pré-rempli avec la configuration retenue : la conversation commerciale reprend là où le configurateur s’est arrêté.

    Côté Murdeau, un back-office unifié remplace les tableurs : inventaire par module avec alertes de seuil, commandes Stripe et devis signés dans une vue unique, distributeurs géolocalisés pour router chaque prospect vers le plus proche, et un tableau de bord d’activité. Le configurateur attire et qualifie, l’e-commerce encaisse, le back-office opère.

    Back-office Murdeau, vue d'ensemble des commandes, de l'inventaire et des indicateurs d'activité
    Le back-office, point unique de pilotage des stocks, des commandes et du réseau de distributeurs.

    Le même principe, en version générique et ouverte à l’essai, est devenu le configurateur carport & pergola de l’atelier.

    www.murdeau.bzh →

  8. project

    BA111OD

    Marque horlogère indépendante. Collaboration longue durée autour d'un outil interne, d'une expérience de lancement et d'un ensemble Shopify sur mesure.

    BA111OD est une marque horlogère indépendante fondée sur un positionnement fort : des montres mécaniques taillées pour une génération qui refuse les codes classiques de la haute horlogerie.

    Collaboration longue durée, plusieurs chantiers en parallèle, à la fois sur l’interne (un outil de vente utilisé chaque jour par l’équipe commerciale) et l’externe (Shopify, modules éditoriaux, landing de lancement produit).

    Trois chantiers

    L’app commerciale. Une PWA interne sur invitation, posée sur Next.js 15 et Cloudflare Workers, qui remplace un flux Excel, email et PDF à la main par un seul écran de travail : catalogue, partenaires aux tarifs différenciés par pays, commandes, confirmations PDF brandées, agenda des salons, statistiques. Trois rôles appliqués côté serveur (admin, sales, PR). Le MVP est utilisé quotidiennement par l’équipe, et les ajouts suivants sont venus de l’usage réel plutôt que du cahier des charges initial.

    L’ensemble Shopify. Pas une section isolée mais un système de briques sur mesure qui vivent dans l’éditeur du thème : une page produit plus éditoriale, nourrie par les metafields, des modules frontend (badges de réassurance, footer de marque) et une section hotspots pour ancrer des points interactifs sur une image éditoriale de la montre.

    Le lancement de la Chapter 4 · Tourbillon T.V.D.. Une page de révélation au scroll, en chapitres, sobre et premium, intégrée à l’écosystème de la marque pour être publiée et exploitée par l’équipe. En ligne sur ba111od.com.

    Ce que ça dit de la collaboration

    Un outil métier, une boutique et une expérience de lancement, pour la même marque : c’est le genre de relation où l’on connaît le produit assez bien pour proposer avant qu’on demande, et où chaque chantier profite de ce que le précédent a appris.

  9. project· maintenu

    BA111OD · App commerciale

    PWA interne sur invitation pour l'équipe BA111OD (catalogue, partenaires, commandes, PDF brandés, agenda salon et statistiques). Posée sur Next.js 15 et Cloudflare Workers.

    Contexte

    BA111OD Sales est une Progressive Web App interne sur invitation, utilisée chaque jour par l’équipe pour préparer les commandes des détaillants, piloter l’agenda des salons et suivre l’activité. Équipe restreinte, desktop-first, interface en anglais.

    Le point de départ : un catalogue complexe, des partenaires aux tarifs différenciés par pays, et des confirmations de commande produites à la main dans un flux Excel + email + PDF. Aucun outil du marché ne rentrait dans les contraintes sans compromis sur la personnalisation ou le coût.

    Un seul écran de travail

    Trois rôles appliqués côté serveur sur chaque route (admin, sales, et un rôle PR limité à l’agenda), pas d’inscription libre, aucune page commerciale exposée publiquement.

    Le catalogue s’importe depuis un export CSV Shopify : prévisualisation, erreurs et warnings, puis synchronisation. Les SKUs absents sont désactivés, jamais supprimés, et les commandes passées restent intactes. Les fiches affichent le prix payable en CHF et le prix retail selon le pays du partenaire, avec recherche par SKU ou nom et filtres par chapitre.

    Catalogue de l'app BA111OD Sales, recherche par SKU ou nom, filtres par chapitre, sélecteur de devise, cartes produit avec prix CHF et bouton Add to Order
    Le catalogue, point d'entrée quotidien : chapitres filtrables, devise commutable, ajout à la commande en un clic.

    Une commande peut être amorcée avant qu’un partenaire soit attribué, complétée plus tard, réouverte à tout moment. Elle sort en PDF brandé BA111OD, partageable directement depuis l’app.

    Ce que l’usage a ajouté

    Le PRD cadrait le MVP. Depuis, l’usage réel de l’équipe a fait émerger un second cercle, livré itérativement : un agenda salon en vue semaine (créneaux reprogrammables au drag-drop, statuts confirmé / à confirmer / no-show, couleurs par type de rendez-vous), des statistiques d’activité par période et par partenaire, et un onglet feedback avec changelog intégré et fil de notes partagé.

    Agenda salon de l'app BA111OD Sales, vue semaine du calendrier avec bascule PR Agenda / Retailer Agenda, navigation par semaine et bouton New Event
    L'agenda salon en vue semaine : bascule entre PR et retailer, créneaux modifiables au drag-drop, jour courant mis en valeur.

    Les ajouts post-PRD viennent de l’usage, ce qui est, honnêtement, le meilleur indicateur qu’on a shippé la bonne première version.

    Architecture

    Next.js 15 (App Router) en TypeScript, déployé sur Cloudflare Workers via OpenNext, Postgres managé pour les données, stockage objet pour les PDF. Les autorisations s’appliquent au plus près des données, pas seulement dans le code applicatif. Une revue de sécurité interne (code, déploiement, auth, dépendances) fait partie du cycle de livraison.

  10. project· livré

    BA111OD · Shopify

    Ensemble des sections Shopify sur mesure développées pour BA111OD, de la page produit aux modules éditoriaux réutilisables.

    Contexte

    Chez BA111OD, le travail Shopify ne se limite pas à une seule section. Il s’agit d’un ensemble de briques sur mesure pensées pour faire évoluer l’expérience de marque directement dans le thème : page produit, modules éditoriaux, zones interactives.

    Ce qui a été développé

    Un socle Shopify plus cohérent. L’objectif était de sortir des blocs standards pour construire un langage plus aligné avec la marque, plus précis dans le rythme, et plus souple côté édition.

    Des sections pensées pour durer. Chaque module est conçu pour vivre dans l’éditeur Shopify, être réutilisé, déplacé et ajusté sans repartir de zéro.

    Une logique produit + contenu. Le travail ne porte pas seulement sur la fiche produit : il relie aussi les éléments éditoriaux autour de la montre, pour que l’expérience reste homogène d’une page à l’autre.

    Sous-projets Shopify

    • Product section : refonte de la section produit principale, avec galerie, lecture des variantes et contenu enrichi
    • Frontend sections : modules éditoriaux complémentaires pour prolonger l’identité BA111OD dans le thème
    • Hotspots : section interactive permettant d’ancrer des points d’intérêt directement sur une image

    Résultat

    Un ensemble Shopify plus mature, plus éditorial, et surtout plus cohérent, où les différentes sections peuvent fonctionner comme un vrai système plutôt que comme des blocs isolés.

  11. project· livré

    BA111OD · Section produit

    Section produit Shopify sur mesure pour BA111OD, une mise en page plus éditoriale, enrichie par les données produit et les metafields.

    Contexte

    La page produit demandait plus qu’un template e-commerce classique. Il fallait mieux présenter la montre, mieux hiérarchiser les informations, et donner à la lecture un rythme plus fidèle à l’univers BA111OD.

    Ce qui a été construit

    Une section produit repensée comme une vraie expérience. La composition articule galerie, panneau produit, variantes, contenu de marque et appels à l’action dans un ensemble plus maîtrisé.

    Une lecture enrichie par les données produit. La section va chercher automatiquement le titre, les images, le prix, les variantes et plusieurs informations issues des metafields pour nourrir la page sans ressaisie.

    Un contenu plus vivant. Spécifications en accordéons, produits liés, disponibilité, options de paiement, vidéo, description et barre CTA mobile : tout est pensé pour garder une page dense mais lisible.

    Ce que ça change

    La page produit n’est plus une simple fiche. Elle devient un espace qui vend mieux la montre, tout en restant administrable depuis Shopify.

  12. project· livré

    BA111OD · Sections frontend

    Petites sections Shopify sur mesure pour BA111OD, badges de réassurance et footer de marque pensés pour prolonger l'identité visuelle du site.

    Contexte

    Toutes les sections n’ont pas besoin d’être spectaculaires pour être utiles. Certaines ont un rôle plus discret : rassurer, signer, structurer une page, et prolonger l’identité de marque sans bruit.

    Ce qui a été construit

    Une barre de badges configurable. Un module léger pour faire remonter des messages de confiance, expédition, garantie, Swiss Made, retours, avec contrôle des couleurs, du texte et des espacements.

    Plein écran ↗
    Code HTML / CSS extrait tel quel de la section Shopify en production. Bascule Desktop / Mobile pour voir le comportement responsive.

    Un footer de marque éditorial. Une section minimale, centrée sur le nom BA111OD, encadrée par des lignes décoratives pour fermer une page avec plus de tenue visuelle.

    Plein écran ↗
    Code HTML / CSS extrait tel quel de la section Shopify en production. Bascule Desktop / Mobile pour voir le comportement responsive.

    Des briques simples à réutiliser. Ces modules sont faits pour s’insérer facilement dans le thème, être ajustés depuis l’éditeur, et renforcer la cohérence générale sans alourdir les pages.

    Résultat

    Des sections frontend discrètes mais utiles, qui donnent plus de soin et de continuité à l’expérience BA111OD dans Shopify.

  13. project· livré

    BA111OD · Chapter 4 · Tourbillon T.V.D.

    Expérience de lancement en ligne pour la Chapter 4 · Tourbillon T.V.D. de BA111OD, une page immersive pensée pour révéler la montre, rythmer la découverte et porter l'annonce avec justesse.

    Contexte

    Pour le lancement de la Chapter 4 · Tourbillon T.V.D., l’objectif n’était pas seulement de publier une page produit. Il fallait créer une montée en tension, faire entrer la montre progressivement dans le champ, et donner à l’ensemble une présence plus éditoriale que promotionnelle.

    Ce qui a été développé

    Une expérience de révélation. La page accompagne la découverte au fil du scroll, avec un rythme plus proche d’un chapitre que d’un catalogue. On avance par séquences : matière, détails, calibre, caractère.

    Une page pensée pour la marque. L’ensemble reste sobre, premium et lisible. L’animation soutient le regard au lieu de le distraire, pour laisser la montre et son univers visuel prendre toute la place.

    Un format réellement activable. Le projet a été intégré dans l’écosystème BA111OD pour pouvoir vivre comme une vraie page de lancement, publiable et exploitable par l’équipe.

    Ce qui a été construit

    • Une narration en chapitres au scroll pensée comme une révélation progressive, pour installer la montre avec plus de présence et de tension.
    • Des panneaux éditoriaux plein écran composés pour faire alterner image, respiration et messages clés dans un registre plus premium.
    • Une expérience de lancement pleinement intégrée à l’univers de la marque, aujourd’hui en ligne comme une page signature BA111OD.

    En ligne

    Voir la page live →

    Résultat

    Une landing de lancement désormais en ligne, conçue pour donner plus de présence à la Chapter 4 et transformer la découverte du modèle en expérience de marque.

  14. project· livré

    BA111OD · Hotspots

    Section Shopify sur mesure permettant de mettre en avant des produits clés via des zones interactives cliquables sur une image éditoriale.

    Contexte

    Une section Shopify sur mesure pour mettre en valeur des produits clés dans la boutique BA111OD. L’équipe marketing place des hotspots cliquables directement sur une image éditoriale de la montre ; chaque hotspot ouvre un tooltip avec un titre, une description et une image optionnelle.

    La démo

    La section telle qu’elle tourne en production, intégrée ici avec son vrai HTML, CSS et JS, extraits tels quels du thème Shopify.

    Plein écran ↗
    Code HTML / CSS / JS extrait tel quel de la section Shopify en production. Clique un hotspot pour ouvrir l'info. Bascule Desktop / Mobile pour voir le comportement responsive.

    Essaie :

    • Clique un + → le tooltip s’ouvre, le bouton pivote vers ×
    • Clique à nouveau, Esc, ou le bouton de fermeture → ça referme
    • Bascule Desktop / Mobile : sur mobile, les tooltips passent en bottom sheet plein écran

    Comment c’est fait

    Le schema de la section expose l’image de fond (desktop et mobile), la hauteur, la couleur d’accent, la couleur des icônes, et des blocs hotspot avec position en % (desktop et override mobile), titre, description et image de tooltip.

    Le rendu utilise des custom properties CSS injectées par Liquid. Le JavaScript est vanilla, ~240 lignes, zéro librairie : event delegation, IntersectionObserver pour l’animation d’entrée staggerée, positionnement du tooltip qui préfère le dessous et bascule au-dessus s’il manque de place. Sous 600 px, même composant, même API, mais le tooltip devient une bottom sheet avec overlay sombre, géré en CSS et une poignée de branches JS.

    Accessibilité : aria-expanded / aria-controls sur les paires bouton / tooltip, fermeture par Esc, retour de focus à la fermeture, prefers-reduced-motion désactive l’animation.

    Résultat

    Une section activable depuis l’éditeur de thème, sans impact sur les performances du site. L’équipe marketing crée une page éditoriale, ajoute des hotspots, édite positions et contenus, sans intervention technique.

  15. project

    L'atelier des choix

    Cabinet de coaching et de mentoring pour adolescents et jeunes adultes, fondé par Daniela Leone à Neuchâtel. Site éditorial sur mesure, confié à la cliente.

    L’atelier des choix est un cabinet d’accompagnement fondé par Daniela Leone à Neuchâtel. Coaching et mentoring pour adolescents et jeunes adultes, autour d’une même question : « trouver sa place, ses réponses, son élan ».

    Un positionnement humain et éditorial, à l’opposé du registre corporate. Le projet : traduire cette voix dans un site à la fois sobre et incarné, que Daniela puisse faire vivre seule dans le temps.

    Le site

    Un manifeste d’une page, en ligne sur atelier-des-choix.ch. L’enjeu n’était pas la quantité de pages mais le ton : un texte qui se lit comme une conversation posée, découpé en une dizaine de chapitres qui s’enchaînent. Les deux approches (coaching et mentoring), les étapes d’un accompagnement, les bénéfices, un « pour qui », une présentation de Daniela, une section pour les parents, le contact.

    Le design assume le registre éditorial, titres en Instrument Serif, italiques colorées, larges respirations, une palette douce tirée de l’univers du cabinet. Une énergie « magazine » plutôt que « site de prestation ».

    Un site qui lui appartient

    Chaque texte, chaque portrait et même les quatre couleurs de la palette sont éditables depuis une interface d’administration, sans toucher au code, avec un cycle brouillon, aperçu, publication et un guide en français. Astro pour le rendu, un CMS sur le edge Cloudflare pour le contenu. Daniela fait évoluer le site seule, c’était la condition du projet.

  16. project· livré

    L'atelier des choix · Site éditorial

    Site éditorial d'une page pour le cabinet de coaching de Daniela Leone, pensé comme un manifeste. Astro et un CMS sur le edge Cloudflare, entièrement pilotable par la cliente.

    En ligne sur atelier-des-choix.ch.

    Contexte

    Daniela Leone accompagne des adolescents et de jeunes adultes à Neuchâtel. Son métier est fait d’écoute et de nuance, et son site devait l’être aussi : ni plaquette corporate, ni page de vente agressive, mais un texte qui se lit comme une conversation posée.

    L’enjeu n’était pas la quantité de pages, c’était le ton. Une seule page, pensée comme un manifeste, qui déroule qui elle est, pour qui elle travaille, et comment se passe un accompagnement.

    Le site, un manifeste d’une page

    Tout vit sur une page unique, composée d’une dizaine de chapitres qui s’enchaînent : un hero éditorial, les deux approches (coaching et mentoring), les étapes d’un accompagnement, les bénéfices, un « pour qui », une présentation de Daniela, une section pour les parents, et le contact.

    Le design assume le registre éditorial : titres en Instrument Serif, italiques colorées, larges respirations, une palette douce (crème, gris profond, vert sauge, rose) tirée de l’univers du cabinet. L’objectif visuel, une énergie « magazine » plutôt que « site de prestation ».

    Autonomie éditoriale

    Chaque texte, chaque portrait, et même les quatre couleurs de la palette sont éditables par Daniela depuis une interface d’administration, sans toucher au code. Le contenu passe par un cycle brouillon, aperçu, publication, et un guide en français l’accompagne pas à pas. Le site lui appartient vraiment, elle le fait évoluer seule.

    Stack

    • Astro : rendu serveur du site, composition par chapitres
    • EmDash : CMS, tout le contenu visible vient de l’admin
    • Cloudflare Workers : runtime edge, avec D1 (base) et R2 (médias)

    Résultat

    Un site qui ressemble à son métier : sobre, incarné, sans bruit. Une page unique qui pose une voix, et une cliente autonome pour la faire vivre dans le temps.

    Voir le site →

  17. essay

    FAQ · Premier appel

    Les questions à se poser avant un premier appel, et mes réponses telles que je les donnerais de vive voix.

    Les questions que tu te poses probablement avant un premier appel, et mes réponses telles que je te les donnerais de vive voix. Si tu envisages de travailler avec moi, autant qu’on parte du même endroit.

    Combien de temps avant ta première réponse ?

    Sous 24 heures ouvrées, en général plus vite. Si je suis en deep work sur un projet client, parfois 48. Je réponds toujours, même pour dire non.

    Tu travailles avec combien de clients en parallèle ?

    Je me limite à deux clients actifs en même temps, parfois un troisième en démarrage ou en maintenance légère. Au-delà, la qualité de l’attention baisse vite, et je préfère décaler un démarrage que travailler à moitié.

    Et si je ne sais pas encore exactement ce que je veux ?

    Parfait. Le premier appel sert souvent à reformuler le problème. Beaucoup de clients arrivent avec une solution (« il me faut une appli ») et repartent avec une question (« c’est vraiment ce dont j’ai besoin ? »). C’est la partie la plus utile du travail, et elle est gratuite.

    Comment on sait qu’un projet est « fini » ?

    On le définit ensemble au début, pas à la fin. Chaque engagement commence par un document court qui liste ce qui doit tourner en production pour qu’on dise « livré ». Pas d’ambiguïté, pas de dérive infinie. Si le périmètre évolue en cours de route (ça arrive), on rediscute, mais explicitement, pas en tirant la couverture.

    Qu’est-ce qui se passe si on n’est pas d’accord sur une décision ?

    On en discute jusqu’à ce qu’on comprenne d’où vient le désaccord. Neuf fois sur dix, ça révèle une contrainte qu’on n’avait pas clarifiée. Si on reste en désaccord après ça, tu décides, c’est ton produit. Mais si je pense que tu fais une erreur, je te le dirai.

    Tu gardes les droits sur le code ?

    Non. Tout ce que j’écris pour toi t’appartient : dépôt, base de données, secrets, comptes cloud, documentation. Je garde le droit de mentionner le projet dans mon portfolio (comme ici), sauf accord de confidentialité explicite.

    Tu factures comment, à l’heure, au forfait, au projet ?

    Au projet quand le cadrage est clair, ce qui est le cas la plupart du temps. En retainer mensuel pour les collaborations longue durée où le travail est continu mais les contours varient. J’évite la facturation à l’heure : elle crée de mauvaises incitations des deux côtés (pour moi à étirer, pour toi à micro-optimiser).

    C’est quoi un « bon » client pour toi ?

    Quelqu’un qui sait ce qu’il veut faire, pas forcément comment le faire. Qui peut prendre une décision sans convoquer un comité. Qui est prêt à entendre « non » ou « attends » quand c’est la bonne réponse. Qui comprend qu’un bon produit vient d’une conversation, pas d’un cahier des charges de quarante pages.

    Qu’est-ce que tu évites de faire ?

    Les projets longs sans livrables intermédiaires. Les engagements où je ne peux pas parler directement à la personne qui décide. Le développement « à la demande » facturé à l’heure sans cadrage.

    Et si je change d’avis en cours de route ?

    Ça arrive sur presque tous les projets. On rediscute, on reprioritise, on déplace du scope. Si le changement est majeur, on signe un avenant. C’est normal de changer d’avis. Ce qui l’est moins, c’est de le découvrir en production.

    Qu’est-ce qui se passe si tu disparais pendant deux semaines ?

    Si je prends des vacances, tu le sais longtemps à l’avance. Si une urgence personnelle arrive, je te préviens vite et on ajuste. Tu as toujours un accès direct au dépôt, aux comptes, à l’infrastructure, tu n’es jamais dépendant de moi pour accéder à ton propre produit.

    Tu peux signer un NDA ?

    Oui, tant qu’il est raisonnable. Je préfère les NDA courts et précis à ceux de douze pages. Je ne peux pas signer un NDA qui interdirait de mentionner l’existence du projet après livraison, mais je peux accepter de taire les détails, le nom, les chiffres, les captures.


    Une question manque ? Écris-moi directement à [email protected], si elle revient souvent, elle finira ici.

  18. essay

    Colophon

    L'outillage IA réel derrière le studio. Quels modèles, comment je les pilote, là où l'IA agit et là où je ne la laisse pas seule. La version vérifiable de « l'IA comme levier ».

    La page Approche affirme que l’IA est un levier concret. Voici de quoi le vérifier : l’outillage réel, sans arrondi marketing.

    Les modèles

    Tous les modèles de pointe d’Anthropic et d’OpenAI, selon la tâche, plus des expérimentations avec des modèles ouverts comme Qwen. Pas d’attachement à un modèle en particulier : celui qui fait le mieux le travail du moment.

    Comment je les pilote

    En terminal, là où le travail se fait vraiment : Claude Code, Codex, et le harness Pi. Pas de copier-coller dans une fenêtre de chat. Des agents qui lisent le code, exécutent, et rendent compte.

    L’outillage

    Des skills et des serveurs MCP sur mesure, officiels ou maison. Jamais de skills tiers récupérés sur le web : question de sécurité, pour ne pas exposer un projet client à une injection de prompt. Ce qui tourne ici, je l’ai écrit ou audité.

    Là où l’IA agit

    Brainstorming, recherche, implémentation. Elle accélère l’exploration et écrit du code sous supervision.

    Là où je ne la laisse pas seule

    La validation, le design final, les décisions qui engagent. Et je la challenge : je pousse pour aller plus loin, pas pour livrer plus vite à moindre exigence. L’IA propose, je tranche.


    Ce site : SvelteKit, Cloudflare, D3-force.

  19. project· maintenu

    Proposals · La proposition commerciale comme produit

    Le portail privé où mes prospects reçoivent leur proposition, versionnée, commentable, avec devis à l'écran et en PDF générés depuis la même source. Démo publique, passphrase « atelier ».

    Démo ouverte à tous : proposals.horiot.studio/demo, code d’accès atelier.

    Contexte

    Une proposition commerciale classique, c’est un PDF en pièce jointe. Il meurt dans une boîte mail : les retours éclatés dans un fil d’emails, les versions qui se confondent (proposition_v3_final_OK.pdf), le prix séparé du cadrage.

    Ce système prend le contre-pied. Chaque prospect reçoit une URL et une passphrase, par des canaux séparés, et retrouve dans un espace privé le cadrage, le plan, le prix et parfois une démo, au même endroit. C’est l’étape 03 de mon approche, et un produit à part entière.

    Essaie-le

    Une proposition de démonstration est ouverte, pour une maison de céramique fictive, Maison Verel : proposals.horiot.studio/demo, code d’accès atelier. Tu y verras la gate, le contenu, les retours ancrés et le devis, exactement comme un prospect. La soumission des retours y est désactivée côté serveur ; l’interface reste entière.

    Ce qu’il fait

    Privé, réellement. Tant que l’accès n’est pas déverrouillé, le contenu n’est jamais sérialisé dans la réponse. Ce n’est pas un overlay sur une page déjà chargée : le serveur ne livre rien, et chaque endpoint sensible refait sa propre vérification.

    Des retours au bon endroit. Le prospect commente une section ou une ligne du devis. Ses réponses sont persistées et pré-remplies à la visite suivante, chaque soumission me notifie, et je relis tout dans un espace d’administration séparé. L’itération se fait dans la proposition, pas dans un fil d’emails.

    Versionné comme du code. Chaque publication est un instantané. Un prospect qui revient après une révision voit un bandeau « Mis à jour » et un diff de ce qui a changé ; ses retours restent épinglés à la version qu’il commentait.

    Un devis, deux rendus, zéro dérive. Un seul bloc de pricing alimente le rendu à l’écran et le devis A4 en PDF, calculés par le même module. L’administration convertit ensuite un devis accepté en facture, sur la même numérotation que le reste de l’activité.

    Pourquoi c’est ici

    Ce système incarne une conviction : l’expérience commerciale fait partie du travail. Le soin qu’un prospect voit dans sa proposition est celui qu’il retrouvera dans son projet. Et c’est le cycle complet de l’atelier : un outil construit pour mon usage, éprouvé en conditions réelles, chaque proposition que j’envoie passe par lui.

    proposals.horiot.studio/demo →

  20. project· maintenu

    Vault Tools · Traitement de fichiers dans le navigateur

    Une suite de 40+ outils de traitement de fichiers, 100 % côté client grâce à WebAssembly. « Convert. Compress. Transform. All in Your Browser. »

    Contexte

    Vault Tools est une suite d’outils de traitement de fichiers qui tourne entièrement dans le navigateur : « Convert. Compress. Transform. All in Your Browser. »

    La plupart des convertisseurs gratuits en ligne envoient vos fichiers sur un serveur tiers. Pour un avocat avec des pièces confidentielles, un designer avec des maquettes non publiées, un développeur avec des données sensibles, ce modèle est inacceptable. Vault Tools prend le contre-pied : vos fichiers ne quittent jamais votre machine.

    Côté client, toujours

    WebAssembly comme moteur de traitement. Conversion d’images, fusion de PDF, génération de hash, parsing JSON, tout est compilé en WASM et s’exécute chez le visiteur. Aucun backend de traitement, aucun compte, aucun fichier téléversé. La promesse est architecturale, pas juridique : « Your files stay on your machine » se vérifie dans l’onglet réseau des DevTools, pas dans des CGU.

    Plus de quarante outils en cinq catégories : image (conversion, compression, EXIF, favicon, filigrane…), PDF (fusion, division, réorganisation, métadonnées…), développeur (hash, QR, UUID, JWT, cron…), texte et données (JSON, CSV, Markdown, diff, regex…), fichiers (checksum, ZIP…). Gratuit, financé par de la publicité non intrusive : pas d’abonnement, pas de limite de taille, pas de paywall sur les exports.

    Pourquoi c’est ici

    Vault Tools incarne une position technique que je tiens : le traitement côté client est sous-utilisé. WebAssembly a rendu possibles des usages qu’on envoyait par réflexe sur des serveurs, par habitude, par flemme d’infrastructure, ou parce que les frameworks serveur-first rendent l’option invisible. Vault Tools est la démonstration qu’on peut faire beaucoup plus dans le navigateur que l’industrie ne le suggère.

    vault-tools.com →

  21. project· maintenu

    Cold Star · A small light in a very large dark

    Un jeu incrémental sci-fi pour le navigateur, écrit en Rust et compilé en WebAssembly. « A small light in a very large dark, and the cost of keeping it lit. »

    Petit jeu fini, en accès libre : une invitation à étendre.

    Contexte

    Cold Star est un jeu incrémental minimaliste qui tourne entièrement dans le navigateur. Le pitch, repris du dépôt : « A minimalist sci-fi incremental game about a small light in a very large dark, and the cost of keeping it lit. »

    On se réveille sans énergie dans le noir de l’espace. On ranime un réacteur défaillant, on rassemble un équipage, on bâtit une station, puis un vaisseau, et on part vers une galaxie générée procéduralement : seize systèmes, des surfaces planétaires, des contacts qu’on peut héler, négocier ou affronter. Trois origines convergent en milieu de partie, chacune vers plusieurs fins. « It starts as a single button in the dark. It ends as a galaxy. »

    Le jeu s’inscrit dans la filiation d’A Dark Room : un récit porté par la divulgation progressive de l’interface, presque sans exposition. L’instrument se réchauffe à mesure qu’on le ranime : sa couleur et sa chaleur sont de l’état de jeu réel, pas de la décoration.

    Une simulation déterministe

    Rust compilé en WebAssembly, rendu avec Dioxus, dans un workspace à séparation stricte : sim, le moteur pur et déterministe, sans I/O ni unsafe ; content, les données de jeu validées en fichiers RON ; app, une vue en lecture seule au-dessus de l’état.

    L’invariant central : advance(n) == n × advance(1). Avancer d’un tick ou de mille produit exactement le même état. C’est ce qui rend triviaux les sauvegardes par instantané, les liens de partage encodés en base64 et le rattrapage hors-ligne.

    Pourquoi c’est ici

    Cold Star pousse à l’extrême une conviction technique : une simulation pure et déterministe paie ses dividendes partout. C’est aussi un terrain où éprouver Rust → WASM sur un produit fini, interactif et stateful, une boucle de jeu complète plutôt qu’une API sans état.

    Le jeu est feature-complete pour l’arc qu’il dessine, et volontairement ouvert à l’extension : contenu, équilibrage, rencontres, polish.

    Le dépôt sur GitHub →

  22. project

    Démos · Configurateurs à essayer

    Cinq configurateurs génériques, ouverts à tous, un par métier de fabricant sur mesure. Ce que je mets entre les mains d'un prospect avant le premier appel, plutôt qu'une description.

    demos.horiot.studio, sans compte ni code d’accès.

    Le principe

    Chaque démo est un produit générique et fonctionnel, sous ma propre marque : le client final configure son produit en 3D, voit un prix indicatif, et le fabricant recevrait une demande qualifiée avec le plan coté. Les catalogues et les prix sont fictifs mais cohérents ; tout s’adapte ensuite aux gammes, aux tarifs et à la charte de l’entreprise. Rien ne part quand on clique sur « Envoyer ma demande » : un panneau montre ce que le fabricant recevrait.

    Les cinq configurateurs

    Carport et pergola. Le premier de la série : 3D et plan technique dans la même fenêtre, zones de neige par code postal.

    Portail et clôture. Portail, portillon et clôture assortis, le portail s’ouvre en 3D, motifs de découpe laser.

    Cave à vin enterrée. Coupe 3D sous la maison, visite de l’intérieur, réservation de dalle sur le plan.

    Escalier sur mesure. Droit, quart tournant ou hélicoïdal, contrôle de trémie et d’échappée, montée à la première personne.

    Piscine conteneur. Hors-sol, semi-enterrée ou enterrée dans le jardin, fiche chantier avec formalités, taxe et grutage.

    Pourquoi cinq

    Un configurateur se juge sur du concret, pas sur une promesse. Cinq métiers, cinq vocabulaires, cinq géométries : la même méthode à chaque fois (un module de géométrie pur, deux rendus qui ne peuvent pas se contredire, un prix en fonction pure), et la preuve qu’elle tient sur des produits très différents.

  23. project· maintenu

    Configurateur carport & pergola · Démo publique

    Un configurateur générique de carport et pergola, à essayer en ligne, rendu 3D et plan technique dans la même fenêtre, prix indicatif en direct, demande de devis simulée. Le produit que je montre aux fabricants et installateurs avant le premier appel.

    Démo ouverte à tous : demos.horiot.studio/carport, sans compte ni code d’accès.

    Contexte

    Quand j’écris à un fabricant de carports ou de pergolas que je ne connais pas, je peux décrire un configurateur, ou lui en mettre un entre les mains. Cette démo est le second choix.

    C’est un produit générique, fonctionnel, sous ma propre marque : le client final configure son abri, voit un prix indicatif, et le fabricant reçoit une demande qualifiée avec le plan. Tout s’adapte ensuite au catalogue, aux tarifs et à la charte de l’entreprise. demos.horiot.studio regroupe ces produits à essayer ; celui-ci a été le premier, quatre autres ont suivi (voir les démos).

    Essaie-le

    Six étapes en accordéon, toutes modifiables, aucune impasse. À tester en particulier :

    • 3D ou Plan : le plan technique (élévation, vue de dessus, cotes, cartouche) est un second rendu à part entière, pas une 3D au rabais.
    • Le code postal : il affiche la zone de neige du département (NF EN 1991-1-3/NA), à titre indicatif.
    • Envoyer ma demande : rien ne part. Un panneau montre ce que le fabricant recevrait, configuration, prix, plan et coordonnées.

    Deux rendus, une seule géométrie

    Un module de géométrie pur transforme la configuration en primitives (poteaux, poutres, chevrons, toiture, lames, cotes). C’est le seul contrat que connaissent les deux rendus : la 3D et le plan lisent les mêmes positions, ils ne peuvent pas se contredire. La 3D (Three.js) n’est chargée qu’à la première activation ; le plan est du SVG pur.

    Le prix suit la même logique : une fonction pure, des montants fictifs mais cohérents, détaillés ligne par ligne. Brancher le vrai catalogue d’un fabricant revient à remplacer une table de tarifs. La configuration vit dans l’URL sous forme d’un hash court, partageable par email. Le site est entièrement pré-rendu, sans code serveur ; le jour où un prospect veut un pilote réel, l’envoi vers sa boîte mail ou son CRM est à un fichier de distance.

    Pourquoi c’est ici

    Le configurateur Murdeau m’a appris ce qu’un configurateur doit faire pour vendre : partir de la question du visiteur, donner un prix tout de suite, livrer à l’entreprise une demande qu’elle peut traiter. Cette démo en est la version générique, pour un métier qui a le même besoin. Elle applique le principe de la maison à la prospection elle-même : on décide sur du concret, pas sur une description.

    demos.horiot.studio/carport →

  24. project· maintenu

    Configurateur portail & clôture · Démo publique

    Un configurateur générique de portail, portillon et clôture, à essayer en ligne, le portail s'ouvre en 3D, plan technique et prix indicatif en direct. Pour les fabricants et installateurs de portails aluminium, acier et fer.

    Démo ouverte à tous : demos.horiot.studio/portail, sans compte ni code d’accès.

    Le visiteur choisit l’ouverture (battant ou coulissant), la pose entre piliers maçonnés ou sur poteaux fournis, les dimensions, le style et la couleur, puis le portillon et la clôture assortis. Il voit le prix indicatif à chaque changement et recevrait, côté fabricant, une demande avec le plan coté.

    À tester

    • Ouvrir : le portail s’ouvre en 3D, battant ou coulissant, pour vérifier le dégagement.
    • Portillon et clôture : ils reprennent le style et la couleur du portail, et le prix suit la longueur de clôture.
    • Découpe laser : les motifs ajourés se voient en 3D et sur le plan, et changent le prix.

    Le produit, les gammes et les prix sont génériques. Tout s’adapte au catalogue et à la charte d’un fabricant, comme les autres démos.

    demos.horiot.studio/portail →

  25. project· maintenu

    Configurateur cave à vin enterrée · Démo publique

    Un configurateur générique de cave à vin enterrée, ronde, ovale ou voûtée, à essayer en ligne, coupe 3D sous la maison, visite de l'intérieur, plan avec réservation de dalle. Pour les fabricants et installateurs de caves enterrées.

    Démo ouverte à tous : demos.horiot.studio/cave, sans compte ni code d’accès.

    Le visiteur choisit le type de cave (ronde en hélice, ovale avec espace dégustation, voûtée où l’on marche), la hauteur et donc la capacité en bouteilles, la trappe, l’aménagement des casiers et le mode de pose. Le prix indicatif suit chaque choix ; la demande partirait avec le plan et la réservation de dalle.

    À tester

    • Intérieur : on descend dans la cave, à la première personne, bouteilles autour de l’escalier.
    • Coupe 3D : la cave sous la dalle, avec la trappe et la hauteur choisie.
    • Plan : la réservation de dalle cotée, ce que le maçon attend avant de couler.

    Le produit, les gammes et les prix sont génériques. Tout s’adapte au catalogue et à la charte d’un fabricant, comme les autres démos.

    demos.horiot.studio/cave →

  26. project· maintenu

    Configurateur escalier sur mesure · Démo publique

    Un configurateur générique d'escalier droit, quart tournant ou hélicoïdal, à essayer en ligne, contrôle de trémie et d'échappée, montée à la première personne, fiche de cotes. Pour les fabricants d'escaliers sur mesure.

    Démo ouverte à tous : demos.horiot.studio/escalier, sans compte ni code d’accès.

    Le visiteur choisit la forme et le sens, renseigne son étage (hauteur, trémie), puis les marches, la structure, le garde-corps et la pose. L’outil vérifie que l’escalier passe : nombre de marches, échappée sous la trémie, giron. Le prix indicatif suit ; la demande partirait avec la fiche de cotes.

    À tester

    • Votre étage : réduisez la trémie, l’outil signale quand l’échappée n’est plus réglementaire.
    • Marche : on monte l’escalier à la première personne, pour sentir la pente.
    • Hélicoïdal : le fût central et la trémie ronde, avec le plan coté qui suit.

    Le produit, les gammes et les prix sont génériques. Tout s’adapte au catalogue et à la charte d’un fabricant, comme les autres démos.

    demos.horiot.studio/escalier →

  27. project· maintenu

    Configurateur piscine conteneur · Démo publique

    Un configurateur générique de piscine conteneur, hors-sol, semi-enterrée ou enterrée, à essayer en ligne, coupe 3D dans le jardin, vue depuis la terrasse, fiche chantier avec formalités, taxe et grutage. Pour les fabricants de piscines conteneur et bassins acier.

    Démo ouverte à tous : demos.horiot.studio/piscine, sans compte ni code d’accès.

    Le visiteur choisit le format (20 pieds, 40 pieds ou sur mesure), la profondeur, la pose et l’enfouissement, puis le bardage, la terrasse, le liner, la couverture et les équipements. La démo pose la piscine dans son jardin, avec la limite de propriété et le camion-grue, et sort une fiche chantier : formalités, taxe d’aménagement, sécurité, accès pour la grue.

    À tester

    • Votre terrain : réduisez le passage sous 3,50 m, la fiche chantier passe à la grue mobile et le prix suit.
    • Terrasse : la piscine vue depuis la terrasse, à la première personne, couverture ouverte ou fermée.
    • Sous les 10 m² : le format 20 pieds évite toute formalité, et la fiche le dit.

    Le produit, les gammes et les prix sont génériques. Tout s’adapte au catalogue et à la charte d’un fabricant, comme les autres démos.

    demos.horiot.studio/piscine →

Connexions

Disponible pour de nouveaux projets