Book Retour au site Me contacter

Travaux 2025-2026 · Conception · Développement · Production vidéo

Ce que je construis,
et ce que ça donne
une fois en ligne.

Huit projets, de la plateforme SaaS en production au site vitrine, plus la production vidéo qui va avec. Chaque fiche s'ouvre sur le visuel réel, se lit d'un trait, et se déplie si vous voulez la mécanique en dessous.

08projets présentés
04en production
02en développement
100+vidéos rendues

Document autonome · tout est embarqué · aucune connexion nécessaire

01

Produit · Site · Automatisation

Equinox AI

Conception, design, développement, contenu, marketing

En ligne equinox-ai.fr

On automatise vos tâches répétitives,
vous récupérez du temps.

Equinox AI branche l'IA sur les outils déjà en place dans une PME pour supprimer les tâches qui se répètent. Pas de nouvel outil à apprendre, pas de migration. Le site présente cinq automatisations réellement en production, un simulateur de coût, et le produit phare : la Veille Stratégique.

PME et TPESur vos outils existantsRéponse sous 48 h ouvrées
Page d'accueil · la promesse tient en une phrase
05automatisations documentées
04agents IA sur la veille
5 à 10 hde recherche hebdo remplacées
Produit phare · la Veille Stratégique
Étude de cas · veille métier automatique
Combien cette tâche vous coûte-t-elle vraiment

Séquences

Reel marketingMotion design HyperFrames, rendu en trois formats
Les automatisationsCapsule produit
La veille stratégiqueCapsule produit
Détail technique Stack, architecture, choix techniques

Stack

  • HTML statique + Tailwind CSS (build CLI)
  • Design system Midnight Obsidian
  • n8n auto-hébergé derrière Nginx
  • Agents IA spécialisés par thématique
  • Analytics Umami auto-hébergé
  • HyperFrames + ffmpeg pour la vidéo

Architecture

Le site est volontairement statique : pas de framework, pas de base de données, un build Tailwind et des fichiers HTML servis par Nginx. Tout le dynamique vit derrière, dans n8n auto-hébergé. Le formulaire de contact déclenche un workflow qui qualifie la demande et prépare l'appel avant qu'il ait lieu.

Choix techniques

La pré-validation avant mise en production

Un workflow d'automatisation peut tourner et échouer sans rien signaler. Chaque workflow passe donc par une pré-validation avant mise en production, sur des templates éprouvés plutôt qu'un montage refait à chaque fois.

La dépendance aux API tierces

Une API qui tombe ne doit pas arrêter la chaîne. Chaque étape critique a un repli, et l'échec remonte au lieu d'être avalé.

02

SaaS · Assistant e-mail

EquiMail

Conception produit, architecture, développement, design, marque

En ligne equimail.fr

Une boîte mail enfin vide,
sans y passer vos soirées.

EquiMail ne remplace pas Gmail ou Outlook. C'est le tableau de bord de contrôle posé au-dessus : il trie, nettoie et automatise la boîte pour atteindre le zéro non traité, puis le tenir. Une démo complète tourne sans compte ni clé API.

Tri et règles IAReply ZeroDémo sans clé API
Page produit · tout se range, tout seul
06modules de traitement
~250e-mails dans la démo
0clé API pour essayer
Les modules, un par problème réel
Tarifs et positionnement

Séquences

Reel produitMotion design HyperFrames
Détail technique Stack, architecture, choix techniques

Stack

  • Next.js 15 (App Router)
  • TypeScript strict
  • PostgreSQL + Prisma 6
  • NextAuth v5, tokens OAuth chiffrés AES-256-GCM
  • BullMQ + Redis, avec repli inline
  • Tailwind CSS v4 + shadcn/ui
  • Couche LLM interchangeable : mock, OpenAI, Anthropic, Ollama
  • Vitest

Architecture

Six modules, chacun réglant un problème précis : catégorisation, règles IA écrites en français, Reply Zero (à répondre / en attente de réponse), désabonnement en masse via List-Unsubscribe, blocage des cold emails avec file de revue, analytics. La couche LLM est une interface : on branche un mock en test, Ollama en local, un fournisseur en production, sans toucher au reste.

Choix techniques

Le worker qu'il ne faut pas avoir à lancer

Un traitement asynchrone impose normalement de faire tourner un worker. Ici, le bouton met le job en file Redis si un worker écoute, et sinon traite en direct dans la requête. Résultat : on lance, ça marche. Le worker devient une optimisation, pas un prérequis.

Les tokens OAuth au repos

Un token Gmail en base est une clé de la boîte de quelqu'un. Chiffrement AES-256-GCM au repos, clé hors dépôt, deux secrets obligatoires générés à l'installation.

03

Application · Analyse statistique

Keno4You

Conception, développement, infrastructure de données, marque

En ligne keno4you.fr

Ne jouez plus une grille
à l'aveugle.

Analyse statistique descriptive des tirages du Keno. La posture est assumée et écrite sur la page d'accueil : chaque tirage est équiprobable et indépendant, l'espérance de gain est négative, aucune valeur prédictive n'est revendiquée. Ce que l'outil apporte, c'est de la couverture combinatoire, de la variance et des repères, pas une prédiction.

19 422 tirages indexésDepuis le 16/09/1993Mis à jour chaque nuit
Page d'accueil · le dernier tirage, en direct
19 422tirages indexés
33 ansd'historique continu
1fichier HTML, zéro dépendance
L'honnêteté comme argument : l'espérance est négative
Pendant que vous dormez, tout est recalculé
Application · sélection et couverture
Application · backtest sur historique

Séquences

Publicité teasingMotion design, trois formats
Détail technique Stack, architecture, choix techniques

Stack

  • Application : HTML unique, JavaScript vanilla, données embarquées
  • Zéro dépendance externe, fonctionne hors ligne
  • Production : n8n self-healing
  • Hub de persistance Google Sheets
  • Moteur Python avec repli
  • Adapté Keno 2025 : 56 numéros, 16 boules

Architecture

Deux moitiés qui ne se ressemblent pas. Devant, une application d'un seul fichier, sans build ni dépendance, données incluses : elle s'ouvre et elle marche. Derrière, une infrastructure auto-adaptative sur n8n, deux workflows découplés (audit trimestriel, production quotidienne), fenêtre glissante de cinq ans qui se réaligne toute seule, et un hub de persistance Google Sheets à la place de constantes en dur.

Choix techniques

L'écart se calcule sur la combinaison, pas sur ses numéros

L'écart d'une combinaison complète est une grandeur en soi. Le minimum des écarts de ses numéros vaut souvent zéro et rendrait la martingale inexploitable : le calcul porte donc sur la combinaison entière, et cette règle est tenue partout dans le code.

Les constantes en dur qui périment

Le passage du Keno à 56 numéros et 16 boules en 2025 aurait cassé chaque script contenant une constante. Le hub de persistance a remplacé les valeurs en dur, et l'audit trimestriel réaligne la fenêtre temporelle sans intervention.

04

SaaS santé · Praticiens MTC

GaiaFlow

Conception produit, architecture, développement, marque

En développement gaiaflow.vercel.app

Moins de paperasse,
plus de temps pour vos patients.

Plateforme SaaS pour les praticiens en médecine traditionnelle chinoise et en médecines douces. Dossiers patients, rendez-vous, questionnaires de pré-consultation et fiches conseils réunis dans un outil pensé pour la pratique MTC, pas dans un logiciel médical générique qu'il faudrait détourner.

Médecine traditionnelle chinoise14 jours d'essaiSans engagement
Page d'accueil · l'identité tient dans une illustration
14 jd'essai sans carte
1outil au lieu de quatre
PDFfiches conseils générées
Fonctionnalités par usage du cabinet
Comment ça marche
Détail technique Stack, architecture, choix techniques

Stack

  • Next.js
  • Supabase : Postgres, RLS, authentification
  • @google/generative-ai
  • Pinecone (recherche vectorielle)
  • @react-pdf/renderer + pdf-parse
  • Validation Zod aux frontières
  • Déploiement Vercel

Architecture

Supabase porte la donnée et l'authentification, avec des politiques RLS : un praticien ne voit que ses patients, la règle est dans la base et pas seulement dans le code. La génération documentaire (fiches conseils, comptes rendus) passe par @react-pdf/renderer, et la recherche dans le corpus par un index vectoriel Pinecone.

Choix techniques

Le cloisonnement des dossiers vit dans la base

Un praticien ne voit que ses patients, et la règle est écrite en politiques RLS Supabase plutôt qu'en conditions applicatives. Une requête qui passerait à côté de l'interface passe quand même devant la règle.

Un jeu de données de recette complet et rejouable

La recette tourne sur un jeu fictif mais complet, abonnement inclus, rejouable autant de fois que nécessaire, avec de vrais envois d'e-mail vers une boîte qu'on peut ouvrir. Un compte de test incomplet ne prouve rien.

05

SaaS B2B · Certification QUALIOPI

Consulting By Qaly

Développement, architecture documentaire, design system e-mail

En ligne · refonte en cours consulting-by-qaly.vercel.app

Le cabinet qui vous accompagne
dans votre projet.

Plateforme SaaS B2B pour les organismes de formation et les consultants en certification. Elle gère les dossiers QUALIOPI de bout en bout : collecte structurée des informations, génération des documents conformes, suivi de progression et espace client. Huit services sont automatisés sur le même socle. Les visuels présentés ici sont ceux de la refonte, menée en interne et pas encore déployée : la version en production a un autre visuel.

QUALIOPIOrganismes de formation8 services automatisés
Refonte · le site public, le cabinet avant la plateforme
08services automatisés
38documents produits par dossier
150+variables documentaires
Refonte · le parcours, du numéro d'activité à la certification
Espace client · couverture du référentiel, indicateur par indicateur
Le détail d'un indicateur · pièces au dossier et niveau d'exigence
Les documents produits, rangés dans l'arborescence du référentiel
Détail technique Stack, architecture, choix techniques

Stack

  • Next.js + Supabase (RLS, auth SSR)
  • Stripe avec vérification de webhook
  • Sentry (erreurs et performance)
  • Validation Zod sur toutes les entrées
  • Index et vues matérialisées
  • Génération documentaire : docx, docxtemplater, pizzip, pdfkit, pptxgenjs, xlsx
  • E-mails React Email + Resend
  • Déploiement Vercel

Architecture

Le cœur du produit n'est pas l'interface, c'est la fabrique de documents : un dossier rempli une fois alimente 89 documents conformes via plus de 150 variables. Supabase porte la donnée avec RLS, Stripe l'abonnement avec vérification de signature du webhook, Sentry la surveillance.

Choix techniques

Un design d'e-mail à dupliquer huit fois sans le recopier huit fois

Le modèle Velvet Green validé sur QUALIOPI devait servir aux sept autres services. Le contenu est sorti du JSX et vit dans un fichier éditable séparé, avec les images en constantes : dupliquer un service devient une question de contenu, plus de gabarit.

La performance tenue quand le volume monte

Index ciblés et vues matérialisées côté base, découpage du code côté client. Le travail se voit peu et se remarque seulement quand il manque.

06

Production audiovisuelle · Mission client

Fil Rouge RH

Production audiovisuelle uniquement

Vidéos livrées Produit édité par le client

Filmer un produit
sans jamais filmer un écran.

Fil Rouge RH est une plateforme RH éditée par un client. Je n'ai pas travaillé sur le produit lui-même : mon apport se limite à sa production audiovisuelle, capsules fonctionnalités, teaser de webinaire et présentation des nouveautés. Le parti pris est de reconstruire les écrans en HTML animé plutôt que de filmer une capture d'écran.

Capsules fonctionnalitésTeaser webinaireTrois formats de rendu
Produit édité par le client
03parcours filmés : RH, manager, salarié
03formats par vidéo : 16:9, 9:16, 1:1
01avatar de présentation

Séquences

Reel fonctionnalitésÉcrans reconstitués en HTML animé, fidèles au produit
Teaser webinaireAvatar HeyGen, voix off, incrustation et sous-titres brûlés
Nouvelles fonctionnalitésTeaser cinématographique
Détail technique Stack, architecture, choix techniques

Stack

  • HyperFrames : composition HTML + timeline GSAP, rendu déterministe
  • Playwright pour l'audit de fidélité sur le produit en ligne
  • HeyGen pour l'avatar de présentation
  • Voicebox pour la voix off locale
  • ffmpeg 8 : incrustation alpha, sous-titres, mux et ducking
  • Rendu systématique en 16:9, 9:16 et 1:1

Architecture

Les écrans du produit sont reconstruits en HTML et CSS animés plutôt que filmés : le rendu reste net à toutes les tailles, les textes restent modifiables, et le rendu est déterministe donc reproductible. Chaque scène est animée élément par élément, avec un faux curseur qui joue le parcours utilisateur.

Choix techniques

La fidélité se vérifie par capture, pas au jugé

Chaque écran reconstitué est comparé à une capture du compte démo, écran par écran, avant rendu : mêmes libellés, mêmes colonnes, mêmes états. Le style sert le produit, il ne le remplace pas : une vidéo qui ne ressemble pas au produit ne vend pas le produit.

La voix off qui passe sous la musique

Voix off générée par scène, musique corporate mixée dessous avec ducking simple au mux ffmpeg. La voix reste nettement au-dessus, sur toute la durée.

07

Automatisation · Mission pour un cabinet RH

Veille RH automatisée

Conception et mise en production de la veille

En service Le produit sur equinox-ai.fr

5 à 10 heures de recherche par semaine,
remplacées par quatre agents.

Mise en production de la Veille Stratégique d'Equinox AI chez un cabinet de conseil RH. C'est la seule chose que j'ai livrée pour ce client : je ne suis intervenu ni sur son site ni sur ses produits. Chaque semaine, quatre agents IA spécialisés balaient les sources publiques du secteur et rendent un rapport exploitable au lieu d'une liste de liens.

4 agents spécialisésRapport hebdomadairen8n auto-hébergé
Le workflow n8n en production · collecte, tri, synthèse, envoi
04agents spécialisés
5 à 10 hde recherche hebdo remplacées
01rapport exploitable, pas une liste de liens
Le produit tel qu'il est présenté sur equinox-ai.fr
L'étude de cas publiée : veille métier automatique
Détail technique Stack, architecture, choix techniques

Stack

  • n8n auto-hébergé derrière Nginx
  • Quatre agents IA, un par thématique de veille
  • Sources publiques du secteur, pas de scraping fermé
  • Déduplication et scoring avant synthèse
  • Envoi hebdomadaire au format lisible

Architecture

Le principe tient en quatre temps. La collecte : chaque agent a son périmètre, réglementation, marché, formation, santé et sécurité, et sa liste de sources publiques. tri : les doublons tombent, le reste est noté sur sa pertinence pour le métier du client, ce qui évite le rapport de trente liens que personne n'ouvre. synthèse : ce qui passe le seuil est résumé et remis dans le contexte du cabinet, avec la source citée pour que le lecteur puisse vérifier. envoi : un rapport par semaine, à jour fixe. Le paramétrage du périmètre et des sources vit dans un hub de configuration, pas en dur dans le workflow.

Choix techniques

Le produit, c'est la synthèse, pas la collecte

Une veille qui rend trente liens n'a rien automatisé, elle a déplacé le travail. Le scoring de pertinence et la synthèse sont le produit ; la collecte n'est que la plomberie.

Chaque source a un repli

Un site public peut changer de structure du jour au lendemain. Chaque source a donc une voie de secours, et une collecte vide remonte comme une alerte au lieu de produire un rapport vide.

08

Site vitrine · Espace membre

LifeTime Business

Direction artistique, développement, espace membre

En développement En cours de refonte

Des projets concrets,
des revenus partagés.

Site vitrine et porte d'entrée du réseau LifeTime Business. Il présente l'entreprise et deux projets commercialisés, BeerMarket et LifeTime Academy, explique le modèle d'adhésion et de participation, et donne accès à l'espace membre. Chantier en cours.

Site vitrineEspace membreNext.js et Supabase
En cours de refonte
Page d'accueil · sobre, solide, limpide
Vitrinesite public et parcours d'adhésion
Membreespace privé authentifié
AAniveau WCAG visé
Espace membre · participations et revenus reversés
Détail technique Stack, architecture, choix techniques

Stack

  • Next.js (App Router)
  • Supabase via @supabase/ssr pour l'authentification
  • Espace membre : adhésion, participations, revenus reversés
  • WCAG AA, prefers-reduced-motion respecté

Architecture

Deux publics sur un même site : le prospect qui vérifie le sérieux de la structure avant d'adhérer, et le membre qui vient retrouver son compte. Le premier a besoin de comprendre le modèle en une page ; le second a besoin de lire ses chiffres sans friction. L'espace membre privilégie donc la lisibilité des données sur le spectaculaire.

Choix techniques

Des chiffres qui doivent être exacts

Sur un site qui parle de revenus, un chiffre arrondi à la hausse est un risque. Tout montant affiché est vérifiable, les données sont en typographie monospace, les mentions sont complètes.

L'accessibilité prise comme contrainte de départ

Contrastes WCAG AA, focus visibles, prefers-reduced-motion respecté : les animations s'arrêtent pour qui les désactive. Une contrainte posée au début coûte moins cher qu'une reprise à la fin.

Transverse · production audiovisuelle

La vidéo fait partie du produit

Une plateforme qui ne se montre pas ne se vend pas. Sur la plupart de ces projets, j'ai produit les vidéos moi-même plutôt que de sous-traiter : reels marketing, capsules produit, tutoriels, teasers, vidéos de présentation. Le principe est constant : reconstruire les écrans en HTML animé plutôt que de filmer un écran, pour un rendu net, modifiable et reproductible.

01

HyperFrames

Composition HTML et timeline GSAP. Le rendu est déterministe : la même composition donne exactement la même vidéo, image par image. Une correction de texte ne demande pas de retourner un plan.

02

Écrans reconstruits

Les interfaces sont refaites en HTML et CSS, animées élément par élément, avec un faux curseur qui joue le parcours. Fidélité vérifiée par capture du produit réel, pas au jugé.

03

Voix et avatars

Voix off générée localement avec Voicebox, avatars de présentation avec HeyGen, musique mixée sous la voix avec ducking au mux.

04

ffmpeg

Incrustation alpha, sous-titres brûlés, empilage, mux. Rendu systématique en trois formats : 16:9, 9:16 et 1:1.

Les extraits présentés dans ce book sont raccourcis et recompressés pour tenir dans un fichier unique. Les originaux sont en 1080p.

Compétences

Ce que je manipule au quotidien.

Front

  • Next.js 15 (App Router)
  • React
  • TypeScript strict
  • Tailwind CSS
  • shadcn/ui
  • HTML et CSS sans framework

Back et données

  • PostgreSQL
  • Prisma
  • Supabase (RLS, auth, SSR)
  • Redis + BullMQ
  • Python
  • Zod aux frontières

Automatisation et IA

  • n8n auto-hébergé
  • Agents IA spécialisés
  • Couche LLM interchangeable
  • Ollama en local
  • Recherche vectorielle

Production vidéo

  • HyperFrames (HTML + GSAP)
  • Remotion
  • HeyGen
  • Voicebox (TTS local)
  • ffmpeg
  • Playwright pour la capture

Infrastructure

  • Vercel
  • Docker
  • Nginx
  • Stripe (webhooks vérifiés)
  • Sentry
  • Umami auto-hébergé

Méthode

  • Plan avant code sur tout ce qui dépasse trois étapes
  • Correction à la racine, jamais au symptôme
  • Créer, tester, vérifier, livrer
  • Preuve exécutée avant de dire que c'est fini