Créer une police à partir de sa propre écriture manuscrite

 (chameth.com)
1 points par GN⁺ 2025-09-07 | 1 commentaires | Partager sur WhatsApp
  • Afin de donner plus de personnalité à son site web personnel, l’auteur a essayé de créer lui-même une police manuscrite
  • L’usage d’outils open source comme FontForge et Inkscape s’est révélé peu intuitif et contraignant
  • Finalement, grâce au service payant Calligraphr, il a pu générer et modifier facilement une police basée sur son écriture
  • Des ajustements fins et corrections répétées ont été nécessaires, mais le résultat final lui a apporté une grande satisfaction
  • Il recommande également Calligraphr pour sa politique commerciale pensée pour l’utilisateur

Une tentative pour ajouter de la personnalité à un site web personnel

  • Il voulait que son site web, contrairement à des sites d’entreprise fades, dégage une atmosphère plus personnelle et singulière
  • Il ajoutait déjà de petits effets originaux aux images, liens et autres éléments pour apporter des variations visuelles
  • Au lieu d’une police monospace classique, il voulait utiliser une écriture cursive au style manuscrit, mais ne trouvant aucune police adaptée, il a décidé de la créer lui-même

Tentative avec des outils open source, puis abandon

  • Il a essayé de créer une police vectorielle à l’aide d’outils open source comme Inkscape et FontForge
    • À l’aide d’une tablette graphique, il a dessiné les majuscules A, B, C, les a enregistrées en SVG, puis a tenté de les importer dans un éditeur de polices
    • Il a été frustré par l’expérience utilisateur peu agréable de FontForge et par une interface peu intuitive
    • Même pour des opérations de base comme sélectionner un fichier, l’importer ou charger un SVG, il a dû faire face à de nombreux tâtonnements et à beaucoup de lourdeur
    • Lors de l’édition des glyphes, il a aussi trouvé les poignées de Bézier difficiles à manipuler
    • Les messages d’erreur répétés et les déplacements fastidieux entre chemins et menus l’ont finalement conduit à abandonner en cours de route
  • Il a aussi essayé la fonctionnalité de création de police SVG d’Inkscape, mais a constaté qu’il fallait fusionner chaque glyphe en un seul tracé et posséder des connaissances en édition vectorielle, ce qui rendait le processus complexe et inefficace

Le choix d’un service web payant : Calligraphr

  • En cherchant divers tutoriels open source, il a découvert l’existence d’un service closed source appelé Calligraphr
    • La version gratuite impose des limites sur les ligatures, les variantes et un maximum de 75 glyphes, mais les fonctions premium sont accessibles avec un paiement unique d’un mois
    • Il a particulièrement apprécié le fait de pouvoir payer une seule fois, sans renouvellement automatique, ainsi que la transparence de la politique tarifaire
  • Utilisation de Calligraphr
    • Le principe consiste à imprimer un modèle, écrire dessus à la main, puis le scanner avant de l’envoyer au service
    • Le modèle peut inclure différents types de caractères, symboles et ligatures sélectionnés à l’avance
    • Il est possible de créer plusieurs versions pour les évaluer et choisir la meilleure, et il a aussi ajouté des ligatures personnalisées adaptées au titre de son blog
    • Il a utilisé un feutre Sharpie pour obtenir une écriture épaisse et nette
    • Il a utilisé la fonction de numérisation de documents de l’iPhone pour scanner en PDF puis téléverser le fichier

Amélioration itérative de la police et ajustements fins

  • L’interface web de Calligraphr permet de prévisualiser la police et de tester directement son rendu
    • Il a appliqué la police à son vrai site web afin de vérifier la lisibilité et le design à différentes tailles
  • La première version présentait des problèmes, notamment des lettres mal alignées sur la ligne de base, et il a pu les corriger finement grâce aux fonctions d’ajustement de position et de taille
  • Il a réduit l’espacement entre les lettres (kerning) afin de donner cette sensation de continuité naturelle propre à l’écriture manuscrite
  • Certains glyphes contenaient du bruit scanné en dehors de leur zone, ce qui créait des espacements étranges
    • Réduire simplement la largeur laissait des points isolés dans les phrases
    • Il a pu corriger cela proprement en supprimant complètement les pixels inutiles avec l’outil d’édition
  • Ce travail répétitif lui a finalement semblé agréable, car les améliorations étaient clairement visibles à chaque étape

Résultat et expérience positive avec Calligraphr

  • La police terminée donne au header, aux légendes et à d’autres éléments du site une apparence proche de sa véritable écriture, correspondant bien à la personnalité recherchée
  • Grâce à l’épaisseur du Sharpie, la lisibilité reste excellente même en petite taille
  • Par rapport aux outils open source, il a concrètement ressenti l’efficacité d’un résultat obtenu en peu de temps et à moindre coût
  • Même après la fin de l’abonnement, Calligraphr exporte automatiquement une sauvegarde des données utilisateur
    • Au format JSON, elle contient toutes les informations sur les glyphes ainsi que les données d’image, ce qui permet de les réutiliser plus tard lors d’un nouvel abonnement ou d’éditions supplémentaires
    • Il a été impressionné par des pratiques commerciales favorables aux utilisateurs, comme une politique claire en amont, l’absence d’incitation aux paiements récurrents et la mise à disposition transparente des données
  • Pour quiconque voudrait tenter la même chose, c’est une expérience recommandable, ne serait-ce que pour la simplicité et l’approche orientée client de Calligraphr

À lire aussi

1 commentaires

 
GN⁺ 2025-09-07
Commentaires sur Hacker News
  • En 2013, j’ai fait quelque chose de similaire pour le site web de mon mariage. J’ai utilisé un service postal pour créer un TTF correct, puis je l’ai converti en WOFF. C’est toujours en ligne sur https://ruthandjosh.net/story/ (attention, ambiance millennial)
    • Maintenir un site avec des liens encore vivants à notre époque, c’est vraiment impressionnant
    • Cette histoire est vraiment magnifique, je n’ai ressenti aucun malaise
    • Merci de partager cette part de cringe, ça m’a permis de très bien finir la semaine. Shabbat shalom
    • Ce site est vraiment superbe. Le design et la mise en page donnent même une impression assez intemporelle
    • Je me demande si Ruth a vraiment bu du champagne seule dans l’avion
  • J’admire l’effort et le parcours. Je comprends ce choix honnête d’abandonner une alternative open source pour une solution bon marché qui permet d’avoir quelque chose à soi. Mon histoire est un peu similaire. Je suis aussi un créatif autodidacte, donc il m’arrive parfois de m’obstiner parce que je veux absolument essayer une technique ou un outil en particulier. Je ne sais pas si ça vient du coût irrécupérable ou du perfectionnisme. Le design du site a énormément de personnalité. PS : je l’ai ajouté aux favoris dans mon navigateur Firefox sous fonts, developer-blog, creative-sites, boutique-designs
  • Mon écriture est vraiment horrible, et plus j’écris, pire c’est. C’est un cercle vicieux. Comme j’écris mal, je tape tout au clavier, et comme je ne m’exerce pas, ça empire. Si je faisais une police à partir de mon écriture, on pourrait sans doute l’utiliser comme hachage cryptographique. Cela dit, j’aime bien l’idée en elle-même. Je n’ai pas l’impression qu’écrire un message à la main soit moins personnel que le taper, mais en pratique, ça paraît quand même un peu moins personnel. Une police manuscrite pourrait compenser un peu cette sensation
    • Ça irait bien comme police pour une pochette d’album de black metal
    • Je pense que ce phénomène du type « il existe une manière plus simple, donc on ne ressent même plus le besoin d’apprendre la compétence » est devenu un vrai problème aujourd’hui. À force de n’apprendre que des systèmes faciles, on finit par n’apprendre non pas une vraie compétence, mais seulement à utiliser le système. Par exemple, mon coloc sait seulement utiliser un système d’aiguisage, mais il ne sait pas aiguiser un couteau à la main. Sans le système, il ne peut rien faire. Il y a vraiment beaucoup de gens comme ça maintenant. Ils suivent juste le manuel, sans comprendre le lien avec le pourquoi. À l’échelle de la société aussi, les compétences de base se sont sérieusement affaiblies, probablement parce que le capitalisme a transformé tout cela en modèle où l’on paie pour gagner du temps
  • Si je ne me trompe pas, Microsoft Font Maker fonctionne toujours gratuitement sur les stylets Windows Ink (même si les performances peuvent être un peu limitées). Je ne me souviens plus de ce que j’utilisais à l’époque, mais je crois que c’était inclus dans les PowerToy pour Windows Tablet PC. https://apps.microsoft.com/detail/9n9209f8s3vc?hl=en-US&gl=US
  • J’ai subi des violences étant enfant, donc mon écriture est vraiment très mauvaise. Je suis aussi nul en cursive. S’il existait une police faite à partir de mon écriture, tout le monde se dirait probablement : « Waouh, les parents de cette personne devaient être sacrément irresponsables. » Dans Microsoft Word, le nom de la police apparaîtrait comme « Danny Wets The Bed ». C’est une blague, mais j’ai beaucoup aimé lire le texte, et c’est un excellent billet
  • Quand j’étais adolescent, j’ai déjà créé une ttf-font à partir de l’écriture de la fille que j’aimais pour lui offrir. J’avais vraiment sous-estimé ce travail. J’ai utilisé un outil inclus dans Corel Draw Suite, j’ai scanné l’alphabet qu’elle avait écrit, puis j’ai vectorisé chaque caractère à la main. C’était un travail énorme et fastidieux. Vingt-cinq ans ont passé depuis, et je suis encore étonné par la pureté de l’élan que j’avais à l’époque. J’ai investi un temps fou juste pour faire un cadeau d’anniversaire, alors qu’en réalité je ne savais même pas vraiment ce que je faisais pendant la majeure partie du processus. J’ai fini par y arriver, mais j’ai l’impression que ce n’était possible que parce que je n’y connaissais rien
    • Bien mieux qu’une mixtape. Si j’écrivais quelque chose de ma main, ce serait presque une punition
    • Je me demande ce qui s’est passé avec elle après ça. J’aimerais savoir si tout cet effort en valait la peine, et si ça s’est bien terminé
  • Je me demande si la technologie est désormais assez avancée pour qu’on ne puisse pratiquement plus distinguer le résultat d’une vraie écriture manuscrite. Et si on utilisait ça pour rendre des devoirs manuscrits exigés par des professeurs, est-ce qu’on pourrait passer entre les mailles du filet sans se faire repérer ? Bien sûr, c’est un scénario purement hypothétique
  • Je me demande s’il existe un moyen de transformer en véritable fichier de police l’approche qu’Amy Goodchild a essayée ( https://www.amygoodchild.com/blog/cursive-handwriting-in-javascript )
    • Ce serait probablement un problème de « traduction » des chemins de Chaikin en courbes de Bézier. On pourrait alors en faire une police Metafont, puis la convertir en ttf, otf, etc.
  • D’autres personnes ont suivi un chemin similaire
    • Il existe aussi l’excellente police Tekton, bien plus ancienne. Elle est basée sur l’écriture manuscrite de l’architecte Frank D.K. Ching, mais le design proprement dit a été réalisé par David Siegel chez Adobe
  • C’est un travail vraiment formidable. Merci de l’avoir partagé. Je prépare en ce moment un atelier avec des enfants, dans lequel je voudrais leur faire vivre l’expérience de « dessiner eux-mêmes » leur propre site web ou webapp. Jusqu’ici, je n’y avais pas inclus la création de police, parce que je ne savais pas comment faire, mais maintenant je le sais. Merci beaucoup ! Si vous avez d’autres idées pour rendre ce genre d’atelier plus amusant, j’aimerais beaucoup les entendre. Par exemple, je voulais essayer une transition naturelle entre l’analogique et le numérique, en créant un prototype sur papier puis en le transformant en dummy cliquable fonctionnel. Pour info, quand je parle d’enfants ici, ils ont entre 8 et 10 ans
    • Bonjour, si vous êtes d’accord, j’aimerais moi aussi y contribuer. J’ai toujours voulu enseigner les technologies créatives aux enfants de ma ville natale. Je suis au Nigeria / en Afrique, et j’utilise JavaScript sans guillemets simples ni points-virgules