SOCIAL
Viaboby
Una app que utiliza inteligencia artificial para encontrar perros perdidos en Perú.
Cliente
Viaboby
Propietario de proyecto
Paulonia
Team
2 diseñadores
Duración
6 semanas
Rol
UX
UI
Testing
Design QA
Framer developer
Figma
Framer
Useberry
Jira
Photoshop
Loom
Slack
Metodologías
Atomic Design
Design Sprint
Test de usabilidad
Dispositivos
Mobile
Contexto
En Perú, según la Caolición por los Animales (COLPA), unas 420,000 mascotas entre perros y gatos se pierden cada año.
¿Qué métodos utilizan las personas para buscar a sus perros perdidos y a qué desafíos se enfrentan?
Pergar carteles en vía pública
Desafíos: Inversión de tiempo y dinero, la visibilidad limitada, y el riesgo de que sufran desgaste o sean retirados prematuramente.
Anuncios en medios de comunicación
Desafíos: Puede ser costoso y su tiempo de exposición es limitado.
Anuncios por redes sociales
Desafíos: La dispersión de una publicación entre otras puede resultar en que llegue tarde a las personas clave que podrían proporcionar información relevante acerca del paradero de la mascota.
Problema común identificado
Conmétodos tradicionales, la información sobre el paradero de una mascota perdida llega a través de mensajes o llamadas, lo cual puede no ser instantáneo y tiende a volverse obsoleta rápidamente.
Simulación de la información recibida tras una publicación de búsqueda de mascota perdida, donde se presenta ambigüedad y variación en los horarios de los reportes.
Visión del producto
La visión del producto era integrar un algoritmo de inteligencia artificial basado en reconocimiento de imágenes en la solución, por lo que la aplicación debía satisfacer tanto las necesidades de los usuarios como las del algoritmo.
¿Cómo funciona el algoritmo?
Entrada
Recibe una foto
Se asegura que se trate de un perro
Para esta etapa del proyecto, el algortimo se centra únicamente en perros.
Extrae colores
Los elementos que no aporten al algoritmo (calles, hierba, autos etc) se ignoran y se centra en colores relevantes por ejemplo : color de pelaje.
Extrae textura
Asi agrupa perros con pelaje ondulado o lacio, corto o largo.
Compara
Con todas las características extraídas, compara a los perros y agrupa a los mas similares.
Salida
Listado de fotos con los perros más similares.
Etapa UX
Con el algoritmo en mente, analicé apps similares mediante benchmarking para evaluar sus pros y contras, y recopilar opiniones del público objetivo para integrarlas en nuestra aplicación.
Revisé grupos de Facebook, la principal fuente de tráfico para buscar mascotas perdidas en Perú, y encontré casos donde, tras no encontrar al dueño, las personas daban en adopción a las mascotas.
Hasta este punto, los módulos mapeados para la app fueron 5:
Feed principal
Búsquedas
Avistamientos
Adopciones
Perfil
Etapa UI
Dado que la aplicación pertenece al rubro de mascotas, un ámbito que es "divertido" y "amigable", decidí usar colores distintivos para las secciones principales. Esta elección ayuda a contextualizar y diferenciar cada sección, mejorando la experiencia del usuario.
Tipografía
Tanohe Sans
Paleta de colores
UI kit
Diseñé un UI kit compacto, ya que los componentes y sus variantes se reutilizan en todos los módulos.
Buttons
Texts fields
Input photo
Cards
App bar
Onboarding
Una vez instalada, la aplicación presenta a los usuarios una introducción a las funciones principales.
Onboarding Viaboby
Pantalla principal
Pantalla principal viaboby, subir publicaciones y filtro por ubicación
Avistamientos
Los usuarios pueden ver la información completa de un avistamiento,existen las opciones "Es mi bobby" para reclamar a su mascota o "Lo vi" para dar información adicional.
Los usuarios que publicaron un avistamiento podrán ver otros avistamientos relacionados, tanto los reportados a través de "Lo vi" como los detectados por el algoritmo de reconocimiento.
Interfaces del módulo de Avistamientos
Búsquedas
En las búsquedas, los usuarios podrán ver en sus publicaciones todos los reportes de "Lo vi" realizados por otros usuarios y los detectados por el algoritmo de reconocimiento.
Interfaces del módulo de Búsquedas
Adopciones
En las adopciones, los usuarios podrán ver las solicitudes y toda la información enviada por otros usuarios interesados en adoptar. Para garantizar la integridad del perro, se requiere que los solicitantes completen un formulario.
Interfaces del módulo de Adopciones
Perfil de usuario
El usuario podrá ver toda su información en la app, incluidas sus publicaciones, notificaciones o solicitudes de adopción recibidas.
Interfaces del módulo de Adopciones
Prueba con usuarios
Recursos
Prototipo, guión, tareas, escenarios
Tipo de pruebas
Sesiones guiadas.
Métricas
Eficiencia, eficacia, cuestionario de satisfacción.
Hallazgos y Soluciones
Primer hallazgo
Durante las pruebas, los usuarios completaron todas las tareas con éxito y entendieron el algoritmo de reconocimiento. Sin embargo, notamos que el acceso a la interfaz con publicaciones de usuarios y del algoritmo tomaba tiempo adicional, y el término "Lo vi" generaba confusión, ya que cumplía la misma función que un avistamiento pero con un nombre diferente.
Solución
Rediseñamos la interfaz para mostrar directamente las publicaciones similares detectadas por el algoritmo de reconocimiento. Como el algoritmo utiliza las publicaciones proporcionadas por los usuarios, era más eficiente integrarlas en una sola vista.
En Avistamientos y Búsquedas, rediseñamos los card de ubicación y fecha para que el texto largo no cause desbordamientos y se ajuste verticalmente en dispositivos pequeños.
Antes y después de la interfaz principal de Avistamientos
Aplicamos la misma lógica de Avistamientos en Búsquedas, mostrando los perros más similares en primer plano, ya sea que provengan de Avistamientos o de Adopciones.
Antes y después de la interfaz principal de Búsquedas
En Adopciones, estandarizamos la interfaz como en Avistamientos y Búsquedas. Aquí, el algoritmo de reconocimiento muestra perros similares para dar visibilidad a otros perros en adopción, ayudando a los usuarios a encontrar perros con características específicas.
Antes y después de la interfaz principal de Adopciones
Como actividad adicional, diseñé y desarrollé la landing page de la app en Framer. Esta página detalla todas las funcionalidades, incluye llamados a la acción para la descarga, expone comentarios de usuarios y presenta una sección de preguntas frecuentes.
