Detalles…

Un diseño funcional, bonito y simple está bien.

Pero un diseño funcional, bonito, simple y fácil de maquetar está mucho mejor.

O como dijo Charles Eames:

Los detalles no son los detalles. Los detalles son el diseño.

Habla con tu equipo de maquetación. Seguro que te enseñan cómo mejorar como diseñador.

La filosofía UNIX y el diseño

Preparando un documento de análisis para un cliente, me he encontrado en mi fondo de armario un enlace a las bases de la filosofía UNIX y no puedo dejar de pensar en lo bien que aplican estas reglas al mundo del diseño de interacción.

Las 17 reglas en versión resumida vienen a decir (perdón por la traducción al vuelo):

  1. Regla de Modularidad: Escribe partes simples, conectadas por interfaces simples.

  2. Regla de Claridad: ser Claro es mejor que ser ingenioso.

  3. Regla de Composición: Diseña programas para que se conecten a otros programas.

  4. Regla de Separación: Separa las reglas del funcionamiento; separa los interfaces de los mecanismos.

  5. Regla de Simplicidad: Diseña para la simplicidad; añade complejidad sólo donde sea estrictamente necesario.

  6. Regla de Parsimonia: Escribe un programa complejo sólo cuando sea evidente que no existe otra solución posible.

  7. Regla de Transparencia: Diseña para la visibilidad, para hacer más fácil la inspección y la corrección de fallos.

  8. Regla de Robustez: la Robustez es hija de la transparencia y la simplicidad.

  9. Regla de Representación: Convierte el conocimiento en datos, para que la lógica de los programas pueda ser estúpida y robusta.

  10. Regla de Mínima Sorpresa: En diseño de interfaces, haz siempre lo menos sorprendente.

  11. Regla de Silencio: Cuando un programa no tenga nada sorprendente que decir, no debería decir nada.

  12. Regla de Reparación: Cuando tengas que mostrar un error, falla estridentemente y lo antes posible.

  13. Regla de Economía: el tiempo del programador es caro; consérvalo sobre el tiempo de la máquina.

  14. Regla de Generación: Evita hacer cosas a mano; escribe programas que escriban programas siempre que puedas.

  15. Regla de Optimización: Prototipa antes de pulir. Haz que funcione antes de optimizarlo.

  16. Regla de Diversidad: Desconfía de todo lo que diga “esta es la única forma correcta”.

  17. Regla de Extensibilidad: Diseña para el futuro, porque estará aquí antes de lo que piensas.

El único cambio que creo necesario para añadirlo a mi arsenal de Fundamentos de Diseño es reescribir la regla 13 como “el tiempo del usuario es caro; consérvalo sobre el tiempo del diseñador” (pensando en la Ley de Tesler).

Aprende a preguntar

En el mundo de la consultoría existe una especie de tabú hacia ciertos términos. Uno de ellos es problema.

Un consultor te hablará de “oportunidad”, “desafío” o “reto”, pero nunca te dirá “tienes un problema”.

En el mundo del diseño, donde nos gusta llamar a las cosas por su nombre, nos dedicamos a resolver problemas, y para ello una de las habilidades imprescindibles en nuestro arsenal es saber preguntar.

Un método para encontrar problemas

Definición: Cuando en este post digo “saber preguntar”, me refiero a “una colección de técnicas que nos permiten obtener toda la información necesaria para localizar y empezar a resolver un problema de comunicación de forma eficaz”.

Reflexionando sobre mi forma de preguntar, estas son algunas claves que he encontrado, sin ningún orden aparente:

  • Saber preguntar implica identificar el contexto del problema.

    “Contexto” puede ser algo tan obvio como “presupuesto”, o algo tan sutil como la agenda oculta del jefe de nuestro cliente. Yo diría que la gran mayoría de los “imprevistos” en el desarrollo de un proyecto provienen de un contexto poco investigado.

  • Aunque parezca una obviedad: tu misión es averigüar cuál es el problema en realidad.

    No lo que el cliente dice que es el problema.

    No lo que el cliente piensa que es el problema (a veces un cliente no dice todo lo que piensa. Por eso preguntamos :).

    No lo que el cliente está haciendo o quiere hacer para solucionar su problema.

    El problema.

  • Si no sabes qué quiere conseguir tu cliente, no sabrás si has solucionado su problema.

    Para esto vienen muy bien metodologías como el “Effect Management” de inUse, o algo tan simple como un checklist de objetivos.

  • Preguntas clásicas

    • ¿por qué?

      Te servirá para descubrir la motivación de tu cliente. La idea es preguntar por qué ad-infinitum, con la sana intención de encontrar “el momento ¡ahá!”, esto es, el momento en que el cliente decide pasar de la idea a la acción, el momento “detonante” de la decisión de actuar, el origen del proyecto

      Sólo si eres capaz de ponerte en el papel de tu cliente en el momento de tomar la decisión de contratar a un diseñador, serás capaz de resolver su problema real.

      A mi me gusta llamarlo “ver el big bang en directo” :)

    • ¿para qué?

      O “qué se supone que tiene que conseguir esta jugada”. Ya sea “más usuarios registrados”, “registro en 5 minutos” o “mejorar la imagen de la marca”.

    • ¿quién lo pidió?

      Esto es algo que casi nunca preguntamos, pero es vital. No es lo mismo resolver los problemas de tu cliente que los del jefe de tu cliente.

    • ¿qué quieres conseguir?

      Que no es lo mismo que “para qué”. Aquí es donde intentamos detectar si nuestro cliente tiene algún tipo de “agenda oculta” o motivación personal no documentable, por ejemplo “quedar bien con dirección”, “justificar la existencia del departamento”, o “llamar la atención en medios de comunicación”. Por muy marciano que suene, este es el tipo de información que puede convertir un potencial infierno en un proyecto redondo.

Como cierre de este tostón, un apunte breve: obtener información preguntando es tu obligación como (buen) diseñador.

Y así de repente, creo que es todo lo que se me ocurre sobre obtener información. Algún día veremos qué hacer con ella :)

Los 10 mandamientos de Dieter Rams

Via Daring Fireball me encuentro un enlace con Los diez mandamientos del diseño de Dieter Rams (para quien no lo conozca, uno de los mayores/mejores diseñadores industriales y de producto que ha conocido el mundo)

Vienen a ser estos:

  1. El buen diseño es innovador
  2. El buen diseño hace útil a un producto
  3. El buen diseño es estético
  4. El buen diseño ayuda a entender un producto
  5. El buen diseño no molesta
  6. El buen diseño es honesto
  7. El buen diseño es duradero
  8. El buen diseño es minucioso hasta el último detalle
  9. El buen diseño se preocupa por el medio ambiente
  10. El buen diseño es tan poco diseño como sea posible

Con el primer punto no estoy de acuerdo en absoluto (y me consta que no soy el único), pero creo que cumplir (o al menos observar) los otros nueve debería ser un requisito imprescindible de todo el que lleve la palabra “diseñador” en su tarjeta de visita.

Fundamentos de diseño: Economía de Recursos

Siguiendo con la serie de fundamentos de diseño, el de hoy (que tiene mucho que ver con el anterior) dice así:

Cuando utilices un recurso, usa la mínima cantidad necesaria para que siga expresando tu intención.

Donde “mínima cantidad necesaria” significa “usa los recursos como si te cobraran por ellos”.

Recuerda también que no todos los recursos “cuestan” lo mismo. Personalmente, yo los ordeno como espacio < color < espacio + color < forma < forma + color.

Es decir, que si quiero expresar que dos elementos son distintos primero intentaré separarlos sólo con espacio. Si no es suficiente intentaré diferenciarlos sólo con color. Si aún así no es suficiente, recurriré a espacio + color. Si necesito más expresividad, usaré la clásica línea de separación. Y si aún así no queda claro, el último recurso es la forma + color (por ejemplo: meterlo en una cajita naranja :)

Un corolario de esta norma es esta cita de Antoine de Saint-Exupery:

La perfección se consigue, no cuando no hay más que añadir, sino cuando no hay nada más que quitar.

¡Hasta la próxima!

Fundamentos de diseño: Expresa claramente tu intención

Cuando estés diseñando algo, expresa claramente tu intención.

Cuando tu intención sea alinear elementos, usa guías y retículas. Ajusta al milímetro, al pixel.

Cuando no alinees, separa tus elementos lo suficiente como para dejar clara tu intención.

fd_alineacion

Un corolario de este fundamento es el siguiente:

Si un elemento de tu diseño no tiene intención, plantéate si lo necesitas

Y tú: ¿qué fundamentos de diseño quieres compartir? Añádelo a los comentarios (o publícalo en tu blog :)

Fundamentos de diseño: La Regla de 0-1-n

Preparando mis notas para unas clases que daré próximamente, me doy cuenta de que tengo un mini artículo pendiente de publicar sobre el “diseño para la incertidumbre”: la Regla de 0-1-n.

Es un teorema/principio/hipótesis/regla empírica, que tiene sus raíces en el mundo de la programación. Mi fuente de inspiración fue el Wiki de C2 (una joya de la información, por cierto)

La regla, en su versión diseñosa, viene a decir:

Cualquier elemento de diseño puede existir cero, una, o infinitas veces.

Destripemos la frase un poco:

Cualquier elemento de diseño se refiere a “cualquiera”. Iconos, botoncillos, cajas de texto, elementos de menú…

puede existir cero quiere decir que no existe. Punto pelota. “El site no tiene menú a la izquierda”. “No hay buscador”. “Un post nunca llevará una imagen”

una quiere decir 1, la unidad, sólo uno de ese tipo. “El logo estará arriba a la izquierda”. “La caja de búsqueda estará arriba la derecha”.

o infinitas veces pasando del 1, el resto de los números no significan nada. Si el blog tendrá más de 1 post en portada, debería poder tener 5, ó 20, ó 500.

Un porcentaje muy importante de los problemas de diseño* que me encuentro tienen su raíz en no observar esta regla. No importa que hayas definido que tu portada de periódico tendrá 2 destacados. Mañana sucederán 5 cosas tan importantes que tendrán que destacarlas en portada.

* “diseño” se usa aquí en su acepción más amplia, incluyendo arquitectura de información y HCI.

Mi consejo es bastante simple: el único número al que deberías cogerle cariño es el 1. Los demás no existen. Invierte tu tiempo diseñando sistemas flexibles que admitan crecimiento ilimitado, no en cuadrar pixels para que quepan las 3 promos en el ancho de la columna ;)