UX Research: Footer

Rol: UX Research, Diseñador UX/UI.
Fecha: 2024

En Telefónica se me solicitó realizar una investigación sobre el funcionamiento del Footer de Movistar B2C. El footer original presentaba baja encontrabilidad y no reflejaba el modelo mental de los usuarios. Además, por requerimientos legales era necesario añadir cerca de 15 enlaces que debían ser visibles y fácilmente accesibles. El desafío técnico y de diseño consistía en mejorar la encontrabilidad de los enlaces e integrar ese volumen sin crear un bloque confuso que desaliente la exploración o que aumente la carga cognitiva del usuario.

Investigación y hallazgos principales:

Se realizaron una serie de pruebas e investigaciones, entre ellas realicé un benchmark de competidores directos e indirectos, junto a un análisis heurístico del Footer.

Junto al equipo de research realizamos un cardsorting de alrededor de 25 items principales con 52 participantes reclutados con campañas de correo, realicé pruebas de usabilidad asincrónicas en maze con 5 tareas por participante, realicé un análisis cuantitativo gracias a documentos clave entregados por el equipos de analítica y se realizó una prueba A/B junto con el equipo de CRO.

Principales insights de la investigación:

‘Los usuarios recorren el final de la página intencionalmente para encontrar información que su modelo mental estipula como correcto.’

‘El modelo mental del usuario busca: Información de contacto, detalles de la empresa, Redes Sociales, navegación, contenido relacionado.’

‘Los Footers que utilizan una clara jerarquía de sus elementos son más fáciles de utilizar. Cuando los Footers no tienen una clara jerarquía y organización de los elementos los usuarios tienden a revisar minuciosamente los contenidos u omitirlos completamente.’

‘Los Footers ayudan a que nuestros usuarios se mantengan más tiempo en el sitio, dando información y contenido adicional al visitado, el usuario puede ser dirigido a otras secciones del sitio o ver contenido relacionado.’

Estos hallazgos confirmaron que la prioridad debía centrarse en una jerarquía clara, enlaces de acceso rápido y una separación visual entre bloques de contenido.

Para la solución, tomando como base lo entregado por las pruebas de card sorting e investigación benchmark/heurística, se creó una categoría de tareas frecuentes, se agrupó la navegación en 6 categorías principales con títulos claros, se reservaron bloques para enlaces corporativos y secciones legales. Todo esto con tratamientos visuales que se adecuan a la marca y favorecen la legibilidad de los elementos cumpliendo con estándares AA de WCAG, la implementación de focos visibles y la navegación por teclado.

Durante el proceso se evaluaron y descartaron alternativas como enlaces a App o otros servicios del ecosistema, categorías adicionales, elementos de feedback y elementos interactivos como newsletters o propuestas de valor. Se diseñaron wireframes, hi-fi y prototipos interactivos en Figma. Las pruebas en Maze validaron el orden de los grupos y la efectividad de los quick-links; El prototipo final se entregó al equipo de desarrollo y se desplegó en entorno productivo, con monitoreo continuo.

La implementación respetó pautas de accesibilidad: contraste, foco visible, navegación por teclado y etiquetas ARIA en elementos interactivos. La entrega al equipo de desarrollo incluyó especificaciones (tokens de color, espaciado y guidelines de foco) y el componente se integró en el front-end del sitio.

Resultados y observaciones:

Se noto una mejora en la interacción que tienen los usuarios con el footer, CTR a enlaces del footer aumentó un 300% en 90 días, se redujo la tasa de rebote en un 2% en todo el sitio, aumentó la visita a enlaces de ayuda clave entre un 7 a 16% según enlace.

La claridad en la jerarquía y la priorización de tareas demostraron ser la palanca más efectiva para mejorar encontrabilidad y CTR dentro de este Footer, la correcta investigación de este elemento creo resultados tangibles que mejoran la experiencia de los usuarios. Agradecimientos a Natalia Carrasco del equipo Research por su ayuda y consejos en la realización de esta solución.