Actividades

Composición Tipográfica

Concepto: Los tipos gráficos son figuras o formas realizadas íntegramente con caracteres tipográficos: letras, signos de puntuación o números. 

Podemos definir el diseño de una composición gráfica como la adecuación de distintos elementos gráficos previamente seleccionados dentro de un espacio visual, combinándolos de tal forma que todos ellos puedan aportar un significado a la misma, consiguiendo el conjunto transmitir un mensaje claro al espectador.

El diseño gráfico ha de tener en cuenta los aspectos psicológicos de la percepción humana y las significaciones culturales que pueden tener ciertos elementos, eligiendo éstos de forma que cada uno de ellos tenga un porqué en la composición y buscando un equilibrio lógico entre las sensaciones visuales y la información ofrecida.

Lo más importante de toda composición es el mensaje que subyace bajo ella.  Es trabajo del diseñador buscar la máxima eficacia comunicativa, transmitiendo ese mensaje por medio de una composición que impacte visualmente al espectador y le haga receptivo

Actividad a desarrollar

Diseñar una composición tipográfica en 3D.

Aplicación: Adobe Illustrator, Adobe Photoshop CS5.

Descripción: Diseñaremos una composición en 3D que resulte atractiva e impactante.  Con pocos recursos y sin necesidad del uso de Software destinado al 3D.

Paso 1: 

Debemos producir las letra en un programa con algún tipo de edición en 3D como por ejemplo Adobe Illustrator.

• Elige una tipografía gruesa y legible, no uses tipografías demasiado complicadas ya que el proceso se haría más elaborado.
• Una vez tengas el texto deseado, hay que convertir el texto en imágenes vectoriales, ya que deberemos convertirlas en 3D de una en una, para que el ángulo de cada una sea diferente al resto. Esto dará un aspecto más vistoso y realista al no ser tan perfecto.  Para ello >> Selecionamos el texto > Objeto > Expandir > OK (cmd+shift+O en Mac y ctrl+shift+O en Windows) y a continuación. Objeto > Desagrupar. Nuestro texto ahora son objetos vectoriales.
• Ahora ya se puede dar el effecto 3D. Para ello >> Selecionamos el objeto > Effecto > 3D > Extrusión y Biselado

"Asegúrate de que el ángulo de cada elemento sea diferente, teniendo en cuenta el orden de lectura y que en el la composición, las letras irán apoyadas unas sobre otras"

Paso 2: 

Abrimos un Photoshop. Archivo > Nuevo. En este caso yo voy a hacer una ilustración que será impresa y con suerte colgado de la pared de algún seguidor de nuestra web. Por lo tanto mi documento tendrá un perfil de color CMYK (destinado a impresión), si por el contrario tu intención es publicar la imagen en la web, entonces utiliza el perfil de color RGB (para pantallas). La resolución deberá ser lo más alta posible y las dimensiones 30 cm.  x  20 cm.

• Ahora importamos nuestras letras en 3D desde Illustrator a Photoshop. ¿Como?.  En Illustrator, selecionamos una letra y presionamos cmd+C (copiar) o ctrl+C si trabajamos en PC y nos vamos a Photoshop. Aquí hacemos cmd + V (pegar), elegimos la opciónObjeto Inteligente y presinamos Intro. Repetimos la misma operación con cada una de las letras, una por una, de manera que cada una ocupe un capa en Photoshop.
• Ya tenemos todas nuestra letras 3D en Photoshop y podemos empezar a trabajar el aspecto gráfico para hacerlas más atractivas.

Paso 3: 

Selecciona la cara frontal de una de las letras (puedes hacerlo con la varita mágica ajustando la tolerancia para que la selección sea óptima), haciendo que la selección ocupe toda la superficie delantera de la misma.

Paso 3:

• Con la selección todavía en activa, hacemos una nueva capa por encima de la capa que contiene la letra sobre la que estamos trabajando. Dentro de la selección hacemos un toque con un pincel. Si no tienes pinceles atractivos puedes utilizar cualquier imagen a tu gusto para decorar las letras, puedes utilizar esta referencia para  adicionar otros pinceles a tu aplicación (http://www.brusheezy.com/Brushes/1290-13-blood-and-splatter-brushes).
• Ahora, de nuevo haz una nueva capa debajo de la capa con el toque de pincel, recuerda que aún tenemos la misma superficie seleccionada. Aquí introducimos un color degradado, para ello seleccionamos dos colores de la misma gama para que la imagen no resulte demasiado saturada de color, hacemos click en la herramienta “Degradado” y con la opción primera de degradado activa extendemos el degradado por la superficie seleccionada, haciendo click en una punta de la misma y arrastrando hacia la otra.

Paso 4:

Ahora deberíamos tener dos capas por encima de cada letra, esto nos da varias opciones a la hora de unificar estas capas para su mejor manejo, podemos seleccionar las tres capas y unificarlas, (click derecho > Combinar capas), o también podemos agruparlas en carpetas, lo que nos dará mayor libertad por si quisieramos cambiar algo a posteriormente.

Una vez que hecho esto, podemos empezar a darle mayor realismo añadiendo sombras, para ello haremos una capa debajo de cada letra y en esta nueva capa con un pincel blando iremos dibujando las sombras a nuestro gusto, asegúrate de que el flujo es pequeño para que la sombra sea uniforme..

• Puedes borrar los escesos de sombra de las zonas limpias seleccionando las áreas con la pluma bezier, click derecho > Hacer selección >  Selección nueva. Y borramos.

Una vez limpios los eccesos de sombra, tendremos algo así.

Aunque Photoshop cuenta con herramientas para el sombreado, siempre es preferible tener un mayor control sobre éstas y hacerlas manualmente. Al principio te costará un poco más, pero el resultado es mucho más atractivo. 

Paso 5:
A partir de aquí, puedes hacer la composición tan creativa como tu quieras. Eso es cosa tuya.

Tomar en cuenta que esta composición la subirán al dropbox de la cuenta tipografia@gmail.com , carpeta compartida proyecto final.

Saludos Cordiales.