CASE STUDY
REFUGIO RAINBOW
Rediseño de app de adopción de mascotas
Ficha técnica del proyecto
-
ROL:UX/UI Designer
-
DURACIÓN:3 meses
-
PLATAFORMA:iOS / Android / Web
-
HERRAMIENTAS:Figma, FigJam
-
PÚBLICO OBJETIVO:Personas que quieren adoptar y protectoras de animales
El Desafío y Objetivos
EL PROBLEMA
Personas que desean adoptar suelen frustrarse por formularios excesivamente largos, tener que repetir sus datos, la falta de actualización del estado de disponibilidad del animal y la incertidumbre de no saber si recibirán respuesta del refugio.
LA SOLUCIÓN & OBJETIVOS
• Diseñar e implementar un flujo de adopción online fácil, claro e intutitivo.
• Permitir adoptar directamente desde la ficha del animal con auto-completado.
• Simplificar formularios agrupando datos en una sola pantalla navegable.
• Garantizar una plataforma responsive adaptada a todo tipo de pantallas (WCAG).
Proceso de Investigación & Descubrimientos (UX)
Realicé entrevistas y un estudio de usabilidad con 5 participantes para comprender las necesidades y frustraciones de las personas interesadas en adoptar. Los hallazgos principales mostraron que la mayoría prioriza conocer el temperamento y las necesidades del animal, necesita sentir que el proceso es serio y responsable, valora poder ayudar aunque no pueda adoptar en ese momento, y busca un proceso simple y guiado paso a paso.
Persona: Javier
- Edad: 34 años · Profesión: Profesor de instituto
- "Quiero adoptar un animal, pero necesito sentir que hago las cosas bien y que el proceso es de confianza."
- Objetivos: adoptar de forma responsable, conocer bien al animal antes de decidir, ayudar al refugio aunque no pueda adoptar todavía.
- Frustraciones: no saber qué pasos seguir para adoptar, falta de información clara sobre cada animal.
Mapa del flujo
Oportunidades detectadas: Simplificar la solicitud · Fichas claras por animal · Facilitar apadrinar y donar · Reforzar la confianza.
Sistema de Diseño, UI y Accesibilidad
El sistema visual se construyó con tonos cálidos y cercanos, con un acento vivo que transmite diversidad y bienvenida, y un conjunto de componentes reutilizables (botones, fichas de animal, formulario por pasos, tarjetas de apadrinamiento) para dar coherencia a toda la plataforma.
Paleta de color
Colores cálidos y cercanos que transmiten confianza, con un acento vivo que representa la diversidad y la bienvenida a cada adoptante.
Tipografía
Se utilizó Nunito como tipografía principal por su carácter amigable y redondeado, que refuerza la cercanía y calidez de la marca, manteniendo una buena legibilidad en pantalla.
Pruebas WCAG
Contraste: colores con suficiente contraste para mejorar la lectura. Tipografía: tamaños de texto más visibles y legibles en todas las pantallas. Interacción: botones táctiles grandes y fáciles de utilizar.
Evolución del Diseño
Wireframe a UI Final
Wireframe
Explorar múltiples versiones de las pantallas como wireframes low-fi en Figma permitió probar soluciones rápidas antes de pasar a diseño digital de alta fidelidad, validando ideas frente a los problemas detectados en la investigación.
Diseño Final
El diseño inicial concentraba toda la solicitud de adopción en una sola pantalla, lo que resultaba abrumador. Tras el test de usabilidad, se dividió en un flujo de 4 pasos con confirmación visual, simplificando la experiencia y aumentando la confianza del usuario.
Decisiones de diseño clave
Formulario dividido en 4 pasos · fichas de animal completas · accesos directos a apadrinar, donar y voluntariado.
Prototipo y Validación
Se desarrolló un prototipo interactivo en Figma que reproduce el flujo completo de solicitud de adopción, validado mediante dos rondas de test de usabilidad con 5 participantes:
Ronda 1
Formulario percibido como largo · faltaba feedback tras enviar la solicitud · poca visibilidad de la opción de apadrinar.
Ronda 2
Mejorar las transiciones entre pasos · añadir confirmación visual de envío · destacar más las vías de colaboración.
Conclusión
APRENDIZAJES & PRÓXIMOS PASOS
El rediseño mejora significativamente la experiencia de adopción y facilita el acceso a distintas formas de ayudar a los refugios: un proceso de solicitud más sencillo y guiado, información clara sobre animales y refugios, y vías de apadrinamiento, donación y voluntariado accesibles.
Diseñar pensando en usuarios reales permitió tomar decisiones más precisas y crear un producto realmente útil: la investigación valida hipótesis, los test de usabilidad descubren problemas ocultos, la accesibilidad debe integrarse desde el inicio, e iterar constantemente mejora el resultado final.
Como próximos pasos, me gustaría validar futuras mejoras con nuevas sesiones de test de usabilidad, ampliar la investigación incorporando nuevos perfiles de usuarios, y seguir optimizando el producto con nuevas funcionalidades de valor.
En la fase 2 se añadirá un panel de seguimiento de envíos en tiempo real mediante una API externa de mapas y notificaciones push. Como siguientes pasos, también ampliaría la investigación de usuarios y realizaría nuevas pruebas de usabilidad para seguir puliendo la experiencia de compra.
