UNIDAD 4 ANEXO Tipografías: Uso y diferenciación de tipografías en el entorno gráfico. Reglas básicas para el buen manejo de la tipografía.

1. No usar muchas fuentes

Una buena regla a seguir es no utilizar más de 3 tipos diferentes en un

mismo documento. Evitarás el desorden y fortalecerás la identidad. También conseguirás que el diseño sea limpio y facilitarás la lectura.

2. Jerarquía

La tipografía es un elemento muy importante a la hora de crear jerarquía en el diseño. Debemos determinar a qué elemento le damos más importancia, que el lector sepa en cada momento que tipo de información

está leyendo.

3. Tamaño de la fuente

No conviene utilizar más de 4 tamaños en un documento o página web.

Preferentemente 3 (es un tema de coherencia), lo suficientes para destacar cierto texto: un tamaño para el título, uno para la introducción y otro para el cuerpo de texto. Esto es un conjunto coherente. Recuerda que hay un tipo de letra para cada cosa. La tipografía artística, por ejemplo, no es una buena elección para el cuerpo de texto, se volvería ilegible. Es mejor reservar las tipografías experimentales para los carteles o incluso para titulares.

4. Interlineado

Es el espacio que hay entre líneas. Normalmente nos ceñimos al interlineado que se queda por defecto, pero hay que tener en cuenta el tipo de letra elegida y el tamaño de esta para determinar el interlineado justo. Lo normal sería 2 puntos más por encima de la configuración automática.

5. Kerning (interletraje)

El kerning es el espacio entre letras. Parece un tema obvio, pero necesita atención cuidadosa. Tenemos que considerar si el tipo de letra elegido necesita más espacio o no. La Helvética y Futura tienen un poco de espacio entre las letras en su configuración normal. Evita que las letras se solapen unas a otras a no ser que la idea de tu diseño lo requiera.

6. No abuse de las negritas

La negrita te ayuda a resaltar palabras dentro de un texto, y su uso debe ser sencillo y elegante. Si abusas de negritas, subrayados y cursivas, tu diseño tendrá un aspecto desordenado.

7. Mayúsculas las justas

No escribas párrafos en mayúscula. No hay nada más odioso y terriblemente ilegible. No sé cuantas veces los clientes me han enviado documentos escritos en mayúsculas en su totalidad.

8. Cuidado con el justificado Si justificas el texto, lo fuerzas a crear tremendas brechas entre las palabras. Es antiestético.

9. Líneas ni demasiado cortas ni demasiado largas La longitud de las líneas de texto también es importante. Una longitud correcta ayuda a la legibilidad y evita que el ojo se deslice inecesariamente de arriba a abajo, o de izquierda a derecha. No menos de 6 palabras y no más de 12 podría ser una opción. La página será más clara y legible.

10. Utilizar bien los símbolos de puntuación Éste es un punto que se olvida fácilmente en la tipografía. La imagen de abajo, de Mark Boulton, lo ilustra perfectamente.

11. La secuencia Fibonnaci

Los dos primeros números de Fibonacci son 0 y 1 y cada número que sigue es la suma de los 2 anteriores: 0 1 1 2 3 5 8 13 21 34 55 89 144 ... Desde el Renacimiento, muchos artistas y arquitectos han realizado sus obras basándose en la divina proporción. Por lo tanto, en la tipografía es una buena sugerencia considerar el uso de esta secuencia para proporcionar el tamaño de las tipografías elegidas.

Tutorial de manejo tipografías en Illustrator En este post vamos a aprender a manipular la tipografía en Illustrator para luego exportarla a Photoshop y darle los efectos y retoques que queramos. El concepto es sencillo, pero si nunca has ido a una clase de diseño gráfico o Illustrator, te puedes volver loco para aprender a hacerlo. Es algo que me gusta mucho porque sirve tanto para la creación de logos y posters, como para utilizar en diseño web y darle un toque especial a los contenidos. Este artículo se dirige principalmente a los diseñadores web que no saben Illustrator o tienen unos conocimientos muy básicos, porque imagino que a los diseñadores gráficos les parecerá algo muy básico. Aún así, vale la pena repasar el concepto y tenerlo en mente, porque ayuda a crear diseños más orginales. Siento si a veces explico lo básico con mucho detalle, pero mi deseo es que estos conocimientos puedan ser también utilizados por personas que nunca han trabajado con Illustrator, pues creo que el conocimiento ha de ser accesible para todos y son muchos los diseñadores web que raramente han trabajado con Illustrator.

En este ejemplo he utilizado la tipografía “Futura Bold”, esta tipografía es la utilizada por Absolute, una marca de vodka bastante conocida. queremos crear. Pero podéis usar cualquier tipografía y, tal y como veremos, manipularla para expandir lo que nos interese. El resultado final será este:

MANIPULAR LA TIPOGRAFÍA CON ILLUSTRATOR Lo primero que deberemos hacer es abrir Illustrator, escoger la herramienta texto (la T del panel izquierdo, igual que la de Photoshop) y una vez seleccionada, en la parte superior seleccionar la fuente que queremos, en mi caso Futura Bold, y darle un tamaño de 150pt aproximadamente, no por nada, sino porque al ser la tipografía más grande nos será más fácil editarla. Escribimos la palabra que queramos, en este caso he utilizado Barna para jugar con los efectos de la B.

PASOS A SEGUIR

Una vez hemos escrito “Barna”, hemos de seleccionar el texto. Para hacerlo, pulsamos la flecha negra y clicamos sobre él, de este modo lo hemos

seleccionado todo. Una vez seleccionado el texto, pusamos Ctrl+Shift+O (en Mac en lugar de Ctrl pulsamos la tecla de Command). Ahora ya tenemos el texto vectorizado.

El siguiente paso es que queremos manipular cada letra por separado, por lo que utilizamos el comando Ctrl+Shift+G, y ahora ya podemos manipular la B sin problemas.

Hemos de buscar una imagen que nos guste, que no tenga mucho peso, porque de otro modo el archivo será demasiado pesado y no nos interesa por temas de eficiencia. Para este ejemplo utilizaremos la siguiente imagen:

Para insertarla en nuestra área de trabajo, iremos a Archivo > Colocar..

Y ahora pulsaremos el botón superior de Calco de Imagen:

Veremos que la imagen queda en blanco y negro con sólo los rasgos remarcados. Lo siguiente será pulsar Expandir, también en el panel superior, justo donde antes se encontraba Calco de imagen.

Ahora veremos que han aparecido unos puntitos azules alrededor de la figura, esto es porque la hemos vectorizado. Lo siguiente es que queremos eliminar el

fondo blanco de la figura y quedarnos sólo con el negro. Para ello, deseleccionamos la imagen, pulsando en cualquier sitio fuera de la imagen, y seleccionamos la flecha blanca del panel izquierdo. También la podemos seleccionar pulsando la tecla A. Ahora pulsamos dentro de la imagen en la zona de fondo blanco y damos a la tecla suprimir. Ya tenemos sólo la silueta de la figura.

MODIFICANDO LA TIPOGRAFÍA

Ahora el problema es que la B tiene dos agujeros. Si sobreponemos la imagen a la B tal y como es, no se distinguirá que es una pareja, debido a que hay fondo blanco. Lo que nos interesa es poner la imagen en una zona que sea toda negra. Para ello, lo que haremos en este caso es manipular la letra B. Con la flecha negra de selección, movemos la imagen de la pareja a un sitio que no nos moleste para manipular la B. Una vez hecho esto, seleccionamos la flecha blanca de selección directa. Y con ella pulsamos en el contorno del agujero inferior de la B. Es importante haber vectorizado el texto tal y como se explica más arriba, de otro modo no podremos hacer este paso.

Una vez seleccionado, veremos que aparecen unos puntitos azules alrededor del agujero de la B, tal y como se puede ver en la imagen adjunta. Cuando tenemos esto así, pulsamos suprimir, con lo que borraremos el agujero blanco. Es posible que tengamos que pulsar la tecla suprimir dos o tres veces seguidas para que se borre del todo. Una vez hecho esto, tenemos una B con sólo el agujero superior. Y ahora viene la parte divertida, y es combinar la imagen y la letra B, para dar el efecto que queremos practicar aquí. Reducimos el tamaño de la imagen hasta que quepa en la parte del agujero de la B. Que no os pase como a mí cuando no sabía Illustrator y venía de Photoshop que me pasaba el día con el Ctrl+T, en Illustrator no se hace así. Es tan fácil como seleccionar la imagen con la flecha negra y pulsando en una esquina de la imagen, reducirla. Para que la imagen no se distorsione de tamaño, mantenemos pulsada la tecla Shift mientras arrastramos.

Una vez tenemos el tamaño de imagen deseado, lo ponemos justo encima del espacio en negro de la letra B, tal y como se puede ver en la imagen. Es importante arrastrar la imagen con la flecha negra y no la blanca, porque la flecha negra selecciona toda la imagen, mientras que la blanca sólo selecciona puntos del trazado. Una vez hecho esto, necesitamos la herramienta Buscatrazos. Si no la tenemos activada, la podemos encontrar dentro del menú Ventana > Buscatrazos o bien con las teclas Ctrl+Shift+F9. Lo que vamos a hacer ahora es seleccionar con la flecha negra la B y la figura, para ello simplemente pulsamos la flecha y sin dejarla de pulsar, la arrastramos para seleccionar la B y la imagen, sin seleccionar ninguna otra letra. No es necesario que selecciones toda la B, con que selecciones sólo una parte de la letra y de la figura, ya se habrá seleccionado todo. Una vez hecho esto, pulsamos el segundo botón desde la izquierda de Buscatrazos:

Si no nos gusta cómo ha quedado, con Ctrl+Z deshacemos el paso anterior, con lo que podemos volver a modificar la imagen y ponerla donde más nos guste. Refrencias: http://www.creativasfera.com/tutorial-basico-para-manipular-la-tipografia-en-illustrator http://siemprecomunicando.blogspot.com/2010/01/reglas-basicas-para-el-buen-uso-de-la.html