Mi primer caso de estudio UX/UI

Mockup de la aplicación de alquiler de viviendas

Durante 2022 realicé mi primer caso de estudio de UX/UI.
Fue un proyecto para crear una aplicación de alquiler de viviendas.

En 3 meses conseguí:

  • Encontrar insights relevantes para trabajar
  • Definir un MVP
  • Segmentar un público objetivo
  • Crear un UI Kit
  • Realizar pruebas de usuario con un prototipo creado desde cero
  • Obtener resultados para aplicar posteriores iteraciones.

Te dejo el proyecto en Figma para probar el prototipo, y la documentación completa del caso.

mockup
Que lindos que son los mockups

Selección del caso de estudio

Yo estaba buscando donde vivir, en ese momento esto era un tema que se llevaba toda mi atención.
Revisando sitios web de alquileres y redes sociales, encontré un problema común, y que luego confirme con estudios que se habían realizado al respecto.
Según encuestas realizadas en Latinoamérica, el 68% de los inquilinos dijo haber descartado un inmueble de su interés, para evitar prohibiciones vinculadas a sus mascotas en el contrato.

Así surgió “Alquilame”, una aplicación que permite gestionar de manera directa el alquiler de una propiedad.
Aquí las personas que ofrecen sus viviendas, dan su conformidad para admitir personas inquilinas que tengan niños o mascotas.

Investigación

Desktop Research y un Benchmarking de tres aplicaciones del rubro: Argenprop, Zonaprop y Mercado Libre, que tiene una sección de alquileres.

Por ejemplo, en Argenprop encontré algunas virtudes referidas al diseño:

  • La pantalla de contacto simula una pantalla de WhatsApp, lo que la hace amigable al usuario promedio.
  • La pantalla de la propiedad publicada se parece a la distribución que usa Mercado Libre en sus publicaciones, lo que resulta familiar.
  • El botón de consulta y teléfono siempre está visible.

Y algunas posibilidades de mejora como:

  • No eran claros los enlaces para contactar propietarios.
  • En las reseñas se pedía mucho un filtro para saber si la publicación aceptaba mascotas, algo que inmediatamente valido el problema en este caso de estudio.
  • Muchos problemas con la publicación de propiedades (publicar en barrios incorrectos, sin fotos, sin precios) y eso abre la puerta para otro caso de estudio con otro enfoque.

Conociendo a las personas usuarias

Basándonos en la investigación que tome de referencia y al desktop research, presente dos arquetipos, que luego valide con entrevistas con 5 personas usuarias de aplicaciones de alquiler de viviendas.
Luego, mediante un cardsorting abierto les pedimos que ordenen las distintas categorías y eso sirvió para renombrar algunos ítems y me permitió entender la mecánica por la cual la persona consultada puede incluir una tarjeta en una u otra categoría dependiendo como esté nombrada.

Un segundo cardsorting, esta vez cerrado, sirvió para iterar el producto y encontrar la disposición final de la arquitectura.

Presentando el MVP

Con el MVP buscamos definir y organizar las acciones y funciones principales para esta aplicación, lo indispensable para que persona usuaria pueda cumplir su objetivo. En este caso, alquilar una vivienda.

Que la persona que desea alquilar, pueda:

  • Buscar alquiler por lista de disponibles.
  • Usar filtros básicos.
  • Destacar publicaciones.
  • Reservar disponibilidad.
  • Tener un chat para consultas con la persona propietaria.

Preparando el prototipo

Luego de presentar el MVP, y con el cardsorting terminado, se le dio forma a la arquitectura de la información, se creó el user flow, y llego el paso de trabajar formalmente en Figma.

Durante la etapa de entrevistas me ocupé de adelantar unos wireframe en baja, para tener una idea de la disposición de los elementos en la aplicación.
Esto fue tomando como referencia a Argenprop, que fue la aplicación más popular entre las personas entrevistadas. Tenía sentido presentar un producto que le resultara familiar a quienes lo utilizaran.
Esto también ayudo a que los tiempos de diseño sean más cortos, y cuando incorporé patrones, realizar iteraciones fue muy simple.

Los primeros testeos se hicieron en wireframes en media fidelidad y ya con resultados de las pruebas quedaba pasarlo en alta y volver a probar.

evolución de los wireframes de la aplicación de alquileres
Evolución del wireframe de la pantalla de resultados

Testeo y resultados

El escenario hipotético planteado era que la persona que desea alquilar, usando la aplicación, debe encontrar un departamento de dos ambientes en Almagro. Consultar con la persona propietaria, hacer la reserva y confirmar la reserva.

Las tareas a realizar eran las siguientes:

  1. Registrarse
  2. Buscar un departamento
  3. Chatear con la persona propietaria
  4. Hacer la reserva del departamento que quiere alquilar
  5. Confirmar la reserva

Para medir si el testeo tuvo éxito se usó el siguiente criterio:

  • Que la persona pueda concretar las tareas solicitadas.
  • Que se entiendan los textos presentados en la aplicación.
  • Que la persona que usa la aplicación proponga mejoras.
  • Que la encuesta de satisfacción sea favorable.

La aplicación resultó intuitiva y todas las personas pudieron completar las tareas solicitadas.
Las tareas de registro y búsqueda fueron las que llevaron más tiempo, pero también fueron las dos primeras, donde la persona usuaria estaba tratando de entender de qué iba la prueba, o como funcionaba.
Una de ellas indicó que si la prueba hubiese sido desde un celular, le hubiese parecido más fácil.

El buscador fue confuso en algunos casos. Luego de reservar volvió a la página de inicio, eso generó dudas en uno de los casos. Faltaba una pantalla de éxito.
Y había un slide de recomendaciones en la home que prestó confusión y fue removido.

UI KIT
UI KIT

Iteraciones posteriores

Finalmente, el user flow termina con la persona usuaria haciendo la reserva de la vivienda, pero sin concretar el alquiler dentro de la aplicación.
Decidí finalmente realizar un camino inicial, menos ambicioso pero más seguro.
Uno de los diferenciales de la aplicación, en primera instancia, pretendía concretar el alquiler por medio de la app. Siendo que esta funcionalidad requiere subir, validar documentación, y otros aspectos legales, decidí cerrar el camino un paso antes y dejar esta idea para futuras iteraciones.

Conclusiones

Fue mi primer proyecto de UX/UI, así que antes de empezar investigue, busque porfolios de diseñadores, casos de estudios ya terminados y el primer pensamiento fue, yo no sé hacer esto, y claro, por eso estaba aprendiendo.

Ver el cierre de este proyecto es todo un logro para mí.
Pero no lo hice solo, quiero mencionar a Lucas Arredondo y a Nat Ghizzoni que supervisaron este proyecto dándome feedback y apoyo constante.

Podés ver más artículos sobre UX en esta misma web.
¡Gracias por llegar hasta acá!