Elementos visuales en el diseño UX
A veces, cuando explico lo que hacemos en SHIFTA y hablo de uno de nuestros programas más longevos, el fabuloso Máster Online en Diseño de Experiencia de Usuario (UX/UI), la gente no habituada al mundo del diseño me dice cosas tipo “eso te prepara para hacer encuestas dentro de un departamento de recursos humanos” o cosas tipo “¿Eso no es lo de los diseñadores que programan?”.
Problemática que no me encuentro con otros masters como Diseño Gráfico o Diseño Editorial. Son más obvios en su nombre, supongo. Pero he venido a comentar una cosa importante: dentro del mismo mundo de diseñadores hay una idea generalizada de que el UX trata solo de arquitectura de la información desde un punto de vista más racional. Pero dentro del mundo de la Experiencia de Usuario también hay moodboards y color.
En definitiva: también hay emoción. La creación de la interfaz requiere de un diseño de elementos visuales siguiendo una guía de estilo que va más allá del diseño de interacción. Y es en este último aspecto en el que nos vamos a centrar hoy gracias a Catherine Quintos y Laurianne López y su trabajo final titulado “Well at home”.
Sin Desing Thinking no hay nada
Antes de nada, contextualicemos el trabajo final de nuestras alumnas. ¿Qué es “Well at home”? Es una aplicación que pretende ser la solución para la gestión de las reparaciones en pisos compartidos. ¿Cómo?
Conectando proveedores, inquilinos y propietarios para facilitar la gestión del proceso de reparación en el contexto de un hogar compartido. En resumen, se trata de repensar la gestión de los arreglos y mantenimientos y ofrecer una solución.
El UX research que realizan en este trabajo es súper exhaustivo y es sin duda un paso previo fundamental para llegar a un buen diseño de interfaz. Sin saber para quién diseñas no puedes diseñar. Pero como hemos dicho en el inicio, nos vamos a centrar en otros aspectos. No sin antes dejaros un link con el prototipo de Figma para que podáis ver los wireframes. ¡Haz clic aquí!
Moodboard, UI y prototipo de alta fidelidad
Haciendo un brainstorming con el fin de sacar primeros conceptos y orientar la búsqueda de información y referentes visuales, esto es lo que aparece:
Icono app
Para el icono, finalmente han seleccionado la primera letra y la mancha de color. La mancha es un territorio indefinido, al estar “moviéndose” representa el hogar compartido, el cambio constante. Por otro lado, el punto representa los pasos a seguir en la línea de tiempo.
Color
En la gama de color encontramos un espíritu joven, multicultural y viajero. Una gama de color ácida. El contraste y la modernidad están asegurados.
Tipografías y escalas
Ilustraciones
A modo de cierre, os dejamos el link del prototipo de Figma de su website para que veas lo bien que ha quedado. Como antes, ¡haz clic aquí!
Si tú también quieres diseñar interfaces no solo funcionales y eficaces, sino también con carácter y personalidad, no te pierdas nuestro Máster en Diseño de Experiencia de Usuario (UX, UI) Online.
Zaraida Gil, responsable de la Comunidad de SHIFTA by Elisava.
