J'ai construit un éditeur CAO dans le navigateur, puis j'ai appris à un LLM à l'utiliser

J'ai demandé à mon application : « Combien y a-t-il de portes et de fenêtres ? »

L'IA a donné les décomptes. Puis elle a ajouté quelque chose sans que je le lui demande :

« Note : D3 ne mesure que 300 mm de large. Il s'agit probablement d'une erreur de détection de porte. Voulez-vous que je vérifie ? »

Il avait raison. Mon système avait transformé un élément de géométrie en une porte de 30 cm. Aucun humain ne l'avait remarqué. Le modèle a lu les données, a vu une porte plus étroite qu'une boîte à chaussures, et l'a signalée.

Ce moment a été la récompense d'un défi d'ingénierie colossal. J'ai dû analyser des fichiers AutoCAD DWG, reconstruire des modèles de bâtiments à partir de milliers de lignes aléatoires, construire un éditeur 2D de zéro et le connecter à Claude.

Voici comment je l'ai construit.

Le problème des données

Un fichier DWG ne contient pas de murs. Il contient des lignes. Tout ce qui est intéressant dans ce projet se passe entre ces deux phrases.

J'ai suivi deux règles pour gérer ces fichiers :

  • Exécuter l'analyseur en tant que sous-processus. Si l'analyseur vieux de 30 ans plante, il ne fait pas tomber mon serveur.
  • Ne jamais faire confiance au fichier. Les en-têtes DWG mentent souvent sur les unités. J'ignore l'en-tête et j'examine les chiffres réels pour trouver l'échelle exacte.

Le pipeline d'extraction

J'ai transformé une soupe de lignes en un modèle structuré :

  • Les murs sont des lignes médianes.
  • Les portes et les fenêtres s'alignent sur les murs hôtes.
  • Les pièces sont des polygones avec des noms et des surfaces.

J'ai utilisé une astuce simple pour la classification. J'ai utilisé la correspondance de sous-chaînes pour les noms de calques. Si un calque indique « WAND » ou « MAUER », le système sait qu'il s'agit d'un mur. Si un calque n'a pas de nom, le système utilise la géométrie pour deviner.

L'éditeur

J'ai construit l'éditeur en utilisant un contexte Canvas 2D brut. Pour maintenir la rapidité, j'ai utilisé trois couches :

  • Couche 1 : La grille statique et les lignes originales.
  • Couche 2 : Le modèle (murs, pièces, portes).
  • Couche 3 : Le curseur actif et les aperçus.

Cela a permis de maintenir un taux de rafraîchissement de 60 FPS, même avec près de 1 000 murs.

Le Copilote IA

Je ne voulais pas d'un chatbot qui se contente de parler. Je voulais un agent qui agit. J'ai donné à Claude treize outils pour lire et modifier le modèle.

Pour garantir la sécurité, j'ai suivi trois règles :

  • Un seul chemin d'écriture : L'IA utilise exactement le même code validé que l'interface utilisateur manuelle. Si l'interface ne peut pas l'enregistrer, l'IA ne peut pas l'enregistrer.
  • Erreurs récupérables : Si l'IA essaie de placer une porte là où elle ne rentre pas, l'outil renvoie une erreur. L'IA lit cette erreur et essaie un autre endroit.
  • Une gestion de l'annulation : Chaque action de l'IA est intégrée dans une transaction unique. Si l'IA commet une erreur, une pression sur Ctrl+Z règle tout.

Les leçons

  • Les bugs de géométrie se cachent dans les formes que vous ne testez pas. Les bâtiments rectangulaires sont faciles. Les bâtiments en L cassent tout.
  • Faites du fuzzing sur vos outils. Le LLM est un fuzzer. Accueillez-le avec des limites de code strictes.
  • La partie difficile n'est pas l'IA. C'est la fondation de données. Parce que la géométrie était solide, l'intégration de l'IA a pris quelques jours au lieu de quelques semaines.

Source: https://dev.to/arif/i-built-a-cad-editor-in-the-browser-then-taught-an-llm-to-use-it-1l92