Las fuentes variables, tipos con los que ya podemos trabajar

Contenidos

¿Qué son las fuentes variables?

Una de las novedades más interesante que nos ofrecen las nuevas versiones presentadas y ya disponibles de Photoshop e Illustrator CC, es la posibilidad de poder trabajar con las fuentes variables.

Incluyen también varias familias con las que experimentar esta tecnología tipográfica.

Lo que nos permiten las fuentes variables es que con un sólo archivo tipográfico podamos tener un amplio abanico de características tipográficas, sin tener que administrar pesos o estilos del tipo.

Esto es interesante tanto para los diseñadores web, como para los desarrolladores de aplicaciones y diseñadores en general, ya que consigue que podamos tener más por menos.

Variaciones tipográficas

Como todos los diseñadores sabemos las variaciones tipográficas se pueden agrupar en tres conjuntos básicos:

Según las variaciones en el peso (variable de tono)
En la amplitud del ancho de la letra (variable de proporción)
Y la inclinación del eje vertical (variable de inclinación).

Variables de tono o peso

Aunque cada familia tenga sus propias características, el peso denominado regular o normal habitualmente tienen un espesor de 1/5 del ancho de la letra -tomando como referencia la «n» para las minúsculas y la «H» para las mayúsculas-.

A partir de esa referencia tendremos los diferentes pesos con mayor o menor grosor de trazo que establecerán los pesos habituales que podemos encontrar en una familia: desde negrita o bold a light o fina, así como toda la gradación de grosores que haya desarrollado en esa tipografía.

Fuente Source Sans Pro, variaciones

Variables de proporción

O la modificación del ancho de la letra.

Lo normal o regular en una tipografía es que su relación de alto/ancho sea de 5/4, es decir cinco módulos de alto por cuatro de ancho y tomando como referencia la letra «n» en minúsculas y la «H» en mayúsculas.

Las variaciones en la expansión o en la condensación de la tipografía se establecen en el sentido horizontal, lo que varía es el tamaño del ancho tipográfico.

Por último, otro factor de variable con el que habitualmente también podemos «jugar» es con la inclinación tipográfica.

Inclinación del eje vertical

Frente a la tipografía regular o normal que habitualmente la tenemos totalmente vertical con respecto a la línea base, nos encontramos con los diferentes ángulos de inclinación que podemos encontrar en sus variantes inclinadas, itálicas u oblicuas.

Estas variaciones tipográficas nos permiten poder transmitir expresividad en el diseño, así como establecer diferenciaciones en el texto que permita distinguir y destacar el contenido textual de una forma visual.

Mediante el uso de las variaciones tipográficas establecemos ritmo visual, color (mayor o menor negro) y jerarquía en el texto.

El problema hasta ahora ha sido que cada una de estas variaciones tipográficas es un archivo de fuente separado, por lo que esto lo hace menos operativo y más pesado en sus aplicaciones web y móviles.

Y la solución a este problema son las fuentes variables.

Bold, light, italic, regular

OpenType Font Variations, fuentes variables

La tecnología detrás de las fuentes variables se denomina oficialmente OpenType Font Variations.

Ha sido desarrollado desde hace años conjuntamente por Microsoft, Google, Apple y Adobe, en un esfuerzo de colaboración sin precedentes en el que también han participado expertos técnicos de fundiciones de fuentes y desarrolladores de herramientas de fuentes.

Una fuente variable contiene tres componentes principales:

Cada archivo de fuente contiene un único conjunto de contornos que forma la base para la familia de fuentes.
Un conjunto de ejes de diseño, como peso, ancho, tamaño óptico… para describir las formas en que varía la familia de fuentes.
Asimismo incluye un conjunto de deltas que describen cómo las formas de contorno, el interletraje, el posicionamiento de marca y las métricas cambian en esos ejes.

«Cuando las aplicaciones o sitios web usan una fuente variable, eligen un estilo particular dentro de los rangos de los ejes de diseño, y el sistema operativo aplicará los deltas apropiados y las sustituciones de OpenType para crear una fuente virtual efímera para representar texto en ese estilo.
Una fuente variable también puede proporcionar un conjunto de estilos predefinidos, llamados instancias nombradas (named instances), que aparecerán como fuentes tradicionales estáticas en los sistemas operativos que admiten fuentes variables.» Microsoft

Fuentes variables Creative Cloud

Con esta nueva versión de Adobe Creative Cloud nos podremos encontrar en nuestra lista de fuentes con una serie de fuentes variables con las que podemos trabajar.

En concreto son seis familias con las que podemos comenzar a experimentar y que encontraremos en nuestra lista de fuentes con el icono Opentype acompañado del texto «VAR».

Fuentes variables en Creative Cloud

Con la familia Acumin Varible Concept podremos cambiar tanto el peso, el ancho, como el ángulo de inclinación de la fuente.

Minion Variable Concept, nos permite ajustar el grosor y tamaño óptico.

Myriad Variable Concept nos permite trabajar con los estilos, grosor y anchura de los mismos.

Fuente variable en Photoshop

Skia nos permite ajustar las variaciones de peso y anchura de la fuente.

La superfamilia Source, nos da la posibilidad de jugar con el rango de peso en cada diseño, y también contiene el conjunto de caracteres completo de las versiones Pro.

System Font es la menos versátil y sólo nos permite establecer variaciones de grosor.

Sin duda estas fuentes variables nos abren nuevas posibilidades a los diseñadores para poder ajustar la apariencia tipográfica totalmente al trabajo y resultado visual que queremos, optimizar su aplicación y una mayor libertad tipográfica.

Ajuste de fuente variable