Rinosaurio.net

Apuntes de diseño de interacción

Publicado en 27 febrero, 2018 en la categoría Diseño de Interacción, Reflexión y con las etiquetas ,

A menudo observo los objetos electrónicos a mi alrededor, y disfruto con la cantidad de cosas que pueden llegar a decir sin usar una pantalla. Ni un sonido. Tan solo una pequeña luz que cambia de color. Que se apaga o se enciende. Que se mueve más rápido o más lento. Siempre lo relaciono con los elementos de la forma que tanto repetíamos en el Programa Vostok, (forma, color, tamaño, posición, movimiento y fondo) y con algunos ejercicios que hacíamos en los que abundaban las limitaciones.

Y es que a veces, una sencilla luz puede decir tanto, que no es necesario que existan pantallas, ni interacciones complejas, ni sonidos, ni palabras, ni tipografías, ni pesos, ni bloques de información. Todo está reducido a eso, a lo más mínimo, y creo que muchas veces nos falta mucho de esto en nuestro día a día frente a la interfaz, es decir, complicarnos menos. A mayor número de opciones, mayor nivel de complejidad.

Hoy quería recoger aquí algunos de esos ejemplos, de mensajes que un sencillo led puede darte, en honor a esa simpleza, y mantener de algún modo esa limitación “viva» en algunos de nuestros diseños siempre que sea posible hacerlo.

Color

El cargador del Macbook es un buen ejemplo. No hay forma más sencilla de que nuestro cerebro identifique un estado. Naranja cuando está aún cargando, verde cuando lo está. No hace falta mucho más para decir tanto. No hacen falta detalles. Ni cuánto queda por cargar, ni cuánto lleva cargado. Es lo que és. Por un lado confirma que algo está ocurriendo, por el otro informa de qué. Puro feedback. Este ejemplo se ha usado en aspiradores, teléfonos y multitud de aparatos electrónicos, rojo / verde. Un clásico entendido por todos.

Yendo más allá, muchos instrumentos electrónicos, como mesas de mezcla, han utilizado el color para informar acerca del nivel de la señal de entrada o salida, por ejemplo, otros, más específicos, como en el caso de los instrumentos de Elektron, esconden una lógica de entrada algo compleja, pero bien resuelta en cada uno de sus led’s:

El sistema de pistas de los instrumentos de Elektron es de primeras complejo, pero bien resuelto.

En este caso las pistas (tracks), de cada instrumento están iluminadas en verde, el led cambia de color a rojo para informarte de qué pista está seleccionada, si una de las pistas está desactivada, el led también lo está, por el contrario, si la pista que está desactivada es justamente la que está seleccionada, ésta se muestra de color amarillo. Todo ocurre en un mismo led. 4 estados distintos, resueltos en una diminuta bombilla y un poco de color.

El color es tan sumamente importante que sustituye las palabras y los números. A veces, he tenido discusiones acerca del uso del color en los diseños. Y es que es el elemento que menos se puede desperdiciar. Y el que más puede contar. Merece la pena reservarlo.

Forma

Lo cierto es que poca variación de forma puede existir en un LED aparte de su circular perfección. Pero también es cierto que nos hemos ayudado de ellos para crearlas. El ejemplo más claro es el visualizador de 7 segmentos, que ha dado vida a multitud de displays de microondas, despertadores, y un sinfín de aparatos electrónicos. El LED ha servido para dibujar la curva de ecualización del sonido ayudando por ejemplo a «visualizar» lo que se está escuchando. También el sistema de visualización del Macbook nos ha permitido saber de cuánta batería disponía sin necesidad de encenderlo. Todo con ocho pequeños LED’s.

Un ejemplo de la cantidad de formas distintas obtenidas con 7 segmentos.

Movimiento

La cafetera parpadea para avisar que no está lista. A su vez informa de que está encendida. Comparte diferente feedback en un mismo punto.

No hay mejor forma que decir que algo está ocurriendo que haciendo parpadear una sencilla luz. Los discos duros externos y algunas memorias nos lo han enseñado durante mucho tiempo. También las tarjetas de red, los routers, incluso ese “respirar” antiguo que antes tenían los MacBooks, y que les dotaba de tanta personalidad. El movimiento, ya sea rápido o sea lento es el principal modo de expresar que algo está pasando. Mi cafetera por ejemplo, con un sencillo LED te informa que aún no está lista. Lo hace parpadeando, y quedándose fija cuando lo está. Es sencillo pero el cerebro no necesita mucho más.

¿Cómo mostraríamos todo esto es una pantalla? Te ánimo a que busques ejemplos de este tipo, y valores la capacidad de expresión que puede llegar a tener una diminuta luz. Si lo compartes por aquí, estaré agradecido. Qué más se podría pedir? 😃

Y tú, ¿qué opinas?