{"id":38967,"date":"2023-08-25T17:34:41","date_gmt":"2023-08-25T15:34:41","guid":{"rendered":"https:\/\/www.lemonskin.net\/io\/?p=38967"},"modified":"2026-04-07T16:08:01","modified_gmt":"2026-04-07T14:08:01","slug":"oggi-creiamo-un-font","status":"publish","type":"post","link":"https:\/\/www.lemonskin.net\/io\/38967\/","title":{"rendered":"Oggi creiamo un font"},"content":{"rendered":"\n
\"\"<\/figure>\n\n\n\n

Non mi \u00e8 mai piaciuto realizzare font, perch\u00e9 \u00e8 un processo lungo e noioso. Ma negli ultimi anni mi sono ritrovato a doverne creare un bel po’ per necessit\u00e0 personali.<\/p>\n\n\n\n

I primi sono stati quelli delle rune dei Nani<\/a> 1<\/a><\/sup>Nello specifico si tratta di\u00a0Futhorc<\/em>, ovvero di un adattamento da parte di Tolkien, che all’epoca dello Hobbit<\/em> non aveva ancora elaborato un linguaggio complesso, delle antiche rune anglosassoni.<\/span> e della mappa di Thr\u00f3r<\/a>. Poi, un po’ per scherzo, \u00e8 arrivato il font della prima edizione<\/a> italiana del Signore degli Anelli. In seguito ho realizzato le rune del Signore degli Anelli<\/em><\/a>, che sono differenti da quelle nello Hobbit<\/em>.2<\/a><\/sup>In questo caso si tratta di Angerthas, una forma di linguaggio completa realizzata da Tolkien per il suo romanzo pi\u00f9 celebre.<\/span> A seguire \u00e8 arrivato quello del nuovo Contrattone<\/a>. L’ultimo in ordine di apparizione mi \u00e8 servito per la mia mappa pi\u00f9 recente, quella di Christopher<\/a>. Negli ultimi due casi, il progetto finale l’ho realizzato con calligrafia a mano, ma i font mi sono stati molto utili per esercitarmi.<\/p>\n\n\n\n\n\n\n\n

Nessuno di questi font \u00e8 completo, mancano un sacco di caratteri, come numeri e punteggiatura, e non possono quindi essere usati per una scrittura reale su computer. Sono piccoli abbozzi, ampiamente migliorabili, ma perfetti per i miei scopi.<\/p>\n\n\n\n

Essendomi recentemente comprato un nuovo Mac, posso finalmente tornare a lavorare su progetti pi\u00f9 complessi, come la rielaborazione dell’Atlante della Terra di Mezzo<\/em>, la cui traduzione italiana non mi ha mai soddisfatto. Senza tirarla troppo lunga (si tratta di un lavoro lento e laborioso: non sar\u00e0 pronto, credo, almeno fino al prossimo anno) avevo la necessit\u00e0 di creare dei piccoli font numerici e alfabetici, per associare i luoghi del testo alle relative aree sulle mappe del libro:<\/p>\n\n\n\n

\"\"
Il testo dell’Atlante<\/figcaption><\/figure>\n\n\n\n
\"\"
Una delle mappe dell’Atlante (dettaglio)<\/figcaption><\/figure>\n\n\n\n

L’unico font che ho trovato, e che si avvicinava lontanamente a ci\u00f2 di cui avevo bisogno, si chiama Fyra<\/a><\/em> ed \u00e8 a pagamento. Il problema \u00e8 che non mi piaceva lo stile grafico a causa delle lettere troppo differenti dal Simoncini Garamond<\/em> usato nella quasi totalit\u00e0 dei libri stampati.<\/p>\n\n\n\n

Quindi, sebbene a malincuore (ho gi\u00e0 detto che odio realizzare font?), ieri pomeriggio mi sono messo al lavoro e ho creato ben sei varianti differenti: quattro sono numeriche e due alfabetiche.3<\/a><\/sup>Le piccole A e B che vedi in grigio nel testo in alto, e che rappresentano la specifica mappa in cui \u00e8 presente il pallino.<\/span> Le puoi vedere nell’immagine di apertura dell’articolo.<\/p>\n\n\n\n

Bene, dopo questo lungo preambolo ti mostro come \u00e8 possibile realizzare un font utilizzando esclusivamente tool<\/em> gratuiti su Internet (ho provato a usare alcuni specifici programmi per desktop, ma li ho trovati tutti o troppo complessi, o troppo limitati). Non sar\u00e0 una guida passo passo, coprir\u00f2 rapidamente i passaggi fondamentali. Non voglio fare il professorino, questo articolo servir\u00e0 al me<\/em> del futuro la prossima volta che dovr\u00e0 creare un nuovo font; cos\u00ec non sar\u00e0 costretto ricordarsi e (r)imparare tutto da capo.<\/p>\n\n\n\n

Calligraph<\/h2>\n\n\n\n

Calligraph<\/a> \u00e8 un meraviglioso sito online che consente di costruire un font molto velocemente. \u00c8 fondamentalmente un servizio a pagamento, ma fornisce comunque la possibilit\u00e0 di procedere in modo gratuito, bench\u00e9 limitato.<\/p>\n\n\n\n

Si scarica un template e con un programma di disegno si compilano tutte le caselle dei caratteri:<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

A questo punto lo si carica sul sito e si preme “Build Font”:<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Come ho detto, essendo una sorta di demo, non ha tutte le caselle dei caratteri. Mancano per esempio i numeri, le lettere accentate e tanti altri simboli di punteggiatura. Quello che faccio di solito \u00e8 creare un secondo template, nel quale aggiungo i rimanenti caratteri nelle caselle delle lettere, e salvo un secondo font. Nel passo successivo vedremo come passare i vari caratteri dall’uno all’altro e riposizionarli correttamente.<\/p>\n\n\n\n

Glyphr<\/h2>\n\n\n\n

Glyphr<\/a> \u00e8 un potentissimo editor online, ed \u00e8 il vero cuore della creazione.<\/p>\n\n\n\n

Si carica il font creato con Calligraph e si pu\u00f2 cominciare a modificare tutto quello che si vuole. Ci sono a disposizione potenti strumenti per ruotare, ingrandire, ridurre gli elementi e, volendo, ridisegnarli da zero (ma lo sconsiglio, \u00e8 un’operazione poco pratica):<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Non star\u00f2 qui a elencare tutte le caratteristiche di Glyphr, ma una cosa \u00e8 importante ricordarla: salvare al termine di ogni singola modifica (viene creato un file di testo, e da quel momento si utilizzer\u00e0 quello, anche per caricare il progetto; il font iniziale lo si pu\u00f2 buttare). Questo perch\u00e9, essendo un’applicazione Web, tende a usare sempre pi\u00f9 memoria del browser fino a quando non crasha<\/em>. Non \u00e8 questione di “se” ma di “quando”. Solitamente una volta ogni 5-10 minuti. \u00c8 una rottura, ma non ci sono alternative.<\/p>\n\n\n\n

Ora, per passare un carattere da un file di un font all’altro bisogna procedere col metodo dell’esportazione \/ importazione (questo perch\u00e9 ogni tab<\/em> del browser \u00e8 una sandbox<\/em> chiusa che non pu\u00f2 dialogare con le altre). Occorre avere i due font in modifica in due editor (e dunque in due tab<\/em> del browser), esportare un carattere alla volta via SVG (\u00e8 un formato vettoriale) dal file di origine e importarlo in quello di destinazione. A volte si va a perdere la dimensione originale, per cui bisogna smanettare un po’ (ma lo si pu\u00f2 fare facilmente inserendone i valori nei campi di testo). \u00c8, come ho detto, un processo lungo e noioso, ma con un po’ di pazienza porta a risultati molto appaganti.<\/p>\n\n\n\n

Semplificando<\/h2>\n\n\n\n

Volendo si pu\u00f2 anche saltare del tutto l’utilizzo dei template di Calligraph (e, di conseguenza, Calligraph stesso). \u00c8 sufficiente disegnarsi le singole lettere con un programma di grafica e poi utilizzare un servizio di conversione gratuita (come questo<\/a>) per trasformarle il SVG. Anzi, \u00e8 un sistema migliore, perch\u00e9 Calligraph non crea elementi vettoriali molto precisi (ma fa risparmiare una marea di tempo).4<\/a><\/sup>La conversione funziona cos\u00ec: vengono analizzate le forme del disegno e si tracciano una serie di curve, in modo da trasformare un’immagine bitmap in una vettoriale. Il risultato pu\u00f2 essere molto fedele, ma mai preciso alla perfezione. A seconda dell’approssimazione utilizzata dall’utility, si possono ottenere risultati migliori o peggiori.<\/span> I miei font pi\u00f9 recenti, quelli con palline e quadratini, li ho creati senza Calligraph. Le figure geometriche le ho realizzate con Glyphr (ripeto, non \u00e8 comodo, ma per oggetti molto semplici conviene, pi\u00f9 che altro perch\u00e9, per esempio, un cerchio \u00e8 un vero cerchio, e non una figura realizzata da un convertitore che cerca di seguire il perimetro di un cerchio apportando molta approssimazione), mentre il testo \u00e8 un’immagine grafica ad alta risoluzione convertita in SVG col sito che ho linkato sopra.<\/p>\n\n\n\n

Un esempio pratico<\/h2>\n\n\n\n

Diciamo che voglio aggiungere ai miei font delle freccette direzionali. Magari possono tornarmi utili in qualche occasione (o magari no, ma sempre meglio averle).<\/p>\n\n\n\n

Primo, disegno una freccetta a una buona risoluzione5<\/a><\/sup>Essendo un design molto semplice, potrei farlo con Glyphr, ma mi porterebbe via almeno tre volte il tempo che impiego con altri programmi.<\/span> e la esporto come PNG, che \u00e8 un formato grafico non distruttivo (al contrario, per esempio, del JPEG che comprime e rovina l’immagine originale), usando uno sfondo trasparente:6<\/a><\/sup>Non ho indagato bene nel dettaglio, magari il software di conversione \u00e8 in grado di isolare automaticamente il bianco, ma meglio non correre rischi.<\/span><\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Non \u00e8 necessario inserire i cerchietti o i rettangolini perch\u00e9 li ho gi\u00e0 dentro le lettere del font. Sar\u00e0 sufficiente copiarli da un carattere esistente. Cos\u00ec come non serve creare pi\u00f9 di una freccia, perch\u00e9 questa la potr\u00f2 ruotare direttamente in Glyphr.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Inserisco l’immagine nel sito di conversione, ricordandomi di scegliere il formato SVG e importo il file cos\u00ec creato all\u2019interno dell\u2019editor.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Ed eccola qui. Ora non devo fare altro che inserire il bordino, ruotarla nelle varie direzioni e assegnarla ai relativi bottoni della tastiera:<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Al termine del lavoro si salva il file .TXT di Gliphr, che andr\u00e0 utilizzato in futuro se si desidera modificare il font, e si genera il font vero e proprio, che ha estensione .OTF (Open Type Format, una versione pi\u00f9 recente del vecchio .TTF).<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Questo \u00e8 il font terminato (in realt\u00e0 sono due, uno pieno e uno vuoto), al lavoro su Pages (l’equivalente Mac di Microsoft Word).<\/p>\n\n\n\n

Ho assegnato alle freccette i primi otto tasti numerici, con il modificatore OPTION (ALT) per quelle vuote, e SHIFT + OPTION per quelle piene.<\/p>\n\n\n\n

Esattamente come accade per tutti i miei altri font anche questi sono strettamente legati al layout e alle personalizzazioni dei tasti della mia tastiera<\/a>, in combinazione con gli shortcut<\/em> del Mac, per cui non ci sarebbe corrispondenza su altre (leggi: \u00e8 praticamente inutilizzabile al di fuori di casa mia).<\/p>\n\n\n\n

Per\u00f2 adesso sai come creartelo tu un font da zero, quindi non hai pi\u00f9 bisogno di me. :)<\/p>\n","protected":false},"excerpt":{"rendered":"

Non mi \u00e8 mai piaciuto realizzare font, perch\u00e9 \u00e8 un processo lungo e noioso. Ma negli ultimi anni mi sono ritrovato a doverne creare un bel po’ per necessit\u00e0 personali. I primi sono stati quelli delle rune dei Nani 1Nello specifico si tratta di\u00a0Futhorc, ovvero di un adattamento da parte di Tolkien, che all’epoca dello… <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_stopmodifiedupdate":false,"_modified_date":"","advgb_blocks_editor_width":"","advgb_blocks_columns_visual_guide":"","jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[38,15],"tags":[111259,111281,111135,111247,111321,111362],"class_list":["post-38967","post","type-post","status-publish","format-standard","hentry","category-arte","category-informatica","tag-amm","tag-calligrafia","tag-computer","tag-creazioni","tag-font","tag-lr"],"acf":[],"author_meta":{"display_name":"lock","author_link":"https:\/\/www.lemonskin.net\/io\/author\/lock\/"},"featured_img":null,"jetpack_featured_media_url":"","coauthors":[],"tax_additional":{"categories":{"linked":["arte<\/a>","informatica<\/a>"],"unlinked":["arte<\/span>","informatica<\/span>"]},"tags":{"linked":["AMM<\/a>","calligrafia<\/a>","computer<\/a>","creazioni<\/a>","font<\/a>","lr<\/a>"],"unlinked":["AMM<\/span>","calligrafia<\/span>","computer<\/span>","creazioni<\/span>","font<\/span>","lr<\/span>"]}},"comment_count":"0","relative_dates":{"created":"Pubblicato 3 anni fa","modified":"Aggiornato 3 giorni fa"},"absolute_dates":{"created":"Pubblicato il 25 Agosto 2023","modified":"Aggiornato il 7 Aprile 2026"},"absolute_dates_time":{"created":"Pubblicato il 25 Agosto 2023 17:34","modified":"Aggiornato il 7 Aprile 2026 16:08"},"featured_img_caption":"","series_order":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.lemonskin.net\/io\/wp-json\/wp\/v2\/posts\/38967","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.lemonskin.net\/io\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.lemonskin.net\/io\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.lemonskin.net\/io\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.lemonskin.net\/io\/wp-json\/wp\/v2\/comments?post=38967"}],"version-history":[{"count":1,"href":"https:\/\/www.lemonskin.net\/io\/wp-json\/wp\/v2\/posts\/38967\/revisions"}],"predecessor-version":[{"id":49852,"href":"https:\/\/www.lemonskin.net\/io\/wp-json\/wp\/v2\/posts\/38967\/revisions\/49852"}],"wp:attachment":[{"href":"https:\/\/www.lemonskin.net\/io\/wp-json\/wp\/v2\/media?parent=38967"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.lemonskin.net\/io\/wp-json\/wp\/v2\/categories?post=38967"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.lemonskin.net\/io\/wp-json\/wp\/v2\/tags?post=38967"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}