Mamá, Papá, UX es más o menos esto

Santiago Balparda
Acámica
Published in
8 min readMay 17, 2020

Mi proyecto final de la carrera de UX/UI de Acámica explicado para padres

Foto de antes de pensar en qué quería ser de grande.

Un tiempo después de esa foto (tal vez algunos años) empecé a definir que mi futuro profesional sería jugando al fútbol, me resultaba la manera ideal de ganarme la vida, claro que no era un improvisado de 9 años, por supuesto que había un plan B, seguir el mandato familiar y vivir trabajando de médico.

El plan A fracasó a los 17 años aproximadamente y como ese cauto niño de 9 años había proyectado, a los 18 años se ejecutó el plan B. Lo que no había tenido en cuenta es que el plan B también podía fracasar. Después de terminar el primer año de medicina en Rosario dejé la carrera no sin antes haber desarrollado mi plan C: Diseño Gráfico.

La realidad es que el verdadero plan C era Publicidad en Buenos Aires pero no estaba preparado para provocarles tanto disgusto a mis viejos -tal vez tampoco estaba preparado yo para tanto cambio-, así que Diseño Gráfico en Rosario era una alternativa más que aceptable. Lo que tampoco tuve en cuenta es que el plan C podía necesitar un respaldo -sobre todo considerando que no era lo que realmente quería hacer-. Luego de terminar los 2 primeros años de los 4 de la carrera, decidí volver al plan C original, que ahora se convertía en plan D.

Plan A, B, C, D…

Afortunadamente este sí se llevó a cabo con éxito y para tranquilidad de mis padres -y mía- llevo hoy más de 10 años en Buenos Aires siendo redactor publicitario. Pero como suele suceder, nuestras motivaciones y gustos van cambiando y hoy el plan E viene a por todo. El plan E es ser redactor UX, meterme en el mundo UX, y como pasó con todos mis planes, explicarles a mis viejos de qué se trata este nuevo plan forma parte del proceso.

Si bien el diseño UX no es solo aplicaciones, paginas webs, herramientas digitales, etc. sino que aplica a todo lo que tenga que ver con una persona (usuario) interactuando con un producto o servicio y cómo mejorar esa experiencia, la realidad es que hoy con la digitalización del mundo, cuando hablamos de UX solemos referirnos a aplicaciones, paginas webs, herramientas digitales, etc.

Por eso, esta publicación sobre “¿Qué es UX?”, está orientada a explicar cómo es el proceso para diseñar una herramienta digital.

Proyecto Acámica

¿Cuál era el pedido?

Desarrollar una plataforma (pagina web, app, etc.) para personas que estén buscando un lugar para vivir en Capital Federal.

Contexto

Necesitaba primero entender las motivaciones y perfiles de quiénes buscan vivir en Capital (alineándome al contexto del país).

Así llegué a mi target (a quién le voy a hablar) y por ende al corazón de mi plataforma: Estudiantes del interior del país que vienen a vivir a Capital.

¿Sabían que 20% de los estudiantes de Capital Federal provienen del interior del país? Esto representa más o menos 60.000 estudiantes que buscan un lugar para vivir en la Ciudad, lo que parece ser un buen mercado.

Naming (nombre)

Una vez conseguido el insight (descubrimiento de que no existía una plataforma orientada 100% a nuestro público), pasé a buscar un nombre acorde para la plataforma, que indicara el objetivo de la misma o al menos lo sugiriese y obviamente que sea original:

Nombre y concepto de la marca.

Benchmark (evaluar a la competencia)

Lo que seguía era ver qué plataformas/herramientas existen hoy para satisfacer esa necesidad, cuáles son sus puntos fuertes y cuáles sus debilidades.

Plataformas utilizadas para el benchmark.
Cuadro comparativo de las plataformas elegidas para el benchmark.

La conclusión fue que si bien existen diferentes plataformas que ofrecen soluciones, ninguna de ellas está enfocada exclusivamente en estudiantes del interior del país y por lo tanto no ofrecen un diferencial para este segmento.

User Personas (los futuros usuarios)

Una vez definida la plataforma que queremos hacer y para quién, lo que se hace es crear una suerte de imagen general de quienes van a usar la plataforma, sus gustos, a qué se dedican, cómo pasan su tiempo, qué piensan, qué dicen, qué hacen, qué sienten, etc. Esto nos va a permitir crear un usuario arquetípico a los que tenemos que describir como si fuesen individuos de verdad. Estas Personas son a las que vamos a recurrir constantemente para corroborar nuestras decisiones, y así asegurarnos de estar trabajando en una plataforma lo más acorde a ellas posible, evitando sesgos personales.

User Personas de tucuarto.

Enfoque

Después de definir los User Personas, la dirección hacia dónde trabajar mi diferencial estaba más clara, tucuarto no solo debía ser un lugar en donde encontrar una habitación, debía ofrecer un espacio para que los nuevos estudiantes pudieran investigar la ciudad y donde los que ya hubieran vivido esa experiencia la pudieran compartir.

Básicamente un lugar en donde los estudiantes del interior pudiesen encontrarse y compartir más que un cuarto y así crear comunidad.

Basándome en este análisis la propuesta de valor de la plataforma estaría en la manera en la que le permitiría a los usuarios relacionarse entre sí.

Sitemap (mapa del sitio)

Se trata de diseñar todas las pantallas que creemos que va a necesitar nuestro sitio, representado en un diagrama así 👇

Sitemap de tucuarto.

User flow (diagrama de flujo del usuario)

Una vez que tenemos el sitemap, empezamos a diseñar cómo nos imaginamos que va a navegar nuestra Persona por la plataforma, las pantallas que va a recorrer y las acciones que va a realizar en cada una de ellas, tanto para la búsqueda como para ofrecer habitación. Para esto se arman unos diagramas de flujo con cada recorrido.

User flows de tucuarto.

Wireframes (no todo es traducible o simplificable 😬)

En esta instancia pasamos a algo un poco más visual (aunque lejos del resultado final). A partir de los User Flows se hacen primero diseños en papel para testear y validar features (herramientas), componentes y estructuras generales. Estos wireframes ayudan mucho a definir las jerarquías y sobre todo sirven para avanzar de una manera más dinámica para después sí pasar a lo digital con información más concreta.

Diseños en papel.

Con toda la información obtenida a partir de los layouts (diseños) en papel, se pasa a lo que llamamos wireframes digitales low-fi y hi-fi (de baja y alta fidelidad) para definir las interacciones más finas. Estos permiten hacer pruebas en una estructura que los usuarios sienten más familiar y sus devoluciones empiezan a ser más precisas en cuanto a la usabilidad (qué tan fácil es usar la plataforma).

Wireframes Lo-Fi.

Diseño UI (Interfaz del Usuario)

Esto es básicamente lo que el usuario va a ver de nuestra plataforma, lo “lindo”. Para esto primero se arma lo que se llama un moodboard, que es una especie de compilado de referencias y cosas que nos gustaría que tenga nuestra plataforma desde el diseño: colores, tipografías, estilos de fotografías, ilustraciones, animaciones, etc.

Para armar mi moodboard, lo que hice en primera instancia fue buscar los sitios con los que se hizo el benchmark, para tomar ciertos lineamientos y a la vez decidir cuáles dejar de lado. También tomé referencias que tenían que ver con el mundo digital en el que el User Persona se mueve, sobre todo en este momento de inicio de sus estudios o continuación de los mismos.

Y finalmente, con la intención de generar un diferencial y no centrarme solo en las páginas de búsqueda de habitaciones, departamentos, etc., esta segunda búsqueda tuvo que ver con los sitios de universidades, analizando las paletas de colores, sus imágenes, las tipografías, etc.

Moodboard de tucuarto.

Prototipo Website y Prototipo Mobile

Acá llegando al “final” (técnicamente nunca se termina porque siempre se sigue trabajando para mejorar la plataforma) lo que se hace es plasmar en los wireframes nuestro moodboard, poner lindos esos cuadrados grises que vimos antes.

Originalmente todos estos pasos se hacían primero pensando en Website y después se adaptaban a Mobile, pero ya en estos últimos años por una cuestión lógica (cada vez más usuarios en el celular) se empezó a diseñar primero en Mobile para después llevar a Website.

Y aunque el diseño no sea lo mío (soy redactor) así de lindo me quedó 👇😉

Test con usuarios

Con estos prototipos hi-fi (los wireframes con diseño) lo que se hace es ponerlos a prueba con usuarios e intentar aprender de esta interacción lo más que podamos.

Recordemos que todo este proceso de UX, es previo a la programación de la herramienta, la plataforma real en funcionamiento viene después del desarrollo que es algo posterior al diseño UX (idealmente se trabajan en conjunto con los programadores y demás departamentos).

Como decía anteriormente, si bien durante todo el proceso se pone a prueba la plataforma en sus distintas etapas con diferentes usuarios, con los prototipos hi-fi las entrevistas con usuarios son muy cercanas a lo que los mismos van a experimentar con la plataforma real. Por eso, para aprovecharlos al máximo, es fundamental tener bien preparado un guión, tener en claro qué queremos probar, cuáles son los puntos de dolor y sobre todo estar abiertos a realizar cambios y estar atentos no solo a lo que va haciendo el usuario sino también a lo que va sintiendo en cada instancia.

Básicamente se trata de seguir iterando (probar, corregir, volver a probar) intentando llegar en cada nueva prueba a la mejor versión de la plataforma.

Fotos realizadas durante los test con usuarios.

Conclusiones (del proyecto)

Poner a prueba el producto y lo que uno piensa sobre el mismo es lo más importante de todo. Hacer el ejercicio constante de desafiar lo que uno asume, con la mirada de un tercero. Esto es lo que va a diferenciar a un producto amigable para el usuario de uno que solo entenderemos nosotros.

Conclusiones (de esta publicación)

Hacer el ejercicio de intentar explicarle a alguien qué es UX (o cualquier carrera a la que uno se dedica) es una buena manera de repasar conceptos básicos que nos han enseñado y, por qué no, cuestionarlos, no para desecharlos sino más bien para reivindicarlos y afianzarlos.

Seguramente haya acá definiciones de conceptos que no estén 100% acertadas pero la intención era lograr acercar a aquellos que tuviesen un conocimiento casi nulo de la actividad, en este caso mis padres.

--

--