Looking For Fashion?




Menos pero mejor: Ilustrando a Dieter Rams


Dieter Rams es una de las figuras más importantes del mundo del diseño. Antes de entrar al mundo del UX/UI no sabía quien era, pero cuando lo descubrí me impresionó su manera de pensar y trabajar. Desde el primer momento que conocí sus “10 principios del buen diseño” quise hacerle un pequeño homenaje creando un conjunto de iconos o ilustraciones que reflejaran esos principios. Ahora, gracias al confinamiento que estamos pasando todos en nuestras casas, por fin he podido retarme a mi misma y hacer este pequeño proyecto que llevaba meses rondándome en la cabeza.

Investigación y proceso creativo

Antes de empezar con cada principio, tenía que definir el estilo general que tendrían. Quería que su estilo visual reflejara los principios que defiende Rams, pero también aprovechar mi capacidad dibujística, así que decidí optar por un minimalismo de trazo único, pero jugando con diferentes grosores para evitar que las ilustraciones fueran planas. También quería utilizar un recurso que uso mucho y que define mi estilo personal al dibujar: zonas de dibujo incompletas y el espacio en blanco.

Moodboard de dibujo de linea minimalista (Izquierda) y dibujo anatómico hiperrealista donde juego con los espacios en blanco (Derecha)

Aunque en el dibujo hiperrrealista dejar espacios en blanco ayuda a definir zonas muy marcadas de luz (o si el fondo es negro, de sombra), en este caso juego más con “El principio de cierre” de la Gestalt: mecanismo mental que nos permite interpretar aquello que está incompleto o parcialmente oculto.

  1. El buen diseño es innovador.
Moodboard (derecha) y propuesta (izquierda) para Innovación.

Como bien dijo Dieter Rams, la tecnología y el diseño deben ir de la mano para ofrecer a los usuarios un buen producto, pero ¿qué es ser innovador? No hay una representación figurativa de lo que es la innovación como tal, pero sabemos que viene de las ideas de los “Eureka” de mentes brillantes, por lo que he utilizado una bombilla para representar esas nuevas ideas y parte de la cabeza de una tuerca hexagonal en el filamento de la bombilla para hacer una pequeña alusión a la tecnología.

2. El buen diseño es útil.

Moodboard (derecha) y propuesta (izquierda) para Útil.

Este principio se explica por sí mismo, pero siempre que lo leo no puedo evitar pensar en las artes aplicadas, sobretodo el Art Nouveau y Art Decó (dos de mis corrientes artísticas favoritas), periodos en los que se defendía que el arte también podía ser útil y accesible. Pero, sabía que esto era un sesgo mio como técnico superior de artes aplicadas, así que quería representar una de las herramientas más versátiles y menos representadas gráficamente: la navaja suiza.

3. El buen diseño es estético.

Moodboard (derecha) y propuesta (izquierda) para Estético.

Como decía antes, aunque algo puede ser útil no quiere decir que tampoco pueda ser estético, y esto es algo que Dieter Rams sabía hacer muy bien. Este concepto para mí era de los más fáciles de ilustrar, pero, de nuevo, debía huir de mis sesgos por mi formación artística. Aunque en un principio quería ilustrar a “La Venus de Milo” por su connotación de belleza femenina en la cultura Griega, decidí hacer un pincel, ya que es la representación universal del arte.

4. El buen diseño es comprensible.

Moodboard (derecha) y propuesta (izquierda) para Comprensible.

Comprender algo es entenderlo sin mucha complicación, y como quería evitar reutilizar la bombilla para representar la mente o las ideas, ¿pues que hay mejor que una cabeza? Pero, ¿como explicar visualmente que una persona entendió algo en concreto? Cuando estamos confusos o no entendemos algo, las ideas estan desorganizadas, en una maraña. Pero, cuando alguien empieza a entender algo, estas se van ordenando y se enderezan.

5. El buen diseño es discreto.

Moodboard (derecha) y propuesta (izquierda) para Discreto.

Junto con el de “Su minima expresión”, este principio fue el más difícil de representar. Está claro que hace alusión al minimalismo, al diseño delicado que no busca llamar la atención, pero, ¿cómo representarlo figurativamente? Tras darle muchas vueltas e investigar, decidí recurrir a uno de los diseños más recatados y discretos de Rams: el botón de encendido, para así huir de otro tipo de representaciónes fáciles de confundir como el clásico gesto de “silencio” del dedo sobre la boca.

6. El buen diseño es honesto.

Moodboard (derecha) y propuesta (izquierda) para Honesto.

El buen diseño no es pretencioso ni trata de engañar al usuario, asi que, ¿qué mejor manera de representar la honestidad que “ con la mano en el corazón”? También existe el gesto de poner la mano sobre la biblia a modo de juramento, pero representa la verdad en el sistema judicial y la honestidad tiene un matiz más personal (verdad tangible vs verdad personal).

7. El buen diseño es duradero.

Moodboard (derecha) y propuesta (izquierda) para Innovación.

Como bien dice Dieter Rams, no le afecta el paso del tiempo ni las modas, es infinito. Pero representar solo el símbolo del infinito era demasiado obvio y sencillo, así que lo encapsulé en un diamante, la piedra preciosa más resistente y duradera de todas.

8. El buen diseño es minucioso.

Moodboard (derecha) y propuesta (izquierda) para Minucioso.

Como ex Conservadora y Restauradora este principio significa muchas cosas para mí: la precisión, la atención al detalle, la perfección… Pero, la primera imagen que me viene a la cabeza es la proporción áurea, la perfección artística y estética que tantos han perseguido. Aunque su representación más común es con la Espiral de Fibonnaci, yo quería respetar y aludir a su creador original, el arquitecto y escultor griego Fídias, colocando la phi griega en el centro de esa espiral.

9. El buen diseño es respetuoso con el medio ambiente.

Moodboard (derecha) y propuesta (izquierda) para Eco sostenible.

Ser eco sostenible está a la orden del día. Con la reciente cumbre por el cambio climático que hemos vivido hace meses en Madrid, y con la gran reducción de la contaminación que hay gracias a este confinamiento, es evidente que el usuario exigirá más que nunca la eco sostenibilidad de los productos que consumirá. Y, aunque se puede ser eco sostenible de muchas maneras, y he decidido representarlo de la manera más reconocible y generalizada de todas: un planeta más verde.

10. El buen diseño es lo menos diseño posible (su mínima expresión).

Moodboard (derecha) y propuesta (izquierda) para Su mínima Expresión.

Y finalmente, me encuentro con el gran titan de todos estos conceptos. Al igual que “discreto”, sé que Dieter Rams hacía alusión a un diseño que no fuera recargado, excéntrico o que llamara en exceso la atención, pero , ¿cómo representar “su mínima expresión”? Tuve que recurrir a google para descubrir el esencialismo: doctrina que hace especial incapié en la esencia de las cosas. Inspirada en la portada del libro de Greg McKewon, ¿qué hay más mínimo y simple que un círculo (que además en muchas culturas y periodos históricos se utilizaba el círculo para representar el alma humana, o la esencia humana)?

Testing: Primera ronda

Ahora que tenía definidos mis 10 principios, debía testearlos, ¿y que mejor modo para testearlos que a modo de juego? Quería que los testers no se abrumaran con un cuestionario muy largo, así qué decidí hacer un card sorting “casero”. Gracias al confinamiento y la posibilidad de hacer videollamadas, le compartía al usuario mi pantalla en la que (usando Figma) debían hacerme un matching del principio (con una pequeña descripción acompañando a cada principio) que le correspondía cada ilustración. Esta manera de hacer card sorting aunque me limitó en el número de testers personas a hacer la prueba (unos 10 en total), me daba la ventaja de poder ver en vivo y en directo sus discursos mentales, dándome una gran cantidad de insights.

Pantalla que veían los usuarios durante el test.

Aunque los resultados de algunas de las ilustraciones me las esperaba, como que se confundieran tanto entre sí la de “discreto” con el de “su mínima expresión”, algunos me sorprendieron bastante. Mientras que recibí algún que otro comentario gracioso como: “¡¿Por qué hay una alita de pollo con un saca corchos?!” o “¿Qué le pasa a ese en la cabeza? ¿Tiene una brecha o algo así?”, recibí algunos insights muy importantes:

Número de aciertos en porcentajes en la primera ronda de testeo.
  • Los usuarios que venían del mundo del diseño UX/UI intercambiaron“minucioso” con “estético” no solo por las descripciones, si no por que en las herramientas de diseño y edición el pincel se usa para retoques minuciosos, mientras que la gente con formación artística veía la proporción áurea como el arte más academicista y matemático y al pincel al arte más libre y creativo.
  • Las descripciones que puse con el propósito de ayudar (sobretodo para los conceptos de “mínima expresión” y “discreto”) confundieron a muchos de los usuarios más que ayudarles. Los que más aciertos tuvieron se limitaron a leer la palabra clave.
  • Aunque muchos confundieron “discreto” con “su mínima expresión” , muchos otros lo confundieron con “duradero” porque les recordaba a un temporizador o un reloj. También a uno de los usuarios el duradero le recordó a un antifaz, recordándole a alguien que quiere ocultarse y no ser visto.

Ahora tenía que rediseñar las ilustraciones de algunos conceptos para conseguír mejores resultados, y gracias a mis insights, rediseñé los siguientes conceptos:

5. Discreto.

Rediseño de “discreto” (derecha) con su moodboard (izquierda)

Cuando el tester dijo lo del antifaz de duradero tuve mi momento Eureka. ¿Qué hay más discreto que alguien que trata de ocultarse? Aunque no quise recurrir a la imagen del antifaz, recurrí a otra muy común: un espía con sombrero y gabardina.

8. Minucioso.

Rediseño de “minucioso” (derecha) con su moodboard (izquierda)

Debía evitar a toda costa que se volviera a confundir con “estético”, así que decidí recurrir a herramientas de precisión, como compasebisturís o lupas. Pero, de nuevo, quería evitar un sesgo mío por ser restauradora, asi que decidí (aunque después del segundo testing lo rediseñaría ligeramente) hacer una regla y una escuadra, herramientas de precisión muy conocidas y cotidianas.

Tambíen, le añadí una pequeña muesca a la cuchilla de la navaja suiza, para evitar no solo que se pudiera volver a confundir con una alita de pollo, si no para evitar también en cierta medída que en la segunda ronda de testeo se pudiera asociar la navaja como herramienta de precisión y las reglas como un utensilio.

Testing: segunda ronda

Captura de algunos de los mensajes que recibí sobre el test.

Esta vez no buscaba obtener insights en vivo y en directo, si no quería mayor alcance, asi que cree un card sorting con Optimal Workshop, en el que antes de empezar con el card sorting le hacía un par de preguntas a los usuarios, especialmente la de “ ¿A que te dedicas?” para determinar los posibles sesgos que tienen los diseñadores y los no diseñadores. También puse dos preguntas finales después de hacer el card sorting, preguntandole a los usuarios si les había sido dificil de hacer el test y que conceptos son los que más les han costado determinar. Y, para mi asombro, ha tenido una grandísima difusión, sobretodo entre los usuarios no diseñadores, que no solo les gustó la prueba, si no que pidieron más pruebas, llegando a recibir más resultados de los que podía registrar la versión de prueba de Optimal Workshop (al final solo pude recopilar un total de 20 resultados).

Resultados generales de la segunda ronda de testeo en porcentaje

Pero, ¿hubo mejora en los resultados ahora? Si. Pero, ahora tenía otro problema: Comprensible” bajo al 50% de aciertos ¿Pero por qué? Estos son algunos de los insights que he sacado tras analizar los resultados:

  • Aunque mejoraron los resultados de “minucioso”, como me temía, muchos lo confundieron con la navaja suiza, asi que, aunque no lo he testeado, rediseñé ligeramente la regla añadiendole algunas líneas para definirla mejor.
  • Aunque en “discreto” subió muchísimo el numero de aciertos, “su mínima expresión” seguió teniendo el mísmo número de fallos.
  • Aunque durante el primer testeo no fue algo que me llamó significativamente la atención, los usuarios que más fallaban eran aquellos que, o tardaban menos de 2 minutos en hacer la prueba, o los que tardaban más de 7 minutos ( el tiempo aproximado durante la primera ronda fue de unos 3–5 minutos máximo), con algunos usuarios llegando a tardar casi 10 minutos. Pero, ¿por qué tardaban tanto y fallaban más?
  • Durante el testeo, aunque no pude comprobarlo al 100%, recibí un mensaje que me aclararía mi duda anterior:
“Marta, quiero repetir el test. No he podido contestar lo que quería porque el móvil no me dejaba colocar las imágenes donde quería.”

¿Será que los usuarios que tenían tantos fallos y tardaron más lo hicieron en el móvil y no pudieron responder como quisieron? Aunque no puedo confirmarlo con rotundidad, si he notado que casi todos los usuarios que hicieron el test desde el movil fallaron más que los que lo hicieron desde un pc. También coincidió que los usuarios que hicieron el test en el móvil nunca antes habían hecho una prueba de ese tipo con Optimal Workshop, asi que, ¿podría haber afectado el hacer el card sorting desde el móvil a sus resultados ( y de ahí, parte del descenso en “comprensible”)?

Conclusiones

Aunque es algo largo este case study, se podría estudiar y hablar con mayor profundidad de él. Lo que en principio iba a ser algo sencillo se ha convertido en algo más complejo e interesante. He visto que, aunque yo he conseguido una tasa de aciertos general bastante alta, es tremendamente difícil lograr que todo el mundo entienda lo que quería ilustrar. Me recuerda a los Test de Rorschach: cada uno percibe las manchas (o en este caso, imágenes) que tiene delante de una manera u otra, que suele estar condicionada por la educación, contexto cultural o vivencias personales de esta persona. Y, aunque hay mil maneras de pensar, ¿podría conseguir que la mayoría entienda mejor mis ilustraciones?

Habrá que comprobarlo en el futuro.
Versión final de todas las ilustraciones, hechas en “Concepts” con un Ipad

P.D: Por último, y no menos importante, darle las grácias a todos aquellos que me han ayudado durante todo este proceso. Sin vuestra ayuda y colaboración no hubiera podido descubrir todo lo que he descubierto y asombrarme con este case study.

To read in English, click here: https://bit.ly/2A9YOFY


Menos pero mejor: Ilustrando a Dieter Rams was originally published in UX Planet on Medium, where people are continuing the conversation by highlighting and responding to this story.