1
resposta

[Dúvida] Tamanho da fonte

Já fiz outras aulas na Alura e a maioria não tinha orientação do designer nos projetos do Figma.
Então para saber o tamanho da fonte, sempre falaram para clicar várias vezes até chegar na canada do texto e olhar na tipografia que o tamanho estaria em PIXEL. Mas a moça nessa aula diz que esta no formato PT. Então queria saber qual é o correto e se trabalhando "na vida real" esse tipo de detalhe é importante e se é necessário manter 100% fiel ao projeto do Figma. Obrigada!

1 resposta

Oi, Nicole!

Que legal ver você por aqui e mergulhando nesses detalhes que fazem toda a diferença no dia a dia do desenvolvimento.

Essa é uma dúvida muito comum e excelente, pois toca em pontos fundamentais da comunicação entre quem projeta (Designer) e quem constrói (Pessoa Desenvolvedora).

Vamos esclarecer esses pontos:

1. PT vs PX: Qual é o correto?

No Figma, por padrão, as unidades de texto são exibidas em pixels (px). Maaas, dependendo de como o arquivo foi configurado ou se o designer veio de um histórico de design gráfico/impressão, ele pode acabar utilizando pontos (pt).

  • Na Web: O padrão absoluto é o Pixel (px) e as unidades relativas, como o REM (que é baseado no tamanho da fonte do navegador).
  • O que fazer: Se você encontrar um valor em pt no Figma, o ideal é converter para px. Usar calculadoras online, como mencionado na aula, ajuda a manter a precisão visual.

2. É preciso ser 100% fiel ao Figma?

Na "vida real", buscamos o que chamamos de Pixel Perfect (perfeição ao nível do pixel), mas com bom senso.

  • Fidelidade visual: Sim, é importante manter a hierarquia. Se o designer definiu um título muito grande e um parágrafo menor, você deve respeitar essa proporção para manter a intenção do layout e a legibilidade.
  • Acessibilidade e responsividade: Aqui entra o seu papel técnico. Às vezes, um tamanho de fonte fixo em 85px (como o do exemplo) pode ficar enorme em um celular. O desenvolvedor deve ter a sensibilidade de ajustar isso usando Media Queries ou unidades como rem, garantindo que o site seja funcional em qualquer tela.

3. Detalhes que importam

Trabalhando em equipes, esses detalhes são fundamentais. Se você ignora os tamanhos de fonte, pode quebrar o alinhamento de outros elementos ou prejudicar a experiência do usuário.

Continue praticando e não se preocupe em decorar todas as conversões. Com o tempo, seu olho "treina" para bater o olho no layout e saber se aquele tamanho faz sentido para a web.

Espero ter ajudado a clarear as coisas!

Alura Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!