Ecommerce · Reestructuración de Home · 2024
Home.
El home perdía a más de la mitad de sus visitantes antes de que hicieran scroll: banners pesados, sin estructura SEO y con poca interacción real. Rediseñamos la experiencia desde la investigación de comportamiento hasta un buscador inteligente con IA, y redujimos el tiempo de carga de 4.4s a 1s mientras las búsquedas sin resultados cayeron a menos del 0.5%.
- Rol
- UX Designer
- Equipo
- Usabilidad y desempeño
- Duración
- 10 semanas
- Alcance
- Web, Design system
2400 × 1350
01. Contexto
El home era la puerta de entrada al sitio, pero funcionaba en contra del negocio: tiempos de carga altos, exceso de información que los usuarios ignoraban, un buscador básico sin capacidad de entender la intención de búsqueda, y una estructura que no cumplía con los estándares de accesibilidad ni de SEO necesarios para competir en resultados orgánicos.
El reto
Reducir el tiempo de carga a los rangos recomendados para web, cumplir con los estándares de accesibilidad WCAG 2.2, mejorar el posicionamiento SEO para escalar en resultados de búsqueda orgánicos, y reemplazar el buscador básico por uno inteligente que redujera las búsquedas sin resultados.
- Un home pesado y desestructurado que ralentizaba la carga y afectaba el SEO.
- Los usuarios necesitaban encontrar lo que buscaban rápido, sin fricción, en un buscador que entendiera lo que escribían.
- El negocio necesitaba reducir las búsquedas sin resultados y aumentar la interacción con el contenido de la primera vista.
02. Proceso
La investigación combinó benchmarking, analítica de comportamiento y pruebas directas sobre el sitio en producción.
Investigación y definición
Analizamos la estructura de los retailers más relevantes del sector: altura de página, tipo de contenido y forma de organizarlo. En paralelo, revisamos los heatmaps de Hotjar para entender qué elementos capturaban realmente la atención — el hallazgo más importante fue que el buscador era el elemento más clickeado del home, muy por encima del resto de la navegación.
Diseño y validación
Ese insight definió la prioridad del proyecto: incorporamos Algolia como motor de búsqueda, con IA capaz de interpretar términos complejos, entregar mejores resultados y reducir las búsquedas sin resultados — además de sugerir los términos y categorías más buscadas. En paralelo, validamos que los banners obtienen más clics cuando el CTA es explícito, y que mostrar cerca del 80% de la oferta del sitio en la primera vista mejora la interacción; con ese dato, reemplazamos el bento de 3 banners por un bloque de 8 categorías (4 columnas × 2 filas) en la segunda posición del home, justo debajo del banner principal.
2000 × 1000
1200 × 900
1200 × 900
03. Solución
El resultado combina un buscador inteligente, un bloque de categorías con alta visibilidad y banners con CTAs claros — una estructura que muestra más del sitio sin sacrificar velocidad de carga.
2000 × 1000
1200 × 900
1200 × 900
04. Impacto
El cambio más contundente ocurrió en el bloque de categorías: pasamos de banners con ~100 clicks al día a categorías individuales con entre 200 y 400 clicks diarios — en varios casos, superando al banner principal. El buscador ahora resuelve mejor la intención de los usuarios, el home cumple con los estándares de accesibilidad WCAG 2.2, y el scroll mejoró un 5% gracias a una página más liviana y con mejor jerarquía de lectura.
Qué aprendimos
El dato más valioso no vino de una entrevista sino del comportamiento real: el buscador, no el banner principal, es donde los usuarios depositan más confianza para encontrar lo que buscan. Diseñar alrededor de esa señal — en lugar de la jerarquía visual tradicional de un home — fue lo que movió las métricas que realmente le importaban al negocio.