Las interfaces digitales cotidianas incluyen una rica variedad de imágenes, visualizaciones y otras fotografías. Sin embargo, más que nada, están hechos de palabras. Oh, tantas palabras. qLXCURERoC A medida que equipamos a los equipos para diseñar y codificar interfaces hermosas, consistentes y utilizables utilizando sistemas, es esencial que las palabras dependan de una base sólida de tipografía. Lo admito, no soy un experto en tipografía. Me falta título en diseño gráfico. Nunca soy la persona que elige una fuente, un tipo de escala o un espaciado fino entre letras. Como resultado, siempre he sido reacio a escribir sobre tipografía.

La tipografía comienza estableciendo una base de familias de fuentes y pesos junto con alternativas. Luego explora cómo construir una jerarquía usando el tamaño, el color, detalles adicionales como la altura de la línea y la capacidad de respuesta de las capas. Luego, esos modelos se aplican a los componentes de la biblioteca de un sistema (como el artículo y el encabezado), así como a componentes personalizados creados por otros equipos.

Fuentes

Antes de profundizar en los detalles, debe decidirse por lo básico: fuentes. A través de la exploración, la comparación, la investigación y, a menudo, en el caso de las grandes empresas, la creación de una fuente por sí mismas, cada presentación depende de esta elección.

Familias, pesos y alternativas

Si bien los sistemas pueden variar las fuentes según la temática, la mayoría se basa inicialmente en la identificación de la familia de fuentes primarias serif y/o sans-serif. Cada fuente se aumenta con una cascada de alternativas (Hello, Arial y Times), y muchos sistemas incluyen una fuente monoespaciada para la visualización del código (aunque solo sea el suyo).

Algunos sistemas pueden funcionar con tan solo dos o tres pesos de su tipo de letra principal, buscando equilibrar la variedad y la flexibilidad con la gobernanza y el peso de descarga.

Conclusión de

: Llegar a una fuente principal no siempre es difícil, pero elegir qué pesos incluir tiene consecuencias a largo plazo. Agregar fuentes y pesos es fácil. Administrar el tamaño de las descargas y cambiarlas es difícil.

Obtener las fuentes, ya sea mediante descarga, enlace o CDN

Ya sea que un programa de sistema de diseño sea propietario o no de las fuentes, los usuarios de un sistema de diseño esperan que un sistema proporcione las instrucciones necesarias para usar las fuentes.

Desde la perspectiva de un diseñador, todo se trata de descargas. Algunas fuentes son propiedad intelectual estricta y se comparten de manera muy limitada intencionalmente. Entonces, como mínimo, una página de tipografía debe proporcionar descarga directa o instrucciones sobre cómo obtener aprobación para obtenerlas.La mayoría de los equipos proporcionan un ZIP descargable que incluye todos los archivos que necesita para instalar y usar fuentes localmente.

Para los desarrolladores, depende del enfoque y ofrece opciones como:

• Descarga directa de fuentes para servir las fuentes mismas
• Instrucciones para vincular a un servicio como Google Fonts
• Referencias CDN a las que todos los productos se refieren colectivamente
• Una invitación para contactar con un arquitecto técnico, ya que se requiere licencia para la fuente. Las organizaciones requieren esto para controlar el costo recurrente y a menudo no trivial de alojar y servir la fuente.

Conclusión: Diferentes personas necesitan las fuentes de diferentes maneras. Los usuarios del sistema esperan que el sistema les explique cómo usar todo fácilmente, incluso si no es trabajo del equipo del sistema crear fuentes personalizadas o servir fuentes ellos mismos.

Escala y formato de tipografía Jerarquía

La mayoría de los sistemas de diseño muestran una escala tipográfica en la documentación como una pila vertical. Eso no es suficiente. Un sistema tipográfico también debe establecer estructuras como el cuerpo del texto, los títulos, el color, la capacidad de respuesta, el color y otros detalles detallados.

Cuerpo del texto

Los sistemas aprovechan una escala de tipos para ofrecer tamaños de texto básicos (a menudo denominados simplemente texto o cuerpo) que incluyen pequeño, mediano, grande y, si lo necesita, xs, xl, etc. La mayoría de los sistemas necesitan aproximadamente tres (de ahí mi comodidad al usar tallas de camiseta). Comience con unos pocos y amplíelos según sea necesario, como diseños de componentes y composiciones de páginas al aire libre.

El texto del cuerpo también puede ofrecer un párrafo "Lede" distinto (alternativamente, "Lede") para abrir una página, como en un artículo (más sobre esto más adelante). Por lo tanto, una báscula S/M/L simple también puede necesitar otras variantes de plomo. Esto es especialmente relevante en sistemas que ofrecen varios tamaños, ya que un cable para pantallas más grandes y de menor densidad sería más grande que un cable para alternativas más pequeñas y de alta densidad.

Color del texto

El color también juega un papel clave en la jerarquía tipográfica de una interfaz, a menudo según tipos establecidos como: