El modo noche responde a otra cosa: a lo que pasa delante de la pantalla en entornos donde no esperábamos que hubiera una pantalla… pero el usuario la saca del bolsillo o cartera.

1. El tiempo de la biología: adaptación a la oscuridad

Ante situaciones de baja iluminación, nuestros ojos se acostumbran y empiezan a reconocer detalles donde antes no los percibían. La idea de un modo noche es preservar esa condición.

El siguiente simulador IPAX presenta una escena que todos experimentamos: encontrarnos en la cabina de un auto de noche frente a luces que encandilan. En la escena podemos alternar entre tres fuentes habituales en la ruta. Las más agresivas son, nada casualmente, las que eligen quienes aman infligirle luces altas a los demás.

Un clic en la luz activa la apaga, iniciando la adaptación automática a la situación de poca luz. Con el tiempo (acelerado en el visor a unos pocos segundos), pasamos a notar el camino. En un segundo proceso pasamos a la visión nocturna, donde dejamos de registrar colores y alcanzamos a distinguir incluso las tenues estrellas en el cielo.

Cuando volvemos a encender una luz brillante, el efecto de que parezca atenuarse corresponde también a la adaptación del ojo: pasa del encandilamiento inicial, provocado por tener la vista acostumbrada a la penumbra, a tolerar el brillo para recuperar el interior de la cabina.

2. El celular como linterna de frente

En la siguiente escena vemos un celular encendido en modo claro dentro de la cabina. La luz que emite, tiene como efecto secundario impedir la adaptación a la oscuridad. La visión nocturna se vuelve posible recién cuando lo apagamos.

El móvil se convierte, en la práctica, en nuestro propio camión de frente.

La pantalla integrada del auto está preparada para evitar esa ceguera: en modo noche no encandila ni anula la visión del entorno. Si hacemos clic sobre esa pantalla y la cambiamos a modo día, vemos cómo esa configuración incorrecta encandila, genera un reflejo en el parabrisas e ilumina el habitáculo… pero sin llegar a disparar la adaptación a luz brillante como el celular.

Si alguna vez nos tocó viajar como acompañantes y prender el celular (¡que estaba en modo claro!) para buscar la ruta, quien manejaba seguramente nos pidió que bajemos el brillo del celular, o directamente que lo apaguemos. Porque es preferible manejar sin ver el mapa, que sin ver el camino.

El modo noche es una decisión del Design System para que una aplicación pueda utilizarse en cualquier condición operativa real.

3. Halación y astigmatismo: por qué es mejor un “modo noche”

Es común diseñar el modo oscuro como negativo de la paleta clara, reemplazando el fondo blanco por negro puro (#000000) y el texto negro por blanco puro (#ffffff).

Un efecto no esperado de esa decisión de diseño, es una difícil lectura para el 40% de la población adulta que presenta algún grado de astigmatismo.

Esta condición amplifica los efectos de la midriasis: cuando el ojo se enfrenta a un fondo negro absoluto, interpreta que está en penumbra y dilata la pupila al máximo. Si sobre ese fondo negro ubicamos un texto en blanco puro, el exceso de fotones que emiten los caracteres desborda sobre las áreas oscuras, fenómeno conocido como irradiación o halación.

El siguiente simulador permite contrastar cómo se comporta la tipografía bajo la óptica de un ojo con astigmatismo moderado, comprobando cómo el 100% de blanco sobre negro puro genera un halo destructivo.

Como muestra el simulador IPAX, al reducir la luminancia del texto y elevar el valor del fondo, mitigamos la dilatación pupilar extrema y acotamos el efecto. Este es uno de los casos donde la doctrina dominante en accesibilidad (cuanto más contraste, mejor) resulta una simplificación simplista, sobre lo cual Santiago Bustelo expuso en Rosenverse en julio pasado.

Dado que se ha popularizado el término “modo oscuro” para los casos en donde el texto es más claro que el fondo, desde Kambrica proponemos llamar “modo noche” al subconjunto que considera la ergonomía en sus decisiones de diseño.

Para ayudar a lograrlo desarrollamos IPAX, un modelo y conjunto de herramientas para ayudar a mejores decisiones de diseño, considerando la física de la luz y la percepción. Y con IPAX Foundation Layer, ayudamos a que los Design Systems resuelvan esta complejidad combinatoria haciéndolos escalables, accesibles y ergonómicos, sin necesidad de rehacer todo desde cero.

Diseñar para lo que ocurre delante de la pantalla

UI es lo que aparece en la pantalla. UX es lo que pasa delante de ella: lo que las personas usuarias experimentan. Diseñar UX implica anticiparse a lo que las interfaces provocarán en las personas, antes de definir qué elementos presentar.

Hace tiempo que el contexto real de las aplicaciones no son los monitores donde se las diseña, ni los proyectores de las salas de reuniones donde se las aprueba. Hoy, además, la transformación digital ha repartido pantallas en absolutamente todos lados: en el tablero del auto, en consolas industriales… y en los bolsillos y carteras, listas para sumarse a cualquier entorno que todavía no las tenía.

Si querés que tu App o sistema de diseño responda mejor a lo que pasa delante de la pantalla, hablemos.

La entrada Modo oscuro vs. modo noche: dos enfoques para problemas distintos se publicó primero en Kambrica.