1 pontos por GN⁺ 2 시간 전 | 1 comentários | Compartilhar no WhatsApp
  • Shantell Sans oferece estilos que vão de uma fonte para uso cotidiano a estilos experimentais para animação, com os eixos Weight, Italic, Informality, Bounce e Spacing
  • Partindo da caligrafia de Shantell Martin e de sua experiência com dislexia, a proposta é acessibilidade com um tom divertido e brincalhão, mas ainda profissional e utilizável
  • A fonte se inspira na universalidade e na impressão de legibilidade da Comic Sans, mas não é uma derivação dela; em vez disso, organiza em fonte digital uma caligrafia feita com marcador de ponta de feltro
  • Métricas próximas às da Roboto, largura ampla dos glifos e do espaçamento, além de um desenho distinto para b·d·p·q e I·1, aumentam a legibilidade
  • Distribuída gratuitamente via Google Fonts e licença OFL, oferece suporte a mais de 380 idiomas baseados em Latin e Cyrillic, além de uso no Google Docs

O ponto de partida da Shantell Sans

  • Shantell Sans é uma fonte variável criada a partir da caligrafia de Shantell Martin, oferecendo ao mesmo tempo um estilo amigável para o dia a dia e estilos experimentais adequados para animação
  • Quando era criança, Shantell Martin não conseguia passar em testes de ortografia e precisava ficar de detention, mas gostava de palavras e sempre expressou emoções por meio da escrita e do desenho
  • Aos 20 ou 21 anos, descobriu que tinha dislexia e, ao iniciar seu curso de artes na Central Saint Martins, sentiu que muitas pessoas criativas também eram disléxicas
  • Havia a frustração de que professores que não perceberam suas dificuldades de leitura e escrita a puniram em vez de oferecer apoio, e uma fonte baseada em sua própria escrita e em suas letras se tornou uma forma de permitir que as pessoas lessem e escrevessem, qualquer que fosse sua relação com as palavras
  • O objetivo era criar uma fonte divertida e brincalhona, mas profissional e utilizável, e queria uma fonte acessível que lembrasse que palavras são imagens e podem existir de maneiras próprias para cada pessoa
  • Stephen Nixon enviou um template com linhas para escrever à mão o alfabeto latino, números e símbolos, e essa caligrafia foi usada para criar a fonte digital

Distribuição pública e usos iniciais

  • A Shantell Sans foi lançada sob a Open Font License, permitindo que mais pessoas tivessem acesso sem custo, e um modelo de distribuição pública como a explicação de licença do Google Fonts aumenta sua utilidade
  • Oferecê-la gratuitamente permite uso amplo via Google Fonts e outras plataformas, e uma fonte criada por uma artista viva pode estimular o trabalho tipográfico de outros artistas
  • A Shantell Sans tem um caráter muito pessoal por ser baseada na caligrafia de Shantell Martin, mas a distribuição pública também significa abrir mão do controle sobre algo que é essencialmente seu
  • Há o desejo de que crianças e jovens usem a Shantell Sans e conheçam o contexto em que ela foi criada, e que ela possa aparecer de formas inesperadas tanto em projetos pessoais quanto em projetos de design maiores
  • Aplicações iniciais

Objetivos de design e a influência da Comic Sans

  • Stephen Nixon lembra que, quando Shantell Martin entrou em contato dizendo que queria uma “fonte utilizável, visualmente bonita, inteligente e criativa”, ele pensou nos grandes murais dela e em seu trabalho de linhas exploratório, semi-improvisado e brincalhão
  • A expressão de que queria fazer uma “nova Comic Sans” foi uma pista central, mas o projeto não era uma derivação direta nem uma nova versão da Comic Sans; a referência estava em sua universalidade cultural e na reação emocional que desperta
  • Comic Sans foi desenhada por Vincent Connare em 1994 para o Microsoft Bob e acabou amplamente usada por vir pré-instalada em sistemas Windows e Mac
  • A Comic Sans foi usada em contextos muito diversos, desde etiquetas da 5ª geração em diante dos Ty Beanie Babies até o anúncio do CERN em 2012 sobre a partícula de Higgs Boson
  • Cinco critérios

    • Precisava atrair o usuário comum, e não ser uma fonte feita apenas para entusiastas de tipografia
    • Precisava ser fácil de usar para escrever em vários tipos de comunicação
    • Precisava ser acessível e utilizável por uma ampla gama de pessoas
    • Precisava ter alta legibilidade e ser fácil de ler
    • Precisava fazer algo novo, em vez de apenas repetir um território já existente

Design e produção da base latina

  • Apelo cotidiano

    • Para criar apelo cotidiano, partiu-se de uma caligrafia com marcador de ponta de feltro, como na Comic Sans, tendo como base a escrita de Shantell Martin
    • Algumas características da escrita foram mantidas, mas a impressão geral foi simplificada para se adequar ao formato digital
  • Facilidade de uso em contextos amplos

    • Para corresponder às proporções e expectativas de estilo mais comuns nas fontes modernas, métricas tipográficas como cap-height, x-height e altura de linha padrão foram ajustadas para ficar próximas a fontes amplamente usadas, como a Roboto
    • Para manter a leitura confortável e a consistência visual com a escrita de Shantell, foram usadas largura de glifo e espaçamento um pouco maiores que a média
    • A fonte foi pensada para ser fácil de usar em contextos cotidianos como sites, apps e apresentações, mostrar personalidade em tamanhos grandes e ainda funcionar em texto corrido pequeno
  • Suporte de idiomas e distribuição

    • A Shantell Sans segue e ultrapassa ligeiramente os conjuntos de glifos Latin Plus e Cyrillic Plus do Google Fonts, oferecendo suporte a mais de 380 idiomas que usam os sistemas Latin e Cyrillic
    • O suporte cobre idiomas baseados em Latin e Cyrillic na Europa, nas Américas e na Ásia Central
    • Com suporte do Google Fonts e publicação sob licença OFL, ela pôde ser distribuída como uma fonte open source gratuita
  • Distinção clara entre letras

    • b, d, p, q e n, u foram desenhadas para se diferenciar por meio de contrastes simples de forma e terminais posicionados de maneira adequada
    • Como Shantell Martin às vezes escreve a letra maiúscula I e o número 1 como um único traço reto, foram adicionados serif ao I maiúsculo e um flag ao 1 para distingui-los
    • Como convém a uma fonte baseada em caligrafia, a e g usam formas single-story, como as que crianças aprendem na escola, preservando uma sensação amigável e familiar
  • Eixos variáveis e recursos OpenType

    • Além de uma boa faixa de pesos, a fonte precisava oferecer uma ampla gama de estilos como fonte variável para designers e desenvolvedores interessados em explorar recursos tipográficos contemporâneos
    • Para levar o clima livre e orgânico do trabalho de Shantell Martin a eixos experimentais, foram criados cinco eixos variáveis: Weight, Italic, Informality, Bounce e Spacing
    • Para necessidades tipográficas mais refinadas, também foram incluídos recursos OpenType como tabular vs proportional figures, fractions e localized forms
    • Inspirando-se no detalhamento artesanal de fontes baseadas em caligrafia como Inkwell, Cortado e Studio Lettering, evitou-se simplesmente criar mais uma fonte de marcador de feltro rastreada automaticamente

Definição das formas e eixos experimentais

  • Shantell Martin escolheu um marcador de ponta de feltro de espessura média, o Staedtler Lumocolor M, e escreveu pangramas em maiúsculas e minúsculas, números, pontuação, símbolos e algumas palavras com caracteres acentuados
  • Os scans foram traçados seguindo a linha central dos traços da caneta e depois expandidos para os pesos Light e ExtraBold
  • Como a caligrafia original apresentava mais variações de tamanho e ritmo do que uma fonte normalmente usada para leitura, altura, largura e espaçamento das letras foram parcialmente normalizados e ajustados com consistência
  • Foram preservadas características como a barra horizontal de t e f não ultrapassar à esquerda do traço vertical principal, A e R começarem no canto superior esquerdo, P ser um laço simples iniciado embaixo à esquerda, e M e W formarem ondas contínuas
  • A direção final buscou manter parte da nitidez e do contraste que tornam a escrita de Shantell interessante, ao mesmo tempo em que tornava a espessura um pouco mais uniforme e aplicava terminações suaves semicirculares
  • Esse equilíbrio preserva a sensação de escrita com marcador, mas faz com que a forma digital pareça acessível e acolhedora
  • Bounce e Informality

    • Com base na fonte padrão normalizada, foram criados estilos adicionais que reintroduzem as irregularidades observadas nas amostras escaneadas da caligrafia
    • Essas irregularidades não eram totalmente aleatórias, mas tinham características recorrentes: letras com muitos traços horizontais tendiam a parecer mais altas, enquanto letras com muitos traços verticais tendiam a parecer mais largas e baixas
    • Para que a fonte não ficasse caótica demais e perdesse utilidade, foi necessário equilibrar mais personalidade com a manutenção de um aspecto ainda “parecido com fonte”
    • Separando a fonte manual da fonte pronta para build, foram criados os eixos Bounce e Informality da fonte final
    • O estilo Bounce foi gerado por um script que desloca os glifos para cima e para baixo, enquanto o estilo Informal foi gerado por interpolação entre a fonte principal “normalizada” e uma fonte principal “irregular”
    • Todas as fontes de origem incluíam várias alternativas de glifos para letras, números e símbolos principais, e a fonte final alterna essas variantes de forma pseudoaleatória para transmitir a energia de uma escrita à mão
    • Por serem eixos variáveis, o efeito pode ser ajustado de algo sutil a algo marcante, e fica fácil usar tipografia animada com um design coeso dentro do próprio sistema tipográfico
  • Google Fonts e expansão open source

    • Como Shantell Martin tinha interesse em um lançamento open source, discutiu-se se o Google Fonts poderia apoiar a expansão para um público mais amplo
    • Com apoio do Google Fonts, foi criado o conjunto completo de estilos Italic, ampliando a faixa de estilos disponível
    • Também foi adicionado o eixo experimental Spacing, que pode ser útil quando o software não oferece ajuste de espaçamento entre letras por padrão
    • A escrita Latin foi expandida com caracteres vietnamitas e mais símbolos monetários, e a adição de Cyrillic passou a oferecer suporte a um conjunto totalmente novo de idiomas

Design dos caracteres cirílicos da Shantell Sans

  • Cyrillic é um sistema de escrita usado em muitos idiomas da Eurásia, como búlgaro, sérvio, russo, bielorrusso, ucraniano, tártaro e bashkir
  • O processo de design do Cyrillic é relativamente parecido com o do Latin, mas pode se tornar mais difícil quando se trabalha com formas não tradicionais inspiradas na caligrafia de uma pessoa específica
  • Trabalhar outro sistema de escrita em uma fonte caligráfica é semelhante a traduzir poesia: é preciso manter o tom próprio usando a estrutura da língua de destino
  • No Cyrillic existem formas upright ou “printed”, italic e cursive, e algumas formas italic e cursive têm estrutura diferente da forma printed mais comum
  • A escrita de Shantell Martin mistura formas cursive e printed, mas como ela escreve apenas em Latin, foi preciso decidir quais letras Cyrillic seriam transportadas como cursive e quais como printed
  • Pediram a Shantell Martin que escrevesse algumas frases em russo para observar como ela abordava formas desconhecidas, além de mostrarem exemplos diferentes da mesma letra e pedirem que escrevesse algumas palavras várias vezes
  • Houve consulta com os designers tipográficos de Cyrillic Maria Doreuli, Krista Radoeva e Alexei Vanyashin, e a percepção sobre quais formas eram corretas ou incorretas coincidiu na maior parte
  • O búlgaro e o sérvio têm formas convencionais que diferem do Cyrillic padrão; por exemplo, o t búlgaro costuma ter a mesma forma do m latino, o que nesse estilo poderia gerar confusão com o m Cyrillic e exigiu ajustes
  • Letras como o sérvio nje precisavam parecer naturais para leitores nativos tanto em caixa alta quanto em caixa baixa, e também houve consulta a Jovana Jocić para o sérvio
  • O trabalho com Cyrillic envolveu muitos desafios de design, mas a expectativa é que a fonte seja útil não apenas na composição em Latin, mas também em diversos idiomas escritos em Cyrillic

Como usar e links de referência

  • Shantell Sans on Google Fonts: disponível no Google Fonts
  • open-source repo: download da versão mais recente
  • Também pode ser usada no Google Docs, Slides e outros produtos do Workspace
  • Adicionar no Google Workspace

    • Abra o menu de fontes no documento e clique em “More Fonts”
    • No painel pop-up que abrir, procure por “Shantell Sans”
    • Clique na família tipográfica para adicioná-la ao menu de fontes
    • Google Material Design Blog: há uma versão resumida

1 comentários

 
GN⁺ 2 시간 전
Opiniões no Hacker News
  • Ao ver a amostra multilíngue no meio do texto, percebi que os glifos cirílicos desta fonte são excelentes
    Quando experimento fontes novas, normalmente os caracteres cirílicos não ficam tão bons quanto os latinos, e as exceções costumam ser fontes de fundições do mundo cirílico, como a ParaType
    No último terço do texto, eles explicam em detalhes como conseguiram isso
    https://www.paratype.com/fonts/pt/yefimov-sans?tab=gallery

  • O slider de formalidade com o qual dá para brincar na página do Google Fonts linkada no texto é um exemplo realmente incrível de uso recente de um eixo de fonte variável
    Dá a sensação de estar vendo o Metafont ser reavaliado de forma lenta e constante
    https://fonts.google.com/specimen/Shantell+Sans

    • O Dash da Typotheque também tem um eixo variável quase igual, onde ele é chamado de “Speed”: https://www.typotheque.com/fonts/dash-casual
      Por algum motivo, é preciso clicar na caixa “Variable” para ver toda a faixa variável
    • Isso é a parte mais legal. E ainda tem até um “slider de bounce”
      Que época para se viver... fico curioso se existem mais fontes com esse tipo de ajuste especial
      Ainda estou esperando a tecnologia que permitiria fontes manuscritas com aleatoriedade de verdade
    • Não conheço muito bem Metafont, mas você quis dizer isto? https://ctan.org/pkg/metafont?lang=en
    • Espera, isso quer dizer que, ao deixá-la mais informal, os glifos individuais da mesma letra podem ficar diferentes até dentro da mesma frase?
  • A fonte é excelente. Só sinto falta de glifos variáveis, que seriam um passo técnico além
    A sensação de estar lendo algo manuscrito desaparece quando as letras têm sempre a mesma forma
    Seria muito legal se desse para colocar 5 ou 6 pequenas variações de cada letra e alterná-las aleatoriamente

  • É surpreendente que eu só esteja vendo uma fonte assim pela primeira vez agora. Já lidei com bastante fontes da linha Comic Sans, e esta é de longe a fonte mais bonita que já vi até hoje

  • A semelhança com Comic Sans é tão óbvia que a primeira coisa que fiz foi dar Ctrl-F por “comic” no texto
    Meu primeiro pensamento foi até que ponto eles levaram esse conceito adiante
    Também é interessante como as menções a Comic Sans estão distribuídas no texto: aparecem várias vezes por volta dos 30%, quase como reconhecendo a linhagem óbvia, e depois quase não aparecem mais
    Esta fonte realmente foi mais longe, e é linda

  • Seria estranho eu querer uma versão monoespaçada desta fonte? Ela parece muito legal e muito bem projetada

  • Minha filha, que tem dislexia, ficou muito satisfeita. Nos exemplos, ela claramente preferiu esta fonte ao Roboto

    • Eu não tenho dislexia, mas mesmo no exemplo com Roboto a diferença de legibilidade me pareceu muito clara
      Depois de me acostumar com a Shantell Sans até aquele ponto, o Roboto pareceu quase difícil de ler
  • Uau, é tão feia que é difícil até explicar o quanto é feia

  • Acabei de ver pela primeira vez e já virou minha fonte manuscrita favorita. Excelente trabalho

  • Parece uma obra de arte bonita criada pela interação humano-computador
    Dá para usar tranquilamente mesmo em contextos em que Comic Sans poderia parecer meio zombeteira