← El divorcio del contenido y su administrador | ↑ Principal | Carlos Alazraki y la publicidad política en México →

La dirección de la imagenArtículos

Escrito por Mark hace más de un año | Enlace permanente | 12 comentarios

"Necesito que le pongas un texto a esta imagen" —te dice un cliente imaginario.

1.jpg

Básicamente tienes dos opciones, moverlo a la derecha o a la izquierda, ¿Cuál eliges?

2.jpg

La solución (obvia, espero) es poner el rostro al lado derecho. Ya estoy escuchando el bostezo colectivo de mis colegas diseñadores. Paciencia, más adelante tengo algo más avanzado.

Los seres humanos tenemos una obsesión con las miradas. Por eso hay miles de portadas de revista con rostros mirándote fíjamente. Y cuando están mirando hacia otro lado, tú sigues la mirada. Te intriga saber qué están viendo. Cuando pones un rostro mirando hacia el borde del papel estás decepcionando la intriga natural del ser humano.

Pero no sólo los seres vivos tenemos un rostro, los productos también lo tienen. Veamos este ejemplo sacado de la página de Apple:

3.jpg

El el ejemplo modificado la MacPro parece distante, mirando hacia otro lado. Lo mismo sucedería con un auto, un shampoo, un móvil, un lápiz, lo que se te ocurra.

Lo mismo sucede con la tipografía en el mundo occidental, pero por razones bastante distintas. Los expertos dicen que leemos de izquierda a derecha, y de arriba a abajo. Sin embargo, también podemos leer de derecha a izquierda y de abajo hacia arriba. Sólo tienes que voltear una página de cabeza y tratar de leerla sin inclinar la cabeza o la hoja. Cuesta trabajo, pero es mucho más fácil que leer un texto cuyos caracteres fueron revertidos:

text.gif

Poner el texto en vertical es algo que debes de evitar si puedes, aunque hay ocasiones en las que no encuentras una solución más satisfactoria. Sin embargo, hoy sólo estamos experimentando, así supongamos que nuestro cliente exige que los títulos estén en vertical o no nos paga. Veamos cual es la mejor solución:

4.jpg

Las flechas indican hacia dónde salta la vista después de leer el título. La única solución decente es poner el título girado 180° en el sentido de las manecillas del reloj, en la parte superior izquierda.

Tomé esta foto en el aeropuerto de México D.F. (disculpen la calidad, la cámara de mi celular es casi de juguete). Se me hizo curioso, porque el texto en vertical generalmente se pone arriba a abajo, como en los lomos de los libros. Pero tiene sentido si tomamos en cuenta a dónde salta la vista con la ubicación de la puerta.

5.jpg

Ahora, si hacemos una toma en gran angular fake, podemos ver que la dirección del texto cambia de acuerdo al contexto (disculpen lo burdo del retoque):

6.jpg

Y por último, hay algo que jamás se debe de hacer, no tiene justificación alguna:

V
E
R
T
I
C
A
L

El alfabeto romano no tiene la cualidad de leerse bien así. Sólo unos cuantos alfabetos asíaticos lo permiten, como el chino y el japonés, otros alfabetos como el manuscrito mongol lo exígen. Más información en la Wikipedia.

Comentarios Escribe un comentario

1. adrmx
Escrito hace más de un año
Febrero 9, 2007

Que buen post, muy agradable y me dejo claro bastantes cosas con respecto a la orientación de texto y de objetos con el texto.

Gracias ta chido :P

2. Bono
Escrito hace más de un año
Febrero 9, 2007

Excelente nota, muy buen aporte, no sé qué más decir, estoy emocionado..... jaja.
La verdad que muy bueno. Las cosas se aclaran bien para que muchos no tengamos que entrar en la duda y cometer errores.

Saludos!

3. sosa
Escrito hace más de un año
Febrero 9, 2007

¿"Un móvil"? Jolines!

Jeje, muy buen artículo. Otra cosa que hay que considerar es el movimiento de la imagen. Lo digo porque hay un espectacular de prodigy infinitum cerca de aquí donde un tipo (¿tío?) va paseando a un cheetah como si se tratara de un perro. La imagen tiene harto motion blur y la fregada pa que se vea que va muy rápido y el copy dice algo como "navega a máxima velocidad" o algo así. El caso es que según yo, una imagen así debería ir a la derecha de la composición, casi saliendo del cuadro, de otra manera la idea de velocidad no se logra por más efecto de photoshop que le pongan.

Bueno, eso digo yo.

4. Mark
Escrito hace más de un año
Febrero 9, 2007

Si tienes un mensaje que se comunica mejor rompiendo las reglas, hazlo. Si recuerdas el escándalo de que no dejaron ir a Fox a una visita internacional, un buen titular hubiera sido una foto de Fox, cruzado de brazos, viendo hacia otro lado con cara de puchero con un titular que dijera "Denegado" (o algo así).

Las reglas hay que conocerlas para romperlas con elegancia.

5. L i A m
Escrito hace más de un año
Febrero 12, 2007

buen post

me permites citarlo


saludos

6. agus
Escrito hace más de un año
Febrero 12, 2007

muy bueno el post. enhorabuena.

lo del fumador chino con el texto "neque porro",
¿es a propósito?

un saludo

7. Mark
Escrito hace más de un año
Febrero 12, 2007

Jajaja, para nada, es una partecita del text falso "lorem ipsum, dolor est amet" que usamos los diseñadores para poner texto temporalemente, no me había dado cuenta que empezaba por el buen porro.

8. Irene
Escrito hace más de un año
Febrero 14, 2007

¿Sabés si hay algún estándar respecto a los lomos de los libros? A mi me llama la atención que son tan caóticas las direccionalidades y los ordenamientos...

9. Mark
Escrito hace más de un año
Febrero 14, 2007

Sí Irene, lo "normal" es que el texto se lea de arriba a abajo, así cuando lo pones sobre una mesa con la portada hacia arriba, el texto del lomo no queda al revés.

Artemy Lebedev escribió al respecto.

10. Erick C
Escrito hace más de un año
Febrero 14, 2007

acerca de tu ùltimo ejemplo, las dichosas letras de "farmacia" jejejejeje. muy buen post.

11. Patricio Villarroel
Escrito hace más de un año
Abril 4, 2007

Notable post. Me servirá mucho para el trabajo que debo entregar mañana.

Has oído hablar de los Concept Boards? bueno... eso debo entregar mañana.

Saludos!

12. carlos ramirez
Escrito hace 10 meses
Octubre 10, 2007

hola quisiera saber como puedo hacer una grilla para la tapa de un libro.

Escribe un comentario

(opcional)

(opcional)