Los 10 principios del Diseño Centrado en la Vida

Decálogo para reglas o principios, y trilogías para los libros. ¿Es broma?
En 10 Principles of Life Centered Design, Johnathyn Owens publica los diez principios de lo que denomina Diseño Centrado en la Vida (Life Centered Design). Imposible no recordar Ten principles for good design de Dieter Rams.

Diseño y ecología versus diseño y consumismo. Creo que no hay un tema más actual ni más importante.

Algo había leído en Diseño para el mundo real de Victor Papanek y también en Ruined by Design: How Designers Destroyed the World, and What We Can Do to Fix It de Mike Monteiro.

Bueno, y ahora, una traducción casera de los 10 principios del Diseño Centrado en la Vida:

  1. El diseño centrado en la vida está diseñado teniendo en cuenta la visión completa.
  2. El diseño centrado en la vida es sobre el futuro, tanto como sobre el ahora.
  3. El diseño centrado en la vida es para todos, no solo para aquellos que pueden “permitírselo”.
  4. El objetivo final del diseño centrado en la vida es la necesidad, no el costo.
  5. El diseño centrado en la vida está diseñado para durar, no para fallar.
  6. El diseño centrado en la vida es minucioso hasta el último detalle.
  7. El diseño centrado en la vida es simbiótico con la naturaleza.
  8. El diseño centrado en la vida es inteligente.
  9. El diseño centrado en la vida es humano.
  10. El diseño centrado en la vida es lo menos posible.

Más detalle, en el ya mencionado artículo original: 10 Principles of Life Centered Design.

Modelos mentales y sesgos congitivos

Por diferentes caminos he llegado a los siguientes enlaces:

  • Wikipedia: Sesgos cognitivos, un artículo amplio y con un listado amplio.
  • 125 modelos mentales para decidir mejor, publicado por Joan Tubau en joincardinal. Artículo que menciona esquemáticamente y de forma un tanto informal, una serie de modelos mentales. César Astudillo mencionaba en twitter que sería una buena idea sacar unas cartas con los principios. Estoy de acuerdo, y no descarto hacerlo en privado, aunque sea en papel de 80 gramos y con ilustraciones ajenas (eso sí, las enfundaría).
  • Mental models for designers, publicado por Wes O’Haire en dropbox.design, más que los principios, destaco el proceso.

El botón de los 300 millones de dólares. Diseñar un botón como ejercicio

El botón de los 300 millones de dólares

¿Conocéis la vieja historia del botón de los 300 millones de dólares que contó Jared M. Spool en el 2009 (The $300 Million Button)? Es interesante. Cómo al cambiar, entre otras cosas, el texto de un botón, mejoró en 300 millones de dólares las ventas anuales en una web de comercio electrónico.

¿Qué ocurrió? ¿cómo pudo afectar tanto a las ventas el cambio de un botón?
Contexto: en una web de comercio electrónico, al comenzar el proceso de compra tras tener el carro con la compra deseada, aparecía un formulario en el que se pedía el usuario, la contraseña, y la posibilidad de entrar en la página web (para confirmar la dirección de entrega y el medio de pago) o la de darse de alta. Ah, y también el enlace de olvido de contraseña.

Es decir, algo como:

Campo de usuario, contraseña, botón de acceso y vínculos de olvidé mi contraseña y darme de alta.
Recreación libre del formulario del carro de la compra.

¿Qué problemas podían haber (recordemos, año 2009)? De todo tipo:

  • Usuarios que no quieren registrarse en la web (sólo querían comprar).
  • Usuarios dados de alta que dudan cuál es la dirección de correo electrónico que tienen como usuario.
  • Usuarios que se habían dado de alta con varias direcciones de correo electrónicas diferentes.
  • Usuarios que no recuerdan la contraseña.

La consecuencia: en esa página se producía un cuello de botella que impedía finalizar la compra.

La solución: tras realizar pruebas con usuarios, pasa por cambiar el literal de un botón (de «darse de alta» a «continuar»), e incluir un texto indicando que se puede comprar sin darse de alta.

El resultado: 15 millones más de ventas en un mes, y 300 millones en un año (de ahí el sugerente título del artículo para los que se excitan con dólares).

Diseñando un botón: un elemento fundamental

Siempre me ha intrigado el proceso que está detrás de la toma de decisiones en un diseño. El porqué.

Porque se supone que detrás de una decisión de diseño (particularizando en una página web: fuente, tamaño, color, posición, rejilla,…) debería haber motivos que fundamentan esa decisión. ¿Cómo ejercitar esa habilidad o conocimiento?

What if, instead of trying to design an entire page with dozens of elements (nav, text, input controls, a logo, etc.), we consciously started by designing the simplest thing possible? We deliberately limit the playing field to one, tiny thing and see what we learn? Let’s try.

What is the simplest possible element? I vote that it’s a button.

The King vs. Pawn Game of UI Design — Erik D. Kennedy

Enumeremos algunas características de un simple botón:

  • tamaño
  • texto
  • fuente
  • tamaño y efecto de la fuente
  • color de fondo (¿gradiente de colores?)
  • color del texto
  • acompañar o no de un icono
  • padding (separación del texto y el borde)
  • margen (separación entre el botón y el resto de los elementos)
  • forma (esquinas cuadradas, redondeadas, radio de la redondez)
  • tipo de acción que realiza (continuar un proceso, acción «peligrosa», acción neutra, acción principal, acción secundaria,…)

Podemos delegar varias características al estilo por defecto que tenga el navegador (en el caso de una página web), o a algún framework con posibles síntomas de vigorexia.

O podemos diseñar un simple botón. Con el objetivo de cumplir los requisitos del proyecto (real o ficticio). Intentando argumentar cada característica. Me parece un ejercicio muy saludable.

¿Qué falla en un diseño? El test de Can’t Unsee

Hace casi diez años (sí diez años), publiqué por el blog diseño, creatividad y dos test en el que hacía referencia a dos test de Andy Rutledge de los que se podía aprender mucho: en un test aparecía la solución, en otro había que investigar más… . Al final, una de las conclusiones es que la lectura de Universal Principles of Design, Revised and Updated era muy recomendable para conocer las respuestas al test y mucho más.

Con diferencia, Universal Principles of Design es el libro con el que más he aprendido.

Hoy recomiendo dar un vistazo a Can’t Unsee. Un test en el que vemos dos versiones sutilmente diferentes en el que hay que elegir aquella opción de que está mejor diseñada. ¿La diferencia? En ocasiones es muy sutil: es cuestión de detalles. Y ya sabemos…

Los detalles no son detalles, son lo que define el diseño.

Charles Eames