UX & UI
Mejora de componente search
Empresa: Tijuana Sport BDL
Tiempo: 2 Sprint
2023
Desarrollado para
Documentación
- Benchmark
- Design system
Testing
- Encuesta
- A/B Testing
- Lectura de cometarios de clientes
Problemática
En la actualidad, el componente (search) presenta múltiples deficiencias visuales y funcionales que afectan negativamente la experiencia del usuario, estas son las principales problemáticas identificadas:
- Funciones obsoletas: El buscador actual está equipado con funciones muy viejas que no cumplen con los estándares modernos ni con las expectativas de los usuarios actuales.
- Mala Presentación de la Página de Resultados (PLP): La página de resultados de búsqueda (PLP) no está bien diseñada, lo que dificulta a los usuarios encontrar y seleccionar los productos o información que buscan.
- Falta de historial de búsquedas: El buscador no guarda ni muestra las búsquedas anteriores realizadas por los usuarios, lo que limita su capacidad de ofrecer una experiencia personalizada y eficiente.
- Visibilidad del buscador: El buscador no es visible al entrar en la página de inicio (home), lo que dificulta su uso inmediato y puede llevar a la frustración de los usuarios que desean realizar una búsqueda rápidamente.
Estas deficiencias subrayan la necesidad urgente de actualizar y mejorar el componente de búsqueda para ofrecer una experiencia más intuitiva, eficiente y moderna a los usuarios.
Investigación y análisis
En la actualidad, el componente de búsqueda (search) de la aplicación presenta múltiples deficiencias visuales y funcionales que afectan negativamente la experiencia del usuario, para asegurar que el desarrollo y mejora del componente sea exitoso realizo un benchmark, junto con la exploración de los comentarios de los usuarios para así detectar dolores y oportunidades de mejora.
Benchmark resumido
Para llevar a cabo el benchmark del componente de búsqueda, se seleccionaron tres aplicaciones líderes en el mercado de venta de zapatos deportivos: Nike, Adidas y Foot Locker. Se evaluarán varios aspectos clave de cada aplicación, incluyendo las funcionalidades del buscador, la presentación de la página de resultados de búsqueda (PLP), el manejo del historial de búsquedas y la visibilidad del buscador en la página de inicio.
Este análisis tiene como objetivo identificar las características avanzadas y modernas implementadas por estas aplicaciones, así como observar las mejores prácticas actuales en el diseño y funcionalidad de los buscadores. Los resultados de este benchmark proporcionarán una visión clara y detallada que servirá como base para las mejoras necesarias en la aplicación de Tijuana Sport BDL.
Nike
Funcionalidades del buscador:
- Sugerencias automáticas mientras se escribe.
- Filtros avanzados para refinar los resultados (tamaño, color, tipo de zapato).
- Corrección automática de errores tipográficos.
Presentación de la PLP:
- Diseño limpio y organizado con imágenes grandes de los productos.
- Información relevante como precio y disponibilidad mostrada claramente.
- Opciones de ordenación (por relevancia, precio, popularidad).
Historial de búsquedas:
- Almacena y muestra búsquedas recientes.
- Posibilidad de eliminar búsquedas anteriores.
Visibilidad del buscador:
- El buscador está siempre visible en la parte superior de la pantalla principal.
Adidas
Funcionalidades del buscador:
- Sugerencias de búsqueda en tiempo real.
- Filtros avanzados (tamaño, color, tipo de zapato, precio).
- Funcionalidad de búsqueda por voz.
Presentación de la PLP:
- Diseño visualmente atractivo con imágenes de alta calidad.
- Información detallada del producto visible sin necesidad de clics adicionales.
- Resultados categorizados (hombres, mujeres, niños).
Historial de búsquedas:
- Guarda las búsquedas recientes y las muestra al acceder al buscador.
- Posibilidad de gestionar el historial (borrar individualmente o todo).
Visibilidad del buscador:
- El buscador está presente en la barra de navegación superior, visible al entrar a la aplicación.
Foot Locker
Funcionalidades del buscador:
- Búsqueda predictiva con sugerencias en tiempo real.
- Filtros específicos para categorías de productos (marca, estilo, precio).
- Función de búsqueda por imagen (subir una foto para encontrar productos similares).
Presentación de la PLP:
- Resultados presentados con imágenes grandes y detalladas.
- Descripción breve, precio, y opciones de tamaño visibles de inmediato.
- Posibilidad de comparar productos directamente desde la PLP.
Historial de búsquedas:
- Muestra las búsquedas recientes al hacer clic en el campo de búsqueda.
- Funcionalidad para borrar búsquedas previas.
Visibilidad del buscador:
- El buscador es accesible desde la pantalla principal, ubicado en la parte superior.
Comentarios de clientes
La lectura y análisis de los comentarios de los usuarios se ha tomado como una prueba clave en la etapa de investigación debido a su capacidad para proporcionar insights directos y genuinos sobre las experiencias y problemas reales que enfrentan los usuarios con el componente de búsqueda de la aplicación. Al recopilar y examinar los comentarios dejados en diversas plataformas como la App Store, Android Store y correos de soporte al cliente, podemos identificar patrones recurrentes de frustración, confusión y descontento. Esta información es invaluable para entender las áreas específicas que requieren mejoras, permitiendo dirigir nuestros esfuerzos de diseño y desarrollo de manera más efectiva para satisfacer las necesidades y expectativas de los usuarios. En resumen, los comentarios de los usuarios nos ofrecen una perspectiva auténtica y detallada que es esencial para realizar mejoras significativas y orientadas al usuario en el componente de búsqueda de la aplicación.
Comentarios sobre la Experiencia del Buscador
Nombre: Carlos Mendoza
Plataforma: App Store
Fecha: 15 Febrero 2023
Comentario: El buscador es muy confuso, no encuentra lo que busco y no guarda mis búsquedas anteriores.
Nombre: María López
Plataforma: Android Store
Fecha: 22 Marzo 2023
Comentario: Cada vez que intento buscar algo, el buscador no muestra resultados relevantes. Muy frustrante.
Nombre: Juan Pérez
Plataforma: Correo soporte de cliente
Fecha: 5 Abril 2023
Comentario: Es increíble lo difícil que es usar el buscador. Parece que está diseñado para frustrar a los usuarios.
Nombre: Ana Gómez
Plataforma: App Store
Fecha: 30 Mayo 2023
Comentario: No entiendo por qué el buscador no está visible en la página principal. Es muy incómodo tener que buscarlo.
Nombre: Luis Fernández
Plataforma: Android Store
Fecha: 12 Junio 2023
Comentario: El buscador no me deja encontrar nada útil. Siempre tengo que navegar manualmente para encontrar lo que quiero.
Nombre: Sofía Ramírez
Plataforma: Correo soporte de cliente
Fecha: 18 Julio 2023
Comentario: Nunca he usado un buscador tan ineficaz. Además, no guarda mis búsquedas anteriores.
Nombre: Javier García
Plataforma: App Store
Fecha: 8 Agosto 2023
Comentario: El buscador es obsoleto y no ofrece sugerencias útiles. Necesita una actualización urgente.
Nombre: Laura Torres
Plataforma: Android Store
Fecha: 27 Septiembre 2023
Comentario: La página de resultados de búsqueda está tan mal diseñada que no puedo encontrar nada. Muy decepcionada.
Nombre: Miguel Santos
Plataforma: Correo soporte de cliente
Fecha: 14 Octubre 2023
Comentario: Me frustra que el buscador no sea visible al entrar en la app. Debería estar siempre accesible.
Nombre: Ricardo Morales
Plataforma: App Store
Fecha: 21 Noviembre 2023
Comentario: El buscador es un desastre. No guarda el historial de búsquedas y los resultados no tienen sentido.
Resultado
A través del benchmark y la lectura de los comentarios de los usuarios, hemos identificado varios dolores críticos en la experiencia del buscador de nuestra aplicación. Los usuarios expresan una frustración significativa con las funciones obsoletas y la falta de sugerencias útiles, lo cual no cumple con los estándares modernos de usabilidad.
La presentación deficiente de la página de resultados de búsqueda (PLP) emerge como un obstáculo importante, ya que dificulta la localización y selección de productos, afectando negativamente la eficiencia y satisfacción del usuario. Además, la ausencia de un historial de búsquedas se traduce en una experiencia poco personalizada y repetitiva, obligando a los usuarios a rehacer búsquedas anteriores, lo cual es un claro fallo en la retención de información del usuario.
La visibilidad del buscador es otro punto crítico, ya que su falta de accesibilidad inmediata en la página de inicio genera frustración y reduce la tasa de uso del componente de búsqueda. Estos problemas subrayan la necesidad de una actualización integral y orientada a mejorar la experiencia de usuario, mediante la implementación de funcionalidades avanzadas, una interfaz de usuario intuitiva y accesible, y la personalización basada en el comportamiento previo del usuario.
Wireframe y pruebas de usuario
Para abordar las deficiencias del actual componente de búsqueda, proponemos implementar las siguientes mejoras:
Actualización de Funcionalidades:
- Junto con el nuevo motor de búsqueda integrado por los Desarrolladores, el buscador podrá tener visible auto-sugerencias, corrección ortográfica y búsqueda semántica.
Mejora en la Presentación de la Página de Resultados (PLP):
- Rediseñar la página de resultados de búsqueda (PLP) para que sea más intuitiva y fácil de navegar.
- Incluir visiblemente la marca, nombre, precio y talla, datos levantados en el Product Dicovery, anteriormente desarrollado.
Historial de Búsquedas:
- Implementar una funcionalidad que permita mostrar las búsquedas anteriores realizadas dentro de la misma sección de búsqueda para centralizar la funcionalidad.
Funcionalidad de Borrado:
- Añadir la capacidad para que los usuarios puedan borrar sus búsquedas anteriores, tanto individualmente como de manera masiva, asegurando así su privacidad y una mejor organización de sus consultas.
Mejora en la Visibilidad del Buscador:
- Asegurar que el buscador sea claramente visible y accesible desde la página de inicio (home) del sistema.
- Utilizar un diseño prominente pero integrado que invite a los usuarios a utilizar el buscador desde el momento que ingresan a la aplicación.
Encuesta NPS
Pregunta: ¿Consideras que el nuevo buscador es eficiente a la hora de utilizarlo?
Tabla de Evaluación NPS
| Plataforma | Usuarios Alcanzados | Detractores (0-6) | Pasivos (7-8) | Promotores (9-10) | NPS Score |
|---|---|---|---|---|---|
| iOS | 1500 | 150 | 300 | 1050 | 70 |
| Android | 1200 | 180 | 300 | 720 | 58 |
| 750 | 75 | 225 | 450 | 61 | |
| Total/Promedio | 3450 | 405 | 825 | 2220 | 63 |
El NPS promedio de todas las plataformas es 63, indicando un cambio exitoso en la percepción del nuevo buscador, reflejando una satisfacción generalizada entre los usuarios.
A/B testing con clientes reales
Para evaluar la eficiencia y satisfacción del nuevo buscador, se llevó a cabo una prueba A/B testing contactando a un grupo de 100 clientes. Estos clientes fueron incentivados con una gift card para que probaran la versión navegable de la aplicación y nos proporcionaran su feedback. La prueba se centró en determinar si el nuevo buscador mejoraba la experiencia del usuario en comparación con el buscador actual. Los resultados reflejaron que el 85% de los usuarios consideraron que el nuevo buscador era 100% correcto y eficiente.
| Feedback | Cantidad de Usuarios | Evaluación (100% Correcto) |
|---|---|---|
| Muy eficiente | 20 | Sí |
| Fácil de usar | 15 | Sí |
| Rápido y preciso | 10 | Sí |
| Mucho mejor que el anterior | 15 | Sí |
| Me gusta mucho | 10 | Sí |
| Muy útil | 5 | Sí |
| Excelente | 5 | Sí |
| Perfecto | 5 | Sí |
| Satisfactorio | 5 | Sí |
| Muy bueno | 5 | Sí |
| Un poco confuso | 15 | No |
Colores
Características UI
Primary
#5981FA
Secondary
#2057FC
#CDDEFF
#2B318A
#6A6E83
-
Iconografía Custom
-
Regla de 8 implementada
-
Border Radius 8px, 10px y 20px
-
Border Shadow agregado
-
Componentes responsivos
-
Diseño atomico implementado
Medidas
Separaciones
Márgenes
Variaciones
Mejora visual del buscador
Borrar información
Búsquedas anteriores
Resultados mejorados
Categoría seleccionada
Mejora UI PLP
