EXPLORATION 001Faire place
Faire place
aux idées.
La liberté d’explorer.
Le plaisir de tout relier.
f(xlow) / DESIGN SYSTEM EXPERTLILLE, FRANCE
Je compose
des
systèmes.
Design systems, code & outils maison.
Je suis Florian. Xlow quand je compose.
Je relie le design, le code et l’IA.
x : UNE IDÉE. f : MA FAÇON DE FAIRE.
f(x)
Une intention, des règles partagées.
Des interfaces qui font sens.
UNE MÊME
ENVIE DE COMPOSER. f(idée) → interface f(rythme) → morceau f(saveurs) → assiette
ENVIE DE COMPOSER. f(idée) → interface f(rythme) → morceau f(saveurs) → assiette
01 / CONNEXIONS CONCRÈTESUNE SÉLECTION DE MON TRAVAIL
Les idées, c’est bien.
Les faire exister, c’est mieux.
Une intention, une méthode, un résultat.
Je transforme la complexité en outils utilisables.
01FRANCE TÉLÉVISIONS · DEPUIS 2021Un système. Toute une Galaxie.Un langage commun, de Figma à la production.DESIGN SYSTEM
MON RÔLE / SYSTEM DESIGNERFaire parler la même langue
Faire parler la même langue
au design et au code.
Référent france.tv Web et owner des design tokens, je relie les librairies Figma au code de production. Un socle commun pour plusieurs offres, avec des règles de versioning et un protocole de publication.
- Tokens DTCG buildés avec Terrazzo vers 9 cibles.
- Tokens sémantiques de couleur, de gradient et de layout.
- Publication par GitLab CI, documentation et crash-tests des librairies.
Figma · DTCG · Terrazzo · GitLab CI
SCHÉMA DE PRINCIPE / UNE SOURCE, PLUSIEURS CIBLES
f(x) Design tokens
FigmaWebApps & TV
3marques9plateformes
02FRANCE TÉLÉVISIONS · OUTILLAGE IADes agents. Et des garde-fous.Rendre le design system lisible et actionnable par l’IA.AGENTS & MCP
MON TERRAIN / AI ENABLEMENTL’outillage prépare.
L’outillage prépare.
L’équipe tranche.
Un serveur MCP pour le design system, des plugins Figma en TypeScript et des automatisations qui s’insèrent dans le quotidien des équipes. L’objectif : outiller le travail avec des contrats explicites et une validation humaine.
- 45 outils MCP, 177 tests et des évaluations.
- Écritures sous confirmation et orchestration d’agents.
- Migration Figma sans perte d’overrides et analyse d’impact.
- Automatisation des weeklies, notes de release et suivis de versions.
TypeScript · MCP · Plugin API · Tests
SCHÉMA DE PRINCIPE / L’HUMAIN DANS LA BOUCLE
↳ agent.request()↳ vérifier le contrat ✓↳ préparer l’action ✓◎ Validation humaine
45outils MCP177tests
03FRANCE.TV / FREE PRO · 2019–2023Du premier clic au grand écran.Des parcours qui s’adaptent aux usages et aux formats.UX/UI & PROTOTYPES
MON SOCLE / DESIGN D’INTERFACESConcevoir. Prototyper.
Concevoir. Prototyper.
Mettre à l’épreuve.
Chez Free Pro, je travaille sur le parcours d’achat, l’espace client et un design system sur Sketch. En mission NEXTON pour france.tv, je contribue au responsive et aux refontes web, app et TV.
- Free Pro, groupe Iliad : UX/UI, 2019–2022.
- france.tv, mission NEXTON : UI, 2022–2023.
- Prototypes HTML/CSS/JS pour les tests utilisateurs.
- Conseil au lancement du design system.
UX/UI · Responsive · HTML / CSS / JS
ILLUSTRATION / UN LANGAGE, PLUSIEURS FORMATS
Même intention.
Différentes façons de la vivre.
Les schémas illustrent les principes de mon travail. Les détails sont issus de mon CV.
02 / f(x) EN PRATIQUE À VOUS DE COMPOSER.
Un geste.
Tout un système.
Les tokens sont les variables.
Les composants partagent les règles.
Changez x. Toute l’interface suit.
01 / LES VARIABLES
x = tokens→
02 / LES RÈGLESf = composants→
03 / LE RÉSULTATf(x) = interface
APERÇU / INTERACTIFSTUDIO · CLAIR
Un peu de
méthode.
2 / 3 étapes
Composition libreTexte / accent · AA
Changez une valeur. Suivez ce qui se transforme.
UNE VALEUR, PLUSIEURS USAGES
palette.limecolor.accentCarte · bouton · badge · progressionSous le capot Les décisions derrière l’interface.
Les valeurs de votre composition, prêtes à réutiliser. Les alias relient les composants aux mêmes décisions.
C’est ce que je construis au quotidien : de la liberté, dans un cadre qui tient.
03 / L’HUMAIN DERRIÈRE LES SYSTÈMESDES INTERFACES. DES SONS. DES SAVEURS.
Le goût de
la composition.
Des interfaces. Des sons. Des saveurs.
La même envie de composer.
Sur scène, je suis Xlow. Je compose de la techno et je me passionne pour la cuisine gastronomique. FXLOW réunit ces univers : F pour Florian, Xlow pour la musique, f(x) pour le plaisir de transformer une idée.
Un composant, une boucle, un ingrédient : je pars d’éléments simples. Je pose une structure, je joue avec les textures et les contrastes, puis j’affine. La logique donne un cadre. L’intuition fait le reste.
f(t) / LE SON COMME TERRAIN DE JEUUne règle.
L’écoute démarre uniquement à votre demande.
Une règle.
Un rythme.
Huit pas, une ligne acid.
Posez les notes, ouvrez le filtre.
Faites monter la tension.
L’écoute démarre uniquement à votre demande.
Votre ligne acid, votre rythme. Activez les pas, puis lancez la boucle.
[ 01 ]
Le contrat d’abord.
Figma, code et agents lisent la même source.
[ 02 ]
Rien sans filet.
Snapshot avant migration. Tests avant merge.
[ 03 ]
L’équipe tranche.
L’IA fait le mécanique. L’arbitrage reste humain.
- 2010–2017
La forme.
Graphisme, identité & premiers sites.
- 2018–2019
Le mouvement.
Interfaces, intégration & animations web.
- 2019–2023
L’usage.
UX/UI, Free Pro & france.tv.
- DEPUIS 2021
Les connexions.
Design system, tokens, outillage & IA.
LA PROCHAINE CONNEXION ?ELLE COMMENCE PAR UN BONJOUR.
Un système à construire, une idée à tester,
ou juste l’envie de parler design et tech.