Como fazer a sua tipografia do aplicativo iOS NÃO chupar

crédito: Erin Lee

A composição do que você projeta tende a ser 80% tipográfica. Torna-se ainda mais crítico para um designer ter alguma compreensão da tipografia que lhe permita escolher tipografia que complemente o design e o aprimore.

O básico

Termos de tipografia e o que eles significam são importantes para serem aprendidos para entender a anatomia de um tipo de letra. Esses termos são usados ??universalmente para explicar a tipografia e as propriedades que distinguem um tipo de letra do outro e o caractere que cada um deles traz. Para começar, os termos que você deve escolher como iniciante na imagem abaixo são Ascender Line, Descender Line, Baseline, Leading e X-height.

As cinco regras

Estamos em um momento em que a maioria de nós lê na web e / ou em nossos dispositivos móveis. O melhor de tudo é que essas cinco regras para uma ótima tipografia podem ser aplicadas a interfaces impressas e digitais. Uma ótima tipografia torna a experiência de leitura agradável, fazendo com que o leitor queira ler mais e ler sem esforço, o que implica que as escolhas de tipografia devem apontar para a utilidade.

São Francisco

Essa é a nova fonte padrão do iOS, antes de a Helvetica Neue ser a fonte padrão. Você pode baixar esta fonte aqui . Esta fonte foi projetada para a utilidade, para garantir que o conteúdo do texto seja otimamente legível, vale a pena mencionar que a Apple projetou essa fonte internamente. Este vídeo mergulha mais profundamente nos recursos da fonte SF.

WWDC 2015

Com base no tamanho da fonte, o iOS ajusta automaticamente o valor de rastreamento e alterna entre as variantes Texto e Exibição da fonte SF. Quando o tamanho da fonte for 20 pt ou mais, o SF UI Display deve ser usado e se o tamanho da fonte for menor que 10 pt SF UI Text deve ser usado.

Tamanho

O tamanho de suas fontes ao projetar para iOS não deve ser inferior a 11 pts para manter a legibilidade no iPhone, iPad e Apple Watch. Este é o valor mínimo do tamanho da fonte, no entanto, você descobrirá que o valor ideal está no intervalo de 15 a 19 pt .

WWDC 2015

Peso

Ao usar qualquer fonte moderna, como SF, Proxima Nova ou Museo, você descobrirá que elas vêm com várias opções de peso, como Thin, Ultralight, Medium, Semibold, Bold, Heavy e Regular. O tamanho e o peso da fonte se complementam. É útil ter em mente que às 11-19 pt use o peso regular , a 20-34 pt use Médio e a 34 pt ou mais use Negrito. Também é possível usar as variantes Light e Ultralight quando o tamanho da fonte é muito grande, pois o tamanho grande da fonte mantém a legibilidade nesses pesos, no entanto, é importante lembrar que títulos maiores no iOS 11 geralmente são Bolder.

WWDC 2015

Altura da linha

Idealmente, a altura da linha deve estar na faixa de 120% -145% do tamanho da fonte. Uma altura de linha menor do que isso faz com que o texto pareça apertado e difícil de ler. Quando a altura da linha está na faixa ideal, cada linha de texto tem seu próprio espaço e espaço para respirar e tudo se torna muito legível.

Personagens por linha

Os seres humanos lêem o texto que é mais vertical mais rápido do que o texto que é mais horizontal e tem muitos caracteres por linha. Quando a linha é muito longa, o leitor experimenta carga cognitiva porque precisa se concentrar em cada palavra horizontalmente. Isso pode causar fadiga de leitura. Idealmente, deve haver de 45 a 90 caracteres por linha para manter uma experiência de leitura fluida.

Hierarquia de Informação

É benéfico comunicar a hierarquia e as interações através do seu tipo de letra. Use uma fonte de tamanho grande em negrito para títulos, uma cor cinza. Peso médio 14–15 pt texto para legendas. Use opacidade reduzida para texto que não transmita informações primárias.

WWDC 2015

Sans-Serif e Serif

As fontes Serif têm pequenos recursos salientes que a fonte sans-serif não possui. Ambas são boas escolhas baseadas no tipo de aplicativo. Uma fonte com serifa é mais comumente usada em aplicativos que envolvem o usuário com muitas leituras, como Média, iBooks, Bloomberg e The New York Times.

As fontes Sans Serif são mais usadas, pois são uma opção neutra e segura. Você verá fontes sem serifa na maioria dos aplicativos da App Store.

crédito: http://massimosette.info/

Fontes de Fontes

Fontes são geralmente muito caras, aqui estão alguns recursos onde você pode obter algumas fontes livres que funcionam bem em qualquer projeto.

Google Fonts

Com uma interface bonita para você consultar o catálogo de fontes disponíveis, o Google Fonts tem uma incrível seleção de fontes para quase todos os estilos imagináveis. Você pode baixar os arquivos de fontes e colocá-los em sua pasta de projeto do Xcode para usá-los.

Google Fonts

O SkyFonts for Mac é uma excelente aplicação que lhe permite sincronizar todos os seus arquivos de fontes para o seu Desktop. Se você quiser fazer o download de todas as fontes disponíveis nas fontes do Google, poderá fazê-lo neste repositório do Github .

Typekit

O Typekit tem uma grande coleção de fontes gratuitas e pagas que fazem parte da assinatura da Adobe Creative Cloud. Algumas ótimas fontes aqui são Proxima Nova e Museo.

Typekit

Fontstand

Este é um ótimo serviço que permite que você experimente as fontes por 60 minutos antes de decidir comprá-las. Como alternativa, você pode alugar as fontes por uma fração do preço que custaria comprá-las imediatamente por uma taxa mensal.

Fontstand

Guias

Tipografia, claro, não se limita a um aplicativo iOS, os princípios se estendem a todos os contextos em que um ser humano precisa ler tipografia.

Guia de tipografia

Este guia pode dizer-lhe mais sobre como combinar tipos de letra, apóstrofos, citações, parênteses etc

Um guia de cinco minutos para uma melhor tipografia

Uma experiência alegre com segmentos animados que falam sobre cada aspecto da tipografia de uma forma que vai deixar você com um sorriso no rosto. Altamente recomendado.

Emparelhamento de fontes

Você acabará descobrindo que deseja criar uma hierarquia tipográfica e contrastar com o uso de mais de uma fonte. Este guia é realmente útil ao fornecer uma perspectiva que permite escolher pares de fontes de uma maneira muito melhor.