Vectorisation SVG : tester toutes les méthodes (avec l’IA)

Dans le cadre de mon pipeline de coloriages, je travaille avec l’IA pour explorer différentes façons de transformer mes dessins PNG en fichiers SVG vectoriels. Ce n’est pas un processus unique — il existe plusieurs méthodes, chacune avec ses forces et ses limites. Cet article documente mes tests sur mes coloriages spécifiquement : des traits noirs nets sur fond blanc. C’est le cas le plus simple pour la vectorisation — mais même là, les réglages changent le résultat. Pour d’autres types d’images (photos, illustrations nuancées, dégradés), il faudrait d’autres tests, d’autres réglages.

J’ai réalisé ces tests sur une image de la série Revue Rétro — une silhouette pin-up de style affiche, avec de grands aplats et des contours nets.

Note : même sur du trait pur, les surprises existent. Un coloriage qui semble tout noir peut avoir des zones légèrement grises (anti-aliasing, compression JPG, ombres subtiles) qui réagissent différemment selon la méthode. C’est ce que ces tests permettent de voir.

Voir aussi : Premier article — La méthode de base : vectoriser ses coloriages en SVG

Cliquer sur une image pour l’agrandir. Cliquer à nouveau pour fermer.

Les deux grandes familles de vectorisation

Avant de parler de réglages, il faut comprendre que les méthodes de vectorisation se divisent en deux familles fondamentalement différentes :

• Remplissage de zones — on détecte les zones noires et on les remplit. Le SVG obtenu est une forme pleine. C’est la méthode que j’utilise principalement (OpenCV findContours).
• Tracé de lignes centrales — on réduit chaque trait à sa ligne médiane, puis on le trace comme un stroke SVG avec une épaisseur choisie. Utile quand l’image source a des lignes isolées plutôt que des zones pleines.

Il y a aussi une troisième approche intermédiaire : la détection de contours Canny, qui trace les arêtes de contraste plutôt que de remplir des zones.

Méthode 1 — Remplissage par seuil (ma méthode principale)

Pipeline en 4 étapes : conversion en niveaux de gris → flou gaussien → seuillage binaire → détection de contours (findContours RETR_CCOMP) → SVG avec fill-rule="evenodd" pour préserver les trous (l’intérieur d’un O, par exemple).

Paramètre 1 : le seuil (threshold)

Le seuil décide à partir de quelle valeur de gris un pixel est considéré comme « noir ». Un seuil bas (60) capture les demi-tons gris. Un seuil haut (200) ne retient que le noir pur.

Pour des images de style affiche avec des aplats francs, les deux seuils donnent un résultat similaire. Sur une image avec des dégradés ou des zones légèrement grises (visage avec ombres douces, compression JPG), le seuil fait une vraie différence : trop haut, on perd des détails fins ; trop bas, on capte du « bruit » gris et le SVG s’alourdit.

Valeur conseillée pour mes coloriages : 128 (valeur médiane — bon équilibre).

Paramètre 2 : le lissage des contours (Chaikin)

Après détection, les contours sont faits de segments droits pixel par pixel. L’algorithme de Chaikin « coupe les coins » à chaque itération, ce qui arrondit progressivement les angles.

La différence est visible sur les courbes : sans lissage, la silhouette a des micro-angles aux transitions. Avec 2 itérations de Chaikin, les courbes semblent dessinées à la main. À 3 itérations, le lissage devient excessif et peut arrondir des angles qui devraient rester nets (coin de col, bord de chapeau).

Valeur conseillée : 1 à 2 itérations selon l’image.

Paramètre 3 : la simplification (Douglas-Peucker)

Avant le lissage Chaikin, l’algorithme de Douglas-Peucker élimine les points « inutiles » d’un contour selon un seuil de tolérance epsilon (en pixels). Un epsilon à 0 conserve tous les points. Un epsilon élevé (3,0) peut perdre des détails fins au profit d’un SVG plus léger.

Pour des formes simples et des traits nets, un epsilon élevé peut donner un look « vectoriel stylisé » intéressant. Pour des images avec beaucoup de détails ou des courbes complexes (visage, mains, plumes), il vaut mieux rester bas (0,5 à 0,8) pour ne pas perdre d’information.

Valeur conseillée : 0,8 px — bon compromis fidélité/légèreté.

Méthode 2 — Détection de contours Canny

Au lieu de chercher des zones noires à remplir, l’algorithme Canny cherche les arêtes de contraste dans l’image. Il travaille en deux passes avec deux seuils : un seuil bas pour détecter les arêtes faibles, un seuil haut pour les arêtes fortes.

Résultat très différent : Canny produit des contours fins là où il y a du contraste — y compris les deux bords d’un trait épais. Sur un dessin au trait, ça peut doubler les lignes (c’est la surprise classique). Canny est plus adapté aux illustrations nuancées, aux photos, ou aux images où on veut « tracer les bords » plutôt que « remplir les zones ».

Méthode 3 — Squelettisation

La squelettisation réduit chaque zone noire à sa ligne centrale — un seul pixel d’épaisseur. On trace ensuite cette ligne centrale comme un stroke SVG avec une épaisseur choisie. C’est la réponse au problème des traits épais : avec la squelettisation, l’épaisseur du trait dans le SVG est entièrement indépendante de l’original.

Sur une silhouette pleine, la squelettisation trace seulement le périmètre (effet « fil de fer »). Mais sur un dessin au trait avec des lignes de 5 à 10 px d’épaisseur, elle retrouve la ligne centrale et permet de redéfinir librement l’épaisseur dans le SVG — utile quand les traits d’origine sont irréguliers ou quand on veut uniformiser le résultat.

Avantage : épaisseur du trait entièrement maîtrisée dans le SVG final.
Limite : mal adapté aux aplats et silhouettes — donne un résultat « fil de fer » non voulu.

Comparatif résumé

Méthode	Idéale pour	Surprise possible	Poids SVG
Seuil + fill	Aplats, style affiche, traits nets	Perd les nuances fines si seuil trop haut	Léger
Canny	Photos, illustrations nuancées	Double les lignes sur les traits épais	Très léger
Squelettisation	Dessins au trait, épaisseur à redéfinir	Aplats → fil de fer inattendu	Moyen

Ce que j’utilise et pourquoi

Pour mes coloriages de la série « Bold » (aplats forts, style affiche), la méthode seuil + fill avec lissage Chaikin est la plus adaptée. Elle préserve la silhouette, donne un résultat propre sans avoir à régler beaucoup de paramètres, et le SVG résultant est très léger.

Pour les séries avec des visages ou des détails fins, j’explore avec l’IA un seuil plus bas (100 au lieu de 128) pour ne pas perdre les ombres légères des traits de visage. C’est le genre d’ajustement qui ne se voit pas sur une affiche, mais qui peut tout changer sur un portrait.

La squelettisation m’intéresse pour un cas précis : produire une version à traits uniformes à partir d’un dessin où les lignes ont des épaisseurs variables, ou quand je veux contrôler moi-même l’épaisseur finale du SVG indépendamment du dessin d’origine.

La suite

Ces tests font partie d’un pipeline plus large que je construis avec l’aide de l’IA : trier les images, les vectoriser, les décrire automatiquement, puis les packager en PDF à télécharger. Je partagerai la suite au fur et à mesure.

Si tu as des questions sur la méthode ou si tu veux essayer la vectorisation sur tes propres dessins, laisse un commentaire !

→ Lire le premier article : La méthode de base — vectoriser ses coloriages en SVG