Cómo desarrollar una tipografía digital PDF

Cómo desarrollar una tipografía digital Profesor Roberto Osses ANTES Dos herramientas fundamentales de la comunicación visual Conceptualización & Síntesis Conceptualización Definir un fenómeno a partir de sus ideas principales Conceptualización EJEMPLO: laberinto caos problema complejo lío desorden...

Cómo desarrollar una tipografía digital Profesor Roberto Osses ANTES Dos herramientas fundamentales de la comunicación visual Conceptualización & Síntesis Conceptualización Definir un fenómeno a partir de sus ideas principales Conceptualización EJEMPLO: laberinto caos problema complejo lío desorden (puede ser cualquier cosa) Síntesis Representar un fenómeno a partir de sus características esenciales Síntesis EJEMPLO: Rostro de un adulto dibujado por un niño de 4 años No necesita orejas, ni nariz y sigue representando un rostro AHORA SÍ 1. Inspiración Puedes ser cualquier cosa ÚNICA REGLA Debe ser apasionante para el autor de lo contrario muchas veces el proyecto se abandona Corroborado al analizar la gran cantidad de fuentes inconclusas o con falta de caracteres 2. Objetivos ¿A ó B? Fuente para texto fuente para títulos ¿A ó B? Fuente para texto fuente para títulos Más reglas morfológicas Lectura extensa Casi neutras Poco distractivas Menos reglas morfológicas Lectura breve Concepto evidente Alto impacto ¿A ó B? 3. Personalidad de la fuente 3 REFERENTES 7 Tres categorías abcd efghi 1. ESCRITOS Antecedentes escritos 2. GRÁFICOS Imágenes relacionadas 3. TIPOGRÁFICOS Fuentes similares ¿a a a aa a aaaaaaa AAAAAAA AA AA A A ? LENGUAJE DE LA FORMA + compleja + sensual + violenta + loca + descontrolada + eléctrica + cariñosa HERRAMIENTAS TÉCNICAS La síntesis visual determina la personalidad 4. Letras esenciales changosy Estas letras sirven de base para el resto del alfabeto changosy Tenemos curvas, rectas, diagonales, mixtas y casos especiales. Podemos analizar como están estructuralmente relacionadas e ir derivando el resto de la letras del alfabeto AJUSTES ÓPTICOS regulan el equilibrio entre negro y blanco en cada letra 5. Pautas de sistematización Ancho de curva Ancho de horizontal de curva Ancho de recta Ancho horizontal Ancho contraforma acpbngu ivyhmd h a pbngu acpbngu iivyhmd vyhmd h Las letras comparten rasgos pero deben ser distintas entre sí 6. Digitalización Cualquier versión de Illustrator 3 Crear guías principales Dentro de la página tendremos un excendente de cincuenta puntos arriba y abajo 3 Insertar imagen de tu fuente Considerar una mayúscula con tilde y una minúscula con descendente 3 Establecer métrica horizontal Estas medidas dependen de la altura equis de cada fuente Ejemplo: Áabg Áabg Perpetua Helvética ¿Qué tienen en común? Perpetua Helvética ¡ Ambas miden lo mismo! 200 puntos 200 puntos Áabg Áabg 3 Calcar las letras 7. FontLab Preparar el archivo nuevo Cuatro clicks para abrir la ventana de cada letra Acceso al panel de capas Desplegar panel de capas Desactivar la visualización de la capa de fondo (opcional) Activar la visualización de la capa de cuadrícula Establecer la métrica Pegar las letras copiadas desde Illustrator Encajar las letras en el área correspondiente (entre “D” y “A”) Desbloquear “Vertical metrics” y ajustar la línea base y el punto cero También la altura equis , descendentes, ascendentes y mayúsculas Posible inconveniente y solución Presionar opción para ver rellenos y si aparece este problema Seleccionar el trazo, presionar click derecho y revertir el contorno Distribuir cada letra en su casilla Cortamos la “B” y la pegamos en su casilla, luego lo mismo con el resto No importa que las letras queden alejadas del punto cero Espaciado La acciones permiten hacer todo más rápido Para espaciar la fuente nos dirigimos a “Metrics” Podemos aplicar el espaciado a solo algunas letras o a toda la fuente En el panel preview podemos apreciar el espaciado En “New metrics window” podemos espaciar de forma individual Podemos resolver casos especiales probando como funciona El kerning se puede resolver aquí, pero es mejor trabajar con “Clases” Tildes Solo se debe abrir la ventana e insertar el tilde Luego se cierra Al clickear sobre el caracter acentuado, se arma automáticamente FontLab junta “instancias” de la letra y de su tilde (componentes) Así, al modificar la letra original se ejecuta el cambio en todas Basta con clickear para que se constituyan a partir de componentes Información de la fuente Font info Names and Copyright Se escribe el nombre de la fuente y se establece su peso Luego presionando “Build names” se rellena automáticamente Lo mismo con los nombres para OpenType Copyright Listo Guardar archivo Fontlab Esto debió haber sido mucho antes, pero así es la vida. Guardar archivo.vfb Guardar archivo.vfb Cuatro pasos para asegurar la calidad Correct Connections Close open contours Set PS direction Autohinting LLEGÓ EL MOMENTO DE GENERAR LA FUENTE Generate font Seleccionamos el formato Generamos nuestra fuente USO DE LA TIPOGRAFÍA MILICIANA DISEÑADA POR FABIÁN FLORES ABCDEFGHIJKLMNÑOPQRSTUVWXYZ 1234567890 !”·$%&/()=?¿*^Ǩ_:;,.@¢÷“”‚][}{–… WWW.ANDEZ.CL Universidad SciencePo, Paris, Francia, junio 2011 Para acceder a esta presentación y otras complementarias visite: www.andez.cl