Éste es el primer post de una serie de minitutoriales sobre Twine enmarcados en #LEARNUARY, un esfuerzo colectivo por aprender nuevas habilidades durante el primer mes del año.

Vamos a comenzar nuestra serie de tutoriales sobre Twine con algo sencillo, pero que ayuda mucho a personalizar las historias que escribamos: importar y utilizar fuentes personalizadas.

Además de la fuente estándar de Twine, podemos utilizar fuentes que sean comunes a muchos sistemas operativos y dispositivos simplemente accediendo al CSS de la historia

Fuentes Personalizadas CSS

y añadiendo la línea:

Fuentes Personalizadas estándar

Pero, ¿Qué hacemos si la fuente que queremos usar no es de las comunes, o simplemente, queremos asegurarnos de que el sistema no nos la cambia?

Hay dos maneras de hacer ésto en Harlowe: mediante un enlace a un sitio web externo o incorporando el archivo con la fuente junto con el HTML y luego «llamándola» desde el código.

Para enlazar a un sitio externo se utiliza el comando @import url, sólo tenemos que buscar la dirección en la que está almacenada la fuente. Yo aconsejo usar Google Fonts, que además de tener una enorme variedad de tipos de letra, carga muy rápido las fuentes personalizadas. Pongamos que quiero utilizar la fuente «Montserrat» (que es la que utilicé en «La Página en Blanco» con un resultado muy bueno en mi opinión) enlazándola desde Google Fonts. Así es como quedaría el código:

Fuentes Personalizadas Import

Cuidado con la sintaxis, si nos dejamos unas comillas o punto y coma el código no funcionará. El mismo Google Fonts nos dice como tenemos que usarla, sólo hay que hacer copy&paste de la sección de @import, ignorando las etiquetas de html.

Fuentes Personalizadas Google Fonts

Por último, en el caso de que queráis incluir una fuente sin tener que enlazar a algún sitio externo, sólo tenéis que descargarosla de la página que decidáis (yo por ejemplo recomendaría DaFont) y acompañarla junto con el html cuando exportéis el juego. Luego sólo hay que usar el comando @import url poniendo en la ruta de acceso el nombre del archivo de fuente que hemos incluido.