Jak vytvořit vlastní font

Dnešní článek bude prvním ze série o „typografii“. Avšak vyhneme se dnes jakékoli teorii a zaměříme se čistě na to, jak z obyčejného nákresu na papíru udělat digitální a funkční font. 

  1. Jaký font vytvořit?
  2. Skicování
  3. Převedení do vektorů
  4. Převedení do Glyphs mini/FontForge
  5. Export

pokud nevlastníte software, který vám převede skicu do vektorů, jako například Adobe Illustrator, přeskočte krok 2. a 3.

Četla jsem už několik rad od logotvůrců a vesměs všichni radí jedno; nejlepší je, když si font vytvoříte jednoduše sami. Firma se tím bude několik let prezentovat, tak proč neudělat něco unikátního? Avšak toto pravidlo samozřejmě neplatí pro všechny případy, pokud chcete vytvořit běžný web případně plakát, tak nejspíš sáhnete po nějakém jednoduše dostupném fontu. Největší výhodou vytvořením vlastního fontu je, že předcházíte problémům s autorskými právy a s licencemi. 

Nejsem právník, proto má nejlepší rada pro vás bude jen, abyste si dávali pozor a licence si pořádně kontrolovali.

Kde najít font, když ho nechci vytvářet?

Měli byste znát licence: „personal use“ (pouze pro vaše vlastní užití, nevydělává žádné peníze) a „commercial use“ (komerční užití, vyděláváte peníze). Nejlepším řešením je font, který obsahuje obě licence. 

Pozor na stránku dafont.com – je známá svojí pestrostí a všemožnými dostupnými fonty. Důvod proč jí zmiňuji je ten, že je oblíbená I mezi blogery. Fonty se sice uvádí jako “free,” ale velmi často jsou jenom pro osobní použití. 

Nejlepší stránkou za mě bude nejspíš fonts.google.com kde snadno naleznete fonty pro komerční užití. Platí stále, abyste si licenci vždy zkontrolovali, ať už stahujete font odkudkoli!

Další zdroje pro bádání:

https://www.1001fonts.com/ – spousta fontů pro komerční použití, ale opět pozor na licenci

https://tldrlegal.com/ – stránka, která vám pomůže pochopit obsah licence.  

https://pimpmytype.com/personal-vs-commercial-use/ – více informací ohledně licencí

1.    Jaký font vytvořit?

Do podrobnější teorie typografie, jako je klasifikace „sans-serif, slab-serif,…“ a konkrétnější anatomie fontu bych se pustila až někdy příště. Pro váš první font vám bude stačit, když si určíte, jestli chcete nadpisové písmo, či menší, jestli bude tenčí, bude mít přirozený vzhled nebo bude vypadat jako psané rukou, či štětcem. Jednoduchou představu, nic víc. Vymyslete cokoliv, když font bude ustálený, písmenka budou spolu spolupracovat a font bude „dávat smysl.“

Následně nesmíte zapomenout, že font se skládá z mnoha znaků, zvlášť v češtině. Skládá se ale i z čísel, diakritiky atp. Nejlepší je vytvořit váš font s co nejvíce znaky, avšak někdy to může být opravdu časově náročné. Proto moudře rozhodněte co všechno vašim fontem pokryjete.

2.    Skicování

Preference je na vás, buď si vyberete papír, nebo tablet. Papír by měl být kostkovaný a kvůli skenování budete muset font vybarvit sytou černou barvou, takže pouze tužku nedoporučuji. 

Po sehnání pomůcek si definujte základní dotažnici, tedy čáru, na které sedí písmena. Následně střední dotažnici, což je velikost malých písmen a horní dotažnici, tedy velikost písmen (podrobnější informace sepíšu do dalšího článku). 

TIP: “kulatá” písmenka, jako je o, p, c, mírně přetáhněte, aby písmenka nepůsobila menší.

Na konci je nejlepší si všechna písmena zobrazit společně a popřemýšlet o tom, jestli se mezi nimi nachází některá, která se od ostatních příliš liší, nebo upoutává až moc pozornosti. 

Pokud tvoříte na papír, na konci byste měli zvýraznit svá písma sytou barvou, aby se lépe skenovala a přenášela do programů. Alternativně můžete skicu vyfotit, ale nejspíš s tím budete mít následně více problémů než se skenerem. Záleží ale na kvalitě fotografie. 

Pro účely tohoto článku jsem nakreslila jen velmi jednoduché a rychlé písmo, které si odešlu do počítače. Nejlépe v PSD formátu, ale JPEG nebo PNG vám taktéž postačí. 

TIP: Pokud jste skenovali, zkuste nejdřív v Photoshopu zvýšit kontrast celé fotky a pomocí úrovní stáhnout viditelnost čtverečků vašeho papíru.
velmi jednoduchý font vytvořený v aplikaci Procreate

3.    Převedení do vektorů

V Illustratoru otevřete soubor s fontem. Zde existuje velmi kouzelné tlačítko, které nám písmenka samo vektorizuje. 

Okna > Vektorizovat obraz, zde si nastavíme režim „černá a bílá“ a kliknete na „vektorizovat“ (více o vektorech v článku První měsíce v Illustratoru). Vše by se vám mělo automaticky převést do vektorů. 

Vektorizovaný font

Písmo jsem chtěla naschvál s texturou, aby vzbuzovalo dojem, že je psáno rukou, proto jsem nastavila práh na menší hodnotu, pokud bych chtěla ovšem písmo vyhlazené, nastavím práh na větší hodnotu. S posuvníky si hrajte, především pokud jste dokument naskenovali, zde se totiž může vyskytnout více problémů.

Abychom mohli písma upravovat jednotlivě, musíme ještě kliknout v okně „vlastnosti“ na „rozdělit.“ Následně lze vše upravit dle představ a vymazat bílé pozadí (případně zaškrtněte i „ignorovat bílou“).

Pro finální vyhlazení vyzkoušejte stejnojmenný nástroj.

Převedení do Glyphs mini/FontForge

Pokud nemáte Illustrator nebo jiný příslušný program, můžete například pomocí pera vytvořit font přímo v těchto softwarech.

https://bezier.method.ac/ – pokud se ještě s perem neznáte, tato stránka vás na tento nástroj připraví. 

Který program?

FonteForge je bezplatný program. Spousta tvůrců však doporučuje Glyphs mini, s tím mám ale několik problémů. Jednak je placený a jednak je dostupný jen pro jablíčkáře. Hledala jsem tedy alternativu a našla jsem FontForge, je zdarma a jednoduchý na pochopení. Glyphs mini je ale určitě na více profesionální úrovni a má i více funkcí. 

V téhle fázi trochu lituji, že jsem se spíše nerozhodla nahrát nějaké video, ale pokusím se postup popsat co nejkonkrétněji (kdybyste však naléhali v komentářích, že postupu nerozumíte, natočím klidně video a zveřejním zde na blogu). 

Vytvoříte soubor o rozměrech 1000×1000 pixelů s mřížkou každých 100 pixelů. Mřížku zapnete

Úpravy > předvolby > vodítka a mřížka > čáry mřížky po 100 px a dělení 4. 

Zobrazení > zobrazovat mřížku (Ctrl+“)

Postup pro Glyphs

Kolem písmenek vytvoříme dle mřížky boxy (překlikla jsem se a mřížku jsem udělala trochu menší, tak se nelekněte, kdybyste měli více řádků, ale ve výsledku, to žádnou roli nehraje a vektor můžete jednoduše zvětšit). Následně ještě seskupíme každé písmenko se svým boxem. 

Zarovnáno

Teoreticky boxy používat nemusíte, ale kvůli funkci zarovnání a opakování přes Ctrl+D mi toto přišlo jako nejrychlejší způsob.

Následně vše označte a zarovnejte do levého rohu. V okně vrstvách klikněte na rozbalovací hamburger (tři vodorovné čárky) a vyberte „rozdělit do vrstev“. Nakonec vše vyberte a zvětšete přes celé plátno.

Otevřete Glyphs, nastavíte si velikost písma podle plátna a stačí písmenka po jednom kopírovat a vkládat do příslušných okének, nezapomeňte na konci smazat boxy kolem písmenek. 

Postup pro FontForge

Postup je zde trochu komplikovanější, protože písmenka mi nikdy nešli jednoduše zkopírovat a vložit jak do Glyphs Mini. Vše tedy musíme exportovat jednotlivě ve formátu SVG.

Podobně jako u glyphs mini si písmenka vytvoříme a srovnáme dle boxíků, jen s tím rozdílem, že se nebude jednat jen o obyčejný čtverec, ale o kreslící plátna. Pro každé písmenko tedy vytvoříme jednotlivé kreslící plátno stejné velikosti a nejlépe, aby písmenka byla stejně zarovnaná, tedy uprostřed. V zobrazování si zapněte přitahování na mřížku, ušetří vám to spoustu práce. 

Následně exportujte jednotlivě jako SVG formát a před exportem zaškrtněte „použít kreslící plátna“. 

Další postup je jednoduchý, zapnete si program FontForge, založíte nový dokument.

Element > Font info > General a zde si můžete přenastavit velikost fontu. Tedy 1000×1000 pixelů. 

Následně klikněte na písmenko, které chcete importovat Ctrl+Shift+I. Vyberete SVG formát a všechny jednotlivě vložíte.

5. Export

Až zaplníte všechny znaky, které jste chtěli, je čas na export. File > Generate fonts. Zde vyberte buď TrueType nebo OpenType. A máme hotovo, zbývá jen font nainstalovat. 

Závěrem

Typografie je náročný a komplexní obor nabitý teorií. Proto tento článek, před tím, než se pustíme do těchto rozlehlých neznámých vod, se zaměřuje pouze na to, jak vůbec přenést myšlenku do funkční a digitální formy. V budoucnosti tedy už můžeme s články stavět na teoretické rovině, aniž bychom mu si museli ukazovat, jak písmenka například vektorizovat. 

Sledujte můj blog a můžeme začít studovat spolu!