Siempre me han gustado mucho las ilusiones ópticas. Esta la parte de enigma en saber como funcionan, pero casi más interesante es cuando te preguntas como es posible que, de una forma tan sencilla, tu cerebro sea capaz de engañarte. Bueno, quizás engañar no sea la palabra adecuada, sino porque recibimos unas señales visuales que podemos comprobar que no son ciertas. Como nuestro ojo, que quizás sea nuestro sentido más directo con el exterior, junto con el cerebro, no es capaz de percibir de forma correcta la realidad. Por eso, hoy os quiero mostrar una ilusión óptica que no conocía, pero que me ha resultado muy interesante: la irradiación.
Como diseñadores, las ilusiones ópticas nos tienen que resultar es algo tremendamente interesante, ya que gracias a ellas podemos conocer como funciona nuestro cerebro y como podemos usar este conocimiento a nuestro favor. Ya en su momento hablamos de como cada forma tenía un significado diferente, pero eso estaba más en el plano psicológico. Hoy queremos centrarnos más en la percepción que tenemos de nuestro alrededor. Y con el efecto de la irradiación lo hacemos de la forma más simple posible, ya que solo tiene en cuenta dos factores: el color blanco y el color negro.
Eso sí, antes de empezar de lleno, vamos a ver de donde surge y en que consiste la ilusión o efecto óptico de la irradiación ya que, aunque dije que lo descubrí hace poco, se conoce desde hace muchísimos años.
Origen del efecto de irradiación
No vamos a remontar al siglo XVII, donde Galileo Galilei en su libro Diálogos sobre los dos máximos sistemas del mundo mencionaba un curioso efecto al observar cuerpos celestes a través de su telescopio. Se dio cuenta que, según a la hora del día a la que observase un planeta, y la cantidad de luz que este recibiese, percibía un cambio de tamaño en ellos.
De aquí saltamos al siglo XIX, cuando el físico alemán Hermann von Helmholtz le dio nombre a este fenómeno: el efecto de irradiación. Este efecto hacía que, si tenemos dos áreas exactamente iguales, siendo una de color blanco y otra de color negro, visualmente percibimos como de mayor tamaño el área de color blanco.
Esto se debe a que por la dispersión de la luz dentro del ojo, percibimos que las zonas claras tienden a propagarse hacia las zonas oscuras. Por lo que un objeto claro rodeado de una zona oscura lo vemos más grande que un objeto oscuro dentro de una zona blanca. Aunque los dos tengan el exactamente el mismo tamaño.
El efecto de irradiación y su uso práctico
Una vez tenemos definido en que consiste este efecto, podemos ver varios casos prácticos en los que se aplica este efecto, y que posiblemente nunca nos hemos parado a pensar que se estaba usando.
La utilidad de los modos oscuros en la lectura
El modo oscuro lleva unos años de moda tanto en webs como aplicaciones. El disponer de esta opción de visualización cada día es más habitual en cualquier proyecto. Por un lado tenemos que, el fondo oscuro hace que sea menos agresivo a nuestros ojos la visión directa de una pantalla. Por otro, en pantallas OLED, el consumo de energía es menor, ya que las partes de color negro de la pantalla están apagadas.
Y por último, por el efecto de irradiación, si tenemos un texto de color blanco sobre un fondo oscuro lo veremos más grande que el mismo texto en negro sobre un fondo claro. Es decir, será más legible y facilitará su lectura. Todo ventajas. Vamos a hacer una prueba mediante un pequeño texto.
Ambos textos a derecha e izquierda son idénticos en cuanto a tamaño y grosor. Pero al observarlo, casi notamos que el texto con fondo oscuro parece que es algo más grueso, y es más sencilla su lectura, y no lo es. Y eso que en este caso no estamos usando ni un negro ni un blanco puro, con el que las diferencias serían aun mayores.
Uso del blanco y negro en iconos e ilustraciones
Aparte del texto, este efecto también afecta a cualquier tipo de ilustración o iconos que diseñemos. En este caso particular, quiero centrarme en el apartado iconos, ya que parece que al diseñarlos nos centramos en unas reglas más matemáticas, donde tiene que existir cierta armonía, los espacios en blanco deben ser iguales, siempre intentamos jugar con los mismos grosores de línea, etc. Lo que sobre el papel está regido por una cuadrícula perfecta, según lo veamos con un fondo oscuro o claro, a los ojos no nos parece tan perfecto.
Este tipo de inconvenientes son bastante comunes. No es extraño que presentéis un diseño a un cliente, y os lo devuelvan con correcciones del tipo hay que corregir este icono, ya que el espacio en blanco y el relleno no son iguales. Y sí, son iguales. Pero visualmente dará una impresión u otra según el color del objeto y de su fondo, y tendremos que hacer ajustes para que visualmente sea vea correcto, aunque geométricamente no lo sea. Aunque no trata específicamente sobre esto, hay un interesante artículo de Creative Bloq y el logo incorrecto de Google, y la diferencia entre lo ópticamente agradable, y lo geometricamente correcto.
Conclusiones
Cuando se trata de crear algún diseño como ilustraciones o iconos, o simplemente insertar un texto pensando en su legibilidad, el color del elemento con respecto a su fondo es un factor esencial, ya que entramos en el terreno de lo que nuestro cerebro interpreta. Los colores claros tienen mucha más fuerza visual que los oscuros, por lo que hay que tener en cuenta a veces hay que dejar de lado la perfección geométrica para dar paso a la visualización placentera. Y que, como sabemos por el efecto de irradiación, quizás debamos cambiar de tamaño algunos elementos dentro de nuestro diseño para que aparenten el tamaño que realmente queremos que tengan.
El uso más directo es que si tenemos un texto oscuro sobre un fondo claro, es recomendable darle mayor grosor a la tipografía para aumentar su legibilidad, aunque con la combinación de colores opuestas sea perfectamente legible. Y esto es extensible a cualquier ilustración que use lineas finas blancas en fondo negro se vean, pero si invertimos de colores apenas sean perceptibles. Como hemos dicho en muchas ocasiones, la importancia del uso del contraste en nuestros diseños, pero que se comporta de forma diferente según cual queremos que sea el color predominante.
Como siempre, esperamos que os haya sido interesante el tema de las ilusiones ópticas y el efecto de irradiación que se produce en nuestro cerebro. Tenéis disponibles los comentarios para hacernos llegar vuestras impresiones, dudas o experiencias que tengáis con este tema.
PD: en la imagen de portada de este artículo también tenemos un efecto un efecto de irradiación: ambos círculos tienen el mismo tamaño, y las circunferencias de su alrededor tienen el mismo grosor. Aunque a primer vista parezca que la de la derecha sea mayor.
