Archive for ‘Design’ Category
En The Pipeline to your corporate soul, uno de los artículos que más hondo me caló el pasado año, Alan Cooper hablaba de las similitudes entre el lenguaje corporal y el software, y de cómo muchas compañías contratan a profesionales del diseño de interfaces sólo para realizar cambios estéticos cuando en realidad necesitan cambios más profundos.
Software has become like body language in the way it reveals your inner personality to a patient observer. Your body language always tells the truth, even when you are trying to hide an ugly secret, and it will give you away every time. You simply can’t create likable software if you are a dysfunctional company.
Cuanto más tiempo me dedico a esto, más profundamente creo que los cambios se tienen que introducir primero a nivel de organización, para que estos afloren a la superficie, es decir a la interfaz.
Incluso si eres capaz de entregar un trabajo de diseño y definición de experiencia de usuario excelente, de nada sirve interpretado en manos de una empresa con trabajadores desmotivados o consejos de administración multitudinarios; será raro que la implementación final se asemeje algo proyecto entregado. Por eso cada vez creo menos en el concepto de acuerdo por entregables, y más nuestra integración dentro del equipo del proyecto.
De otra forma nos convertimos en osteópatas de las interfaces, nuestro día a día transcurre corrigiendo los vicios posturales de la empresa, pero si está no adquiere buenos hábitos, estos suelen volver a aparecer pasado un tiempo.
Chrome es un navegador lleno de sutilezas de diseño, algunas son tan diminutas y efímeras que cuesta incluso ser consciente de ellas. Una de ellas es el cambio de color en el icono de notificación de actualizaciones.
Si sois de los reiniciais el ordenador y los programas muy de tanto en tanto, una vez cada 2 o 3 semanas, quizá os habréis dado cuenta del sutil cambio de color en este icono: durante los primeros días (quizá 5 o 7, no estoy seguro), el icono aparece en color verde, pasado este tiempo, el icono hace un sutil cambio de color a marrón, como si fuera la hoja de un árbol caduco en otoño.
Una forma muy poco intrusiva y elegante de llamar la atención sobre la necesidad de reiniciar el navegador, y a la vez, porqué no, una bonita metáfora visual: Tiempo de podar las ramas o dejar que caigan las hojas.
A menudo nos obsesionamos con resolver un problema de forma racional, siguiendo una metodología y perdiendo un poco la visión periférica sobre lo que ocurre alrededor. A veces se producen encuentros inesperados, producidos por accidentes o de forma casual, que nos pueden inspirar a encontrar nuevas soluciones.
Un glitch es un error breve en un sistema. A menudo se utiliza para describir un fallo transitorio que se resuelve solo de forma espontánea, y por lo tanto difícil de detectar y solucionar. El término es particularmente común en la informática y la electrónica, y muy popular entre los jugadores de videojuegos, aunque se puede aplicar a todo tipo de sistemas, incluyendo organizaciones humanas y la naturaleza.
En entornos de entretenimiento, el glitch aporta a veces más riqueza al producto, rompe las reglas establecidas y lo hace más divertido.
Por poner ejemplos, en diseño visual y motion graphics, las cortinillas del canal de televisión 3XL me tienen totalmente enganchado desde hace muchos meses. Explotan visualmente los típicos errores de pérdida de conexión de video online.
No sólo en términos estéticos se pueden buscar nuevas direcciones, quien sabe si los creadores del videojuego Portal, encontraron la inspiración después de experimentar un glitch que permitía al personaje atravesar los muros en otro videojuego.
Al igual que es muy humano reírse del mal ajeno, sacar partido de los errores de un sistema puede ser, en parte, un camino para humanizar dicho sistema.
Uno de los aspectos que más se ha criticado en Twitter del reciente rediseño de Gmail y en general de las aplicaciones de Google, es aspecto de los botones, aparte de eliminar las etiquetas y basarse completamente en iconos, su aspecto es completamente plano.
En general el nuevo look & feel tiene un aspecto excesivamente plano y monocromo, con poco contraste y sin apenas pistas visuales que indiquen qué elementos son clicables y cuales no.
Uno de los argumentos principales para el nuevo rediseño es la limpieza y la modernidad. Sí bien es cierto que es mucho más limpio, no obstante es excesivamente diáfano y con falta de focos claros, y el cepillo de la modernidad se ha llevado por delante la affordance de muchos elementos.
Por definición la affordance es la cualidad de un objeto que nos da pistas de cómo se utiliza, en el caso de los botones es su aspecto pulsable, es decir los pequeños matices en el diseño que indican que el botón sobresale de la superficie y que se puede hundir.
No hace falta realizar grandes cambios para dar estas pistas, tan sólo realizando pequeños cambios en el diseño podemos conseguir este efecto.
Tomemos como base el diseño actual:
Sí, es sencillo y elegante, pero ¿qué problemas tiene? Por su aspecto podría ser tanto un botón como una caja de texto. Para hacer más explicita su función, elevemos un poco el diseño para que sobresalga virtualmente de la superficie de la interfaz:
Ahora parece un poco más pulsable, pero podemos hacerlo más evidente añadiendo algunos matices:
Ahora el botón no es tan plano, hay una pequeña elevación en la zona central que nos invita a pulsarlo. Aún así se puede realzar más:
Sin perder del todo la coherencia en colores y el estilo general, mediante cuatro pequeños cambios en el diseño, hemos conseguido que el botón tenga más aspecto de botón. De la misma forma podríamos mejorar el contraste entre mensajes leídos o no leídos y la diferenciación entre grupos de mensajes del nuevo diseño.
En este pequeño ejercicio es posible que hayamos perdido modernidad por el camino, pero si tenemos en cuenta el uso intensivo que hacemos cada día de estas aplicaciones, aspectos como la ergonomía, la accesibilidad y la psicología de la percepción son muy importantes, y al fin y al cabo las modas son siempre pasajeras.