Une galaxie pour la mémoire d’une famille

Dix planches au crayon, 385 personnes à placer, et une application que la famille ouvre sans créer de compte.

Ma mère tenait l’arbre de la famille au crayon, sur un parchemin de plusieurs mètres réparti en dix planches numérotées. Chaque branche ajoutée obligeait à redécouper la mise en page, et personne d’autre qu’elle ne savait vraiment le lire. J’ai construit Parenthèse pour ça, du premier croquis jusqu’à la production, et le code est public depuis septembre.

Voir le site
Une galaxie pour la mémoire d’une famille
Détails du projet
Client
Produit personnel
Année
2026
Rôle
Conception produit, direction artistique, UX/UI, développement, déploiement
Livrables
Partis pris d’interface, design system, moteur de placement, application React déployée, page de confidentialité, code ouvert et auto-hébergeable

Le point de départ

On a cherché un outil en ligne avant que je m’y mette. Ceux qu’on a trouvés demandent des dates précises, des sources et des actes à joindre, ils sont faits pour des gens qui font de la recherche. Ma mère ne fait pas de recherche. Elle veut garder la photo de son grand-père, la voix de sa tante et l’histoire qui va avec, et que le reste de la famille puisse la lire sans mode d’emploi. Le cahier des charges tenait là-dedans.

Une carte plutôt qu’un tableau

Le premier parti pris a été de ne pas faire un arbre à cases. Un tableau de générations se lit d’un coup d’œil tant qu’il tient sur un écran, et au-delà il devient un document qu’on fait défiler sans jamais voir où on est. J’ai préféré une carte dans laquelle on se déplace, chaque personne portant ses photos, ses vidéos et ses enregistrements autour d’elle. Ce choix se paie, et j’ai passé une bonne partie du reste à le payer. Une carte fait perdre la vue d’ensemble, donc il a fallu une recherche, un cadrage automatique à l’ouverture, et des niveaux de détail qui changent avec le zoom pour que l’écran reste lisible à toutes les échelles. L’arbre se dessine à l’ouverture, génération par génération, pour qu’on comprenne sa structure avant de pouvoir s’y perdre.

Lire sans compte

Un arbre s’ouvre avec un lien et un mot de passe de lecture, sans inscription. Un second mot de passe donne le droit de contribuer. C’est le réglage qui a fait que la famille s’en est servie, là où une inscription aurait arrêté la moitié des gens. En contrepartie, l’application ne sait pas qui est derrière un mot de passe partagé, donc il n’y a pas d’historique nominatif des modifications. Une fiche s’ouvre sur le côté avec l’état civil, les lieux, le métier, la famille et les médias, pendant que la personne reste visible dans l’arbre.

Contribuer sans rien casser

Ajouter quelque chose demande le second mot de passe, et ce qui arrive passe par le propriétaire de l’arbre avant de s’afficher. C’est une friction assumée, que ma mère peut désactiver depuis ses réglages le jour où elle fait confiance à tout le monde. Le mode contribution ouvre aussi une palette d’annotation, crayon, texte, sticker et photo, pour poser une note ou entourer une branche directement sur la carte. Une cousine qui ne sait pas remplir un formulaire sait dessiner une flèche et écrire à côté.

Le vrai problème, placer 385 personnes

L’arbre réel de ma famille compte 385 personnes, 138 unions, 485 filiations et quinze générations. À cette taille, le placement cessait de ressembler à une famille. Un enfant se retrouvait en médiane à 394 pixels de l’union de ses parents, et dans le dernier décile à 1 689, soit quatorze largeurs de vignette. La cause était dans la famille d’algorithmes que j’utilisais, un placement en couches qui trie chaque génération indépendamment par barycentre, sans que le bloc familial existe nulle part comme unité. J’ai monté un banc d’essai et comparé cinq familles de modèles en treize variantes, sur l’arbre réel plutôt que sur un jeu de test. Le moteur de graphes laissé libre sépare 94 couples sur 138 pour minimiser les croisements, ce qui dit bien qu’il optimise ce qu’on lui demande et que minimiser les croisements ne produit pas un arbre de famille. En le contraignant, les croisements tombent de 23 à une dizaine, mais le calcul passe de 9 millisecondes à 500 ou 700, ce qui impose un worker et 300 kilo-octets de plus, sans rien changer à ce qui gênait à l’œil.

Ce que le modèle retenu coûte

Le modèle en production abandonne ce moteur. Un couple et ses enfants forment un bloc, les blocs s’empilent par génération, et les parents sont centrés au-dessus de leurs enfants par construction plutôt que par heuristique. L’écart moyen parents-enfants passe de 210 à 179 pixels, la distance médiane d’un enfant à ses parents de 394 à 294, et le calcul reste à 9 millisecondes. Il coûte 15 % de largeur en plus et laisse 25 croisements, qui viennent des mariages entre deux familles déjà présentes dans l’arbre. La personne n’est placée qu’une fois, sous une seule de ses deux lignées, et aucun algorithme en couches ne supprime ça, on choisit seulement quelle lignée la garde. J’ai testé quatre réglages du modèle et c’est le plus simple qui gagne. Une variante réduisait la largeur en réordonnant les enfants, le sous-arbre le plus large au centre, je l’ai écartée parce que l’ordre de naissance compte plus, pour une famille, que quelques pour cent de largeur.

Tenir sur les machines de la famille

L’écran coûtait 12,7 millisecondes par image alors que personne ne touchait à rien. Le profil montrait 832 ombres portées et 779 dégradés radiaux dessinés à chaque image, plus deux fonctions qui parcouraient les 385 personnes et les 472 médias en linéaire pour chaque nœud. Indexer ces recherches, ne dessiner que ce qui est à l’écran et simplifier le rendu au dézoom fait tomber le coût à 1,3 milliseconde. Ne redessiner que lorsque quelque chose a changé le ramène à 0,1. Les seuils de simplification sont des décisions de direction artistique autant que de performance, l’ombre disparaît sous un certain zoom, les années et l’orbite de médias un cran plus bas, et le prénom s’estompe progressivement plutôt que de s’éteindre d’un coup.

Ouvrir le code

Cet arbre contient 472 médias, dont des enregistrements de gens qui ne sont plus là. Si j’arrête le service un jour, tout ça part avec lui, et je ne me voyais pas demander à d’autres familles de me confier la même chose en leur demandant de me croire sur parole. Le code est public sous licence PolyForm Noncommercial, lisible, modifiable et exécutable chez soi avec un docker compose up. Une licence permissive aurait laissé n’importe qui revendre le travail, et une licence libre classique n’empêche pas davantage l’usage commercial. Celle-ci autorise l’usage personnel et interdit le commerce, ce qui correspondait à ce que je voulais. Parenthèse reste gratuit, et il n’y a aucune intelligence artificielle dedans parce que rien dans le parcours n’en demandait.