1 pontos por GN⁺ 2023-11-10 | 1 comentários | Compartilhar no WhatsApp
  • Monaspace é um novo sistema de fontes para adicionar uma expressão tipográfica mais rica às telas de código, mantendo a grade monoespaçada
  • O recurso principal, Texture Healing, corrige desequilíbrios de espaçamento entre pares de caracteres adjacentes com glifos alternativos, reduzindo diferenças de densidade em texto monoespaçado
  • Essa abordagem aplica contextual alternates do OpenType a fontes para código, podendo ser usada na maioria dos editores sem plugin adicional, e também há configuração para o Visual Studio Code
  • Monaspace oferece eixo de peso de 200 a 800, inclinação de 0 a -11° e largura de 100 a 125, além de permitir ativar e desativar ligaturas de código por idioma com conjuntos de estilo
  • O GitHub Next desenvolve essa fonte com a Lettermatic desde 2022, buscando expandir a exibição de código para um meio de expressão mais amplo que possa ser aproveitado por ferramentas de desenvolvimento

Um sistema de fontes que expande a tela de código monoespaçada

  • Monaspace é uma “superfamily” de fontes para código, focada em evoluir a forma como o código é exibido na tela
  • Desde os primeiros teletipos, o código vem sendo mostrado com fontes monoespaçadas, e o Monaspace busca preservar essa grade enquanto carrega mais significado
  • Editores atuais muitas vezes transmitem informações além do realce de sintaxe baseado em cor por meio de elementos de interface como hover, sublinhados e adornos gráficos
  • O Monaspace oferece, no nível da fonte, uma paleta mais expressiva para código e ferramentas de desenvolvimento

Sugestões do Copilot e tipografia

  • Sugestões de código como as do Copilot podem ganhar uma voz tipográfica própria com o Monaspace
  • O texto fantasma pode dificultar analisar e avaliar o código sugerido
  • Se a própria expressão da fonte mostrar quais trechos são código sugerido, fica mais fácil distinguir esses fragmentos depois também

O limite das fontes monoespaçadas que o Texture Healing busca resolver

  • Fontes monoespaçadas colocam todos os caracteres em caixas com a mesma largura, o que torna a densidade do texto irregular
  • Caracteres estreitos como l e i precisam de serifas exageradas para preencher a caixa e, ainda assim, sobra mais espaço em branco do que o necessário
  • Caracteres largos como m e w são comprimidos dentro da caixa, o que distorce sua forma, afina os traços e limita também o espaço interno
  • Essa restrição é um problema estrutural das fontes monoespaçadas que vem desde a era dos teletipos dos anos 1960

Como o Texture Healing funciona

  • Texture Healing encontra pares de caracteres adjacentes em que um tem pouco espaço e o outro tem espaço sobrando, e substitui os glifos
  • Caracteres estreitos passam a usar glifos alternativos que cedem parte do espaço em branco ao vizinho, enquanto caracteres largos usam glifos alternativos que se expandem até a borda da caixa
  • Esse recurso é implementado com contextual alternates do OpenType
    • contextual alternates são normalmente usados em fontes árabes ou cursivas, nas quais a forma do glifo muda conforme os caracteres ao redor
    • O Monaspace aplica essa técnica a fontes monoespaçadas para código
  • O texto resultante continua seguindo a grade monoespaçada
  • A forma de ativar o Texture Healing no Visual Studio Code pode ser vista na documentação do Monaspace

Eixos da fonte e estilos

  • O eixo de peso do Monaspace vai de 200 a 800
    • 200: Extra Light
    • 300: Light
    • 400: Regular
    • 500: Medium
    • 600: Semibold
    • 700: Bold
    • 800: ExtraBold
  • O eixo de inclinação vai de 0 a -11°
    • 0: Normal
    • -5.5°: ponto intermediário em que alguns caracteres mudam de oblique para italic
    • -11°: Italic
  • O eixo de largura vai de 100 a 125
    • 100: Normal
    • 112.5: Semiwide
    • 125: Wide
  • O Monaspace inclui nomes de famílias como Neon, Argon, Xenon, Radon e Krypton

Ligaturas de código e configurações OpenType

  • O Monaspace inclui ligaturas de código para várias linguagens de programação
  • As ligaturas são organizadas em conjuntos de estilo, permitindo que o usuário ative ou desative apenas os conjuntos desejados
  • Cada conjunto de estilo foi projetado aproximadamente com base nas necessidades de uma linguagem específica
    • ss01: inclui ligaturas para sequências de caracteres comuns em JavaScript
    • ss05: oferece ligaturas para operadores de F#
  • Também há recursos OpenType adicionais
    • calt: ativa o Texture Healing
    • liga: ajusta o espaçamento de caracteres repetidos como /// e ||, e foi projetado para não ser ativado dentro de sequências mais longas como ////
  • No Visual Studio Code, os recursos e conjuntos de estilo desejados podem ser ativados em editor.fontLigatures no settings.json

Criação e distribuição

  • O Monaspace foi criado com o objetivo de melhorar a exibição de código para todos os desenvolvedores
  • O GitHub Next iniciou esse trabalho em 2022 e produziu a fonte junto com a Lettermatic
  • A lista de contribuidores, a documentação e os arquivos da fonte podem ser vistos no repositório do Monaspace
  • O download é oferecido no repositório do GitHub

1 comentários

 
GN⁺ 2023-11-10
Comentários do Hacker News
  • O recurso Texture Healing usa funcionalidades do OpenType de forma muito inteligente para tornar combinações problemáticas em fontes monoespaçadas muito mais agradáveis visualmente, sem quebrar em nada a grade
    Uma abordagem simples seria criar ligaduras para pares complicados como mi e lm, mas aqui parece que a fonte escolhe glifos alternativos que preenchem de forma diferente o espaço fixo dependendo das letras ao redor

    • A Commit Mono faz algo parecido e chama isso de Smart kerning. Para mais detalhes, veja a aba “04 Intelligent” em https://commitmono.com/
      Na prática, é difícil de usar. A largura das letras muda conforme a letra seguinte, então o texto fica pulando enquanto você digita. Fica legal para ler, mas é terrível para escrever
    • É uma técnica realmente engenhosa. Mais impressionante ainda é que isso já era possível havia muito tempo e ninguém tinha pensado nisso antes
      Riley Cran, que concebeu essa técnica como parte deste projeto, e toda a equipe da https://lettermatic.com são impressionantes
    • Não me convence muito. Depois de ligar e desligar as caixas de seleção algumas vezes, as inconsistências começam a aparecer
      Por exemplo, em time_limit no exemplo padrão, o segundo m claramente parece mais largo que o primeiro porque tem i dos dois lados e, portanto, mais espaço para “crescer”. Não sei se isso é algo bom
    • Muita gente aqui está elogiando o texture healing, mas para mim isso parece uma meia medida. Por que nós, como comunidade, somos tão resistentes a adotar fontes proporcionais?
      Esse texture healing já quebra a grade perfeita de células de caracteres, então, em certo sentido, parece ter as desvantagens dos dois lados
      Vejo as ligaduras extravagantes de forma parecida. Dá para usar os caracteres reais no código, e Unicode é amplamente suportado. Raku faz isso, mas para realmente brilhar seria necessária uma tipografia melhor, incluindo fontes proporcionais
  • No começo pensei “ah, mais uma família de fontes monoespaçadas, bonita”, mas depois de ver o texture healing fiquei com muita vontade de experimentar
    Gostei muito da ideia de usar estilos de fonte diferentes para cada finalidade. Só que, como uso principalmente terminal, não sei quais terminais suportam isso, e imagino que editores de texto em linha de comando também precisariam suportar. Ainda assim, acho uma excelente ideia

    • Em teoria, se for baseado em xterm, deveria ser possível. ESC[<10-19>m é a sequência de escape que seleciona as fontes 0~9
      Se isso realmente funciona na prática já é outra história. Uso Alacritty, não consegui achar se há suporte e, quando tentei por conta própria, não obtive resultado
  • Fico curioso sobre como as pessoas veem o exemplo Mix & Match
    No caso da parte manuscrita, o Radon parece basicamente um itálico, então combina bem com outras fontes. Mas as demais são parecidas demais em métricas e afins, então exemplos como “sequência de documento autoritativa” ou “voz do Copilot” são bem difíceis de distinguir

    • Foi o Mix & Match que me fez decidir testar essa fonte. Estou usando Operator Mono há anos justamente por causa do itálico
      Faz tempo que procuro uma alternativa mais aberta ao Operator Mono, e graças ao Mix & Match finalmente acho que esta pode ser essa alternativa
    • Foi a primeira coisa que me veio à cabeça, antes mesmo de eu rolar a página para baixo. Anotações manuscritas são legais e oferecem mais um elemento de distinção que reduz o esforço ao percorrer o código com os olhos
      Vai ter gente que não vai gostar, mas pessoalmente quero testar
    • Mesmo passando pelos exemplos, eu não percebi o que mudava nas caixas de código até chegar à variação Radon
      As outras variações não são diferentes o suficiente para transmitir informação
    • Não entendo como configurar fontes diferentes umas das outras. Era a primeira coisa que eu queria testar, mas não achei como fazer. Será que estou deixando passar algo óbvio?
    • Gostei muito dessa ideia. Isso já é suportado em algum lugar, ou é algo para o futuro?
  • Há bastante ligaduras, mas para mim ainda não é o suficiente. Hoje != e <= já são o básico, e continuo reparando em como o Fira Code faz bem coisas como alinhar a altura do * em *ptr, centralizar o : em X:Y ou elevar o x em 0xFF
    Quase gostei da aparência da variante Krypton, mas a barra horizontal do t minúsculo fica baixa demais em relação à altura de letras como c. Então acho que vou continuar usando Fira Code por enquanto e, depois do feedback dos usuários, daqui a cerca de um ano, quero ver de novo o que mudou

    • Para uma homepage de demonstração, é estranho que no exemplo do site vinculado os dois * em /** fiquem desalinhados
      Isso aparece especialmente em exemplos como // What if tentative ideas looked handwritten? e /** * What if docstrings looked authoritative? */
  • A ideia é boa, mas fico me perguntando por que não vemos mais fontes estreitas como a PragmataPro
    Uso há quase 10 anos e adoraria ter mais opções nessa área, mas parece que ninguém quer ir tão longe no estreitamento. A Berkeley Graphics vem anunciando há quase um ano uma versão estreita da Berkeley Mono, mas até agora nada aconteceu
    Aqui no Monaspace também há um controle deslizante de largura, mas a sensação é que ele começa em “mais larga que a PragmataPro” e vai até “absurdamente larga”. Fico me perguntando por que não fizeram também descer na direção de versões mais estreitas

    • Concordo plenamente. Uso PragmataPro todos os dias, e todo o resto parece largo demais
      A Iosevka padrão chega perto, mas o espaçamento entre linhas é bem maior. Felizmente, dá para personalizar até ficar quase igual ajustando leading = 1110 na configuração. Cheguei a esse valor por tentativa e erro
    • Já experimentou a Quinze? https://www.programmingfonts.org/#quinze
      Procurando a fonte mais estreita, descobri que a Quinze era a resposta. Ela é cerca de 20% mais estreita que Iosevka ou M+. Não achei um comparativo fácil com a PragmataPro, mas, se a Iosevka é uma interpretação gratuita da PragmataPro, então a Quinze também deve ser mais estreita
      Na prática, a Quinze é estreita demais; quando forcei seu uso em todo texto monoespaçado do navegador, a legibilidade piorou em vez de melhorar. Na mesma altura, ela parece muito menor que uma fonte “normal”. No ambiente de programação, eu a uso com um tamanho de fonte maior, e isso combina bem com a largura estreita
      O lado negativo é que a Quinze é extremamente minimalista. Quase só tem ASCII, não tem ligaduras e não oferece customização. Para mim, nada disso incomoda
    • A Iosevka também é bem estreita e popular. Não sei se atende exatamente ao que você quer, mas vale dar uma olhada
    • Acabei de conhecer a M+, e a variante “60” me agradou bastante. A largura padrão 50 era estreita demais para mim, e no meu gosto a legibilidade cai nas variantes 50
      Ainda assim, ela pode ficar tão estreita quanto você quiser
      https://mplusfonts.github.io/
    • Já que o assunto são fontes estreitas, alguém recomenda alguma fonte serifada estreita boa? Pode ser paga ou gratuita
      No navegador, uso “Bell MT” no lugar de Times, e também como fonte de largura variável no modo Org do emacs; ela é boa, mas eu gostaria que existisse uma versão maior e mais estreita
      Outra boa fonte monoespaçada estreita é “The Sans Mono Condensed”, que ficou conhecida por causa dos primeiros livros da O’Reilly. Depois a O’Reilly trocou para outras fontes monoespaçadas. A desvantagem é que ela só tem o conjunto de caracteres ocidentais, mas eu gostava bastante dela
  • Me incomoda que o símbolo de Radon na página esteja como Rd. Se é Radon, deveria ser Rn
    Radium é Ra, Radon é Rn, então isso até me fez conferir de novo se existe algum outro elemento que comece com R e tenha d no nome

    • Eu também percebi isso, e depois foi corrigido
    • Existe Rhodium, mas o símbolo é Rh
  • O mono flag não está definido, então tive que tentar carregar a fonte com o gvim GTK2
    O resultado de % ttfmono MonaspaceArgon-Regular.otf é monospaced flag = 0, e aparece 0 = variable-width, otherwise = monospaced
    Infelizmente, parece que é por causa desse sinalizador que as ligaduras não são ativadas
    Mesmo assim, consegui ver as ligaduras e o texture healing no vim rodando em um st com patch, e gostei muito. As linhas se movem só de forma muito sutil enquanto se digita, e, quando o cursor passa, não fica rastro por causa de um m alargado, por exemplo. Foi bem projetado para código
    Se eu pudesse pedir um recurso, seria poder escolher algumas variações, como colocar uma barra invertida no 0 angular, ou manter o ! na ligadura de !=. Dá para ver o que quero dizer aqui: https://github.com/be5invis/Iosevka/blob/main/doc/stylistic-...
    https://st.suckless.org/patches/ligatures/

    • Tem certeza? No macOS, ela aparece em “Fixed Width” no Font Book
      Estou usando a versão distribuída hoje, então talvez isso tenha sido corrigido recentemente
    • O mesmo problema acontece no KDE Konsole: https://imgur.com/a/Dj1HZiu
      É preciso marcar explicitamente a caixa “Show all fonts” para que fontes “não monoespaçadas” apareçam
  • Em sistemas modernos, talvez as fontes para código já possam ir além de fontes monoespaçadas
    Já recomendei isso várias vezes aqui, mas eu uso a Input Sans, uma fonte de programação proporcional
    https://input.djr.com

    • Fico curioso sobre o motivo da recomendação
      Nessa fonte, parece que pode ficar mais difícil encontrar erros de digitação
    • Eu gostaria de usar fontes proporcionais para programar, mas não conheço um frontend de Vim que dê suporte limpo a isso
      Quando uso Vim por SSH, tudo bem continuar com fonte monoespaçada, mas, apesar do Neovim ter trazido muitos frontends, quase nenhum parece dar suporte a fontes proporcionais. E os que dão costumam ser lentos a ponto de ser doloroso usar
    • Ela suporta ligaduras que trocam >= por ? Tentei a prévia web no celular, embora isso possa ser limitação do Firefox no Android
      A propósito, ligadura é isso aqui: https://fonts.google.com/knowledge/glossary/ligature
  • Sempre fico confuso com como o zero com ponto virou meio que um padrão em fontes desse tipo. Eu sempre o confundo com o 8, então prefiro muito mais o 0 com barra
    Se houver uma variação assim, com certeza eu gostaria de experimentar essa fonte

    • Existem idiomas em que um círculo riscado é uma letra, então o 0 com barra pode causar confusão. O zero com ponto tem bem menos chance de gerar esse tipo de ambiguidade
      O designer da fonte até poderia enfatizar o lado convexo do zero com ponto e o lado côncavo do 8 para diferenciá-los visualmente, mas não sei se esta fonte faz isso
    • Sugeri um 0 com barra na issue, e alguém respondeu que o zero com ponto também serve para o mesmo propósito. Isso é realmente irritante
  • Texture healing é uma ideia realmente inteligente e bonita
    Também gostaria de ver isso aplicado à caligrafia chinesa, que muitas vezes é usada em largura fixa. Caracteres comuns, mas muito densos, especialmente caracteres tradicionais como 邊鐵餐廳臺藥機麵顧露樓幫讓, teriam muito a ganhar se pudessem receber espaço extra e se expandir em largura