Nouvelle signature, nouveaux problèmes de dessin

J’ai voulu refaire ma signature car je n’étais pas satisfaite du résultat de ma première version. Au lieu d’utiliser ma tablette, son crayon et Clip Studio Pro, j’ai suivi à la lettre la technique présentée dans le tutoriel de Code with Sam sur udemy : avec Adobe Illustrator, écrire avec le crayon et un trait de 1pt. Voici le résultat :

Après optimisation avec SVG OMG, je reporte le code obtenu dans VS Code et anime le stroke-dashoffset. Le résultat est loin d’être celui recherché! On dirait que ce n’est pas le même code SVG que le premier ci-haut mais oui, c’est bien pareil. La technique d’animation du trait ne fonctionne donc pas encore car le trait est double.

Une capture d’écran montrant le trait dans Illustrator. Ceci n’est donc pas un trait pour le SVG même si ce l’est pour Adobe : il n’y a aucun remplissage, ce n’est qu’un trait de 1pt.

Pour m’approcher de l’objectif souhaité, j’ai éliminé du code des <path>s directement dans VS Code. L’animation ne jouerait pas en boucle normalement mais elle est en continu pour observation. Remarquez que lorsqu’il y a des rondeurs, le trait remonte ensuite sur le chemin d’où il venait.

Post

Je n’ai pas encore découvert comment régler le problème pour une signature manuscrite, en utilisant Adobe Illustrator. Par contre, en lisant un autre tutoriel, sur un autre sujet mais qui utilise aussi la technique d’animation avec le stroke-dashoffset, l’auteur, Louis Hoebregts, donne ces informations :

Ainsi, il semble bien possible de pouvoir le faire de manière manuscrite. Ses indication sur le trait unique éclaire. Peut-être serait-ce plus simple avec Inkscape. J’ai toujours voulu l’essayer (et m’affranchir d’Adobe 😉 ).