Fontes e Glyphs – 2020

Fontes e Glyphs

Olá caro leitor, neste tutorial você irá aprender a como criar suas fontes e glyphs.

Antes de pensar em criar glyphs e fontes é bom saber que este trabalho não é rápido requer dedicação e atenção então faça com calma para ter bons resultados no final do seu trabalho.

Afinal o que são Glyphs (Glyphos) ?

Palavra de origem Grega (γλύφω – glýfo), designada para qualquer signo linguístico que fosse entalhado ou pintado, por exemplo hieróglifos egípcios e a escrita maia.

Quando se fala de Tipografia, glifo é uma figura que dá um tipo de característica particular para um símbolo específico. Por exemplo diversos glifos diferentes, mas representam a mesma letra.


Glyphs Amostra

Você pode praticar a construção de suas fontes no tradicional papel e caneta, com pinceis ou outros instrumentos de escrita. Neste artigo foi tudo realizado de forma digital em programas vetoriais como CorelDraw e Adobe Illustrator mas você pode usar algum outro programa que tenha maior costume e habilidade.

A composição de sua fonte pode seguir qualquer estilo isso irá depender da finalidade do seu projeto.

Existem alguns tipos de fontes Geométricas com linhas e ângulos bem acentuados ou curvadas, podendo ser até ícones e desenhos conforme desejar colocar em biblioteca de fontes.

Como criar fontes

Uma forma de facilitar no seu momento de criação deixe organizado uma biblioteca com todas as letras maiúsculas e minúsculas, os números e símbolos como exclamação, interrogação entre outros símbolos.

Vou deixar disponível para download uma tabela com todos estes elementos.

Leve em consideração os seguintes pontos:

  • O estilo da sua fonte (Geométrica, Cursiva) Moderna, Old School, Rabisco, Desenho, Ícones
  • Facilidade de leitura e entendimento
  • Tamanho da fonte, se é possível trabalhar com tamanhos grandes e pequenos
  • Utilidade se serve para várias aplicações e serviços

Fonts e Glyphs

Download Geral

Caso crie sua fonte de forma tradicional no papel e caneta por exemplo tente manter um progresso e fotos para a etapa de digitalização.

Se for direto para digitalização escolha o programa que tem maior habilidade e mãos à obra.

Neste processo de criação evite deixar a criação das fontes para outro momento isso pode minar seu processo criativo e acabar tendo resultados diferentes para a mesma obra.

O exemplo a seguir resolvi criar fontes bem simples seguindo de forma geométrica e com ângulos bem acentuados.

Repare que segui na criação de todas as letras maiúsculas, minúsculas assim como números e símbolos, mas você pode optar por não usar todos os recursos.

O programa utilizado para criar o vetor das fontes foi o CorelDraw.

O arquivo original estará disponível para download compatível com CorelDraw 19, Adobe Illustrator CS5 e SVG para você editar da forma que desejar.




Download Geral


Square Fonts Malha


Download Geral

Neste projeto criei um arquivo CorelDraw padrão com as medidas de uma folha A4 criei uma malha com quadrados coloquei um azul claro e apliquei uma transparência para manter somente como referência, não precisa ser nada muito grande ou trabalhado demais afinal só servirá como referência o arquivo também está disponível para download caso queira praticar ou criar novos modelos de fontes baseado no projeto para este tutorial.


Fonte Matriz Gabarito

Se você baixou o arquivo observe que ele possui diversas páginas a primeira esta nomeada como Matriz e todas as outras serviram para cada Letra do alfabeto, para não ficar um arquivo muito extenso e com muitas páginas coloquei só a quantidade de páginas para letras maiúsculas, você pode acrescentar novas páginas ou salvar o arquivo com nome diferente por exemplo, Fontes-maiusculas, Fontes-minusculas, Fontes-numeros, Fontes-simbolos, dessa forma é possível ter um controle maior em arquivos relativamente menores.

Por ser um conceito visando a criação de fontes geométricas, criei alguns retângulos nas medidas que desejava e aí foi só ir criando usando as ferramentas soldar e aparar.

Para não ficar muito extenso, fiz somente o passo a passo de uma fonte, mas já dá para entender como o restante foi criado.

Criando a letra A

Para simplificar a visualização colori todos os objetos da matriz.


Fonte Matriz Gabarito

Você já deve ter observado que ao remover o objeto na parte de baixo praticamente teremos a letra formada.


Criando letra A

Agora basta selecionar os outros objetos e junta-los para que se torne um único objeto, no CorelDraw usamos a ferramenta soldar, já no Illustrator estará na caixa de ferramentas Pathfindermesclar.

Após unir os objetos a letra A estará praticamente pronta.


Criando fonte letra A

Removendo o excesso de pontos

É sempre importante remover o excesso de pontos “nós” do seu vetor, este processo permite otimizar sua fonte.


Criando letra A pontos originais

Original: 22 pontos

                                        <a href="https://davidcreator.com/wp-content/uploads/2020/12/fonte_06.jpg">

Criando letra A pontos otimizados

Otimizado: 12 pontos

Alterando estética

Agora que corpo principal já está criado chegou o momento de acrescentar alterações, por ser uma fonte geométrica resolvi, criar recortes usando somente retângulos, para melhor compreensão marquei as áreas de cortes com retângulos amarelos.


Criando letra A alterações

Um pouco semelhante ao que foi realizado no processo para unir os objetos, nesta etapa selecionei os objetos amarelos e por último a fonte que está sendo editada e utilizei a ferramenta aparar, no Illustrator estará na caixa Pathfinder ferramenta cortar, depois de cortar exclui os retângulos criados, e o resultado obtido foi este.


Criando letra A final

Todas as outras letras seguiram o mesmo conceito primeiro montar de modo bem simples a letra e aplicar as alterações utilizando retângulos acrescentando ou removendo seguimentos.

Importante: O exemplo demonstrado seguiu a quantidade de caracteres norte americano então Ç e letras que usam acentuação como Ã, Â, Õ, Ö, entre outras letras que utilizem acentuação não vão funcionar.

Tipos de extensões de fontes

Extensão Nome Descrição
abf Adobe Binary Screen Font  
afm Adobe PostScript Font Metrics normalmente usado em ambiente UNIX
bco    
bdf Bitmap Distribution Format formato de fonte bitmap da Adobe Systems
bez    
cfn Calamus Font Notation formato utilizado pelo programa Calamus
chr    
dfont Data Fork Font fonte do Mac OS X
dwf    
e24   utilizada em ambiente Atari
eot Embedded OpenType fonte OpenType embebida
fli    
fon   fonte bitmap
fot    
fnt    
gf Generic Font  
inf Adobe PostScript Information este ficheiro, em conjunto com um ficheiro AFM da mesma fonte, é possível criar um ficheiro PFM
L30   utilizada em ambiente Atari
mf    
mgf   fonte MicroGrafx
mmm Adobe PostScript MultipleMaster armazena dados da fonte para criação de outras personalizadas
odt   fonte do OpenOffice.org (formato texto)
otf OpenType Font fonte OpenType
otl   utilizada em ambiente Atari
p9   utilizada em ambiente Atari
p24   utilizada em ambiente Atari
pcf Portable Compiled Font  
pfa Adobe PostScript Font ASCII fonte numa codificação de texto, para uso em impressoras PostScript e ambientes UNIX
pfb Adobe PostScript Font Binary armazena apenas o desenho da fonte
pfm Adobe PostScript Font Metrics armazena apenas as métricas/espaçamento entre letras da fonte
pk TeX Packed  
pl TeX Property List  
ps    
psf    
pso    
pxl TeX Pixel  
qfm   utilizada em ambiente Atari
sfl    
sfp    
sfs    
snf Server Normal Format  
spd    
suit Font Suitcase ficheiro de fontes do Mac OS, utilizadas nas versões anteriores ao Mac OS X
tdf    
tfm TeX Font Metric  
ttc TrueType Collection fonte TrueType
ttf TrueType Font fonte TrueType
vf TeX Virtual Font  
vpl TeX Virtual Font Property List  

Arquiteturas de Formatos

É importante ter conhecimento sobre tais arquiteturas.

Você pode pesquisar por estas arquiteturas: OpenType, TrueType, PostScript, FreeType

Transformando sua letra em fonte tipográfica

Existem diversos programas para este processo muitos deles são pagos.

High-Logic – Font Creator

Voltado para um público profissional o programa conta com diversos recursos, uma interface intuitiva, diversas possibilidades para importar arquivos vetoriais nos formatos, SVG, EPS, AI, PDF, IGES, entre outros, arquivos BMP, PNG, GIF, JPG entre outros  exporta em diversos formatos de fonte, TTF, OTF, WOFF, WOFF2, TTC, UFO

Suporta 65,535 Glyphs.

Versão de teste não possibilita o uso de todos os recursos e tem limite de glyphs.

Caligraphr

Um site que incorporou serviços do Myscriptfont e PaintFont, ele permite tem um período de teste onde você recebe um gabarito em PDF, basta preencher o gabarito com seus glyphs e fazer upload do arquivo pode ser foto ou arquivo digitalizado, a plataforma faz a conversão do arquivo e permite o download no formato OTF ou PDF.

O uso gratuito tem um limite de 74 caracteres e limitações no uso de algumas ferramentas, como adicionar ligaduras e ajustar espaços entre caracteres.

Birdfont

Editor online gratuito de código aberto permite criar fontes desenhado em sua interface. Você pode exportar suas fontes nos formatos, TTF, OTF, EOT e SVG.

Você também pode importar seus arquivos para o site e assim transformar em fonte.

Glyphr Studio

Aplicativo gratuito com diversos recursos simples e intuitivo, possui um tutorial de uso para os iniciantes. Disponível para computadores, MacOS, Windows, Linux e pode ser usado online.

Neste tutorial o programa usado foi o Glyphr Studio versão desktop, sistema Windows 10.

O programa possui uma interface muito simples e moderna

Na tela inicial basta colocar o nome do seu Projeto neste caso o nome será “Square Deform” com o nome definido basta iniciar o projeto.

Segunda tela você já terá a sua esquerda todos os slots dos glyphs e a direita a área de criação da fonte. Como criamos todas as fontes em um programa vetorial não irei explicar como trabalhar na área de criação do programa.

Espero que tenha gostado desse Tutorial deixe seu comentário seu feedback é muito importante.

Compartilha e segue nossas mídias sociais, acompanha o site sempre tem conteúdo sendo publicado.

close
MailPoet Person Form

Não perca essas dicas!

Não enviamos spam! Leia nossa política de privacidade para mais detalhes.

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *