El Problema
Actualmente dependemos de un servicio de mesa de ayuda externa que no logra abordar los puntos críticos y las funcionalidades necesarias que nuestra empresa requiere.
Uno de los principales desafíos radica en la diversa base de usuarios que interactúan con esta mesa de ayuda. Por un lado, tenemos empleados de varios equipos resolviendo una variedad de problemas. Por otro lado, tenemos a nuestros distribuidores, que son vendedores esenciales para nuestro producto, así como a clientes finales, tanto en entornos de negocio a negocio (B2B) como de negocio a consumidor (B2C).
La situación actual está generando insatisfacción entre los clientes debido a la falta de una respuesta rápida a sus quejas e inconvenientes con el sistema. La nueva mesa de ayuda debe abordar esta preocupación y mejorar significativamente la satisfacción del cliente final.
Además, dado que este sistema de mesa de ayuda se utiliza en los problemas del cliente, sobre el punto de venta (este punto de venta es el servicio principal de la empresa y abarca diferentes tipos de comercios con problematicas y "modulos particulares" para c/u segun lo requiera), es esencial garantizar que cada incidente sea dirigido al departamento adecuado, considerando métricas específicas de satisfaccion del cliente, tiempo de resolucion por parte del servicio al cliente, entre otras metricas que necesitamos sean evaluadas con la mesa de ayuda.
Al preparar el handoff, se busco la integración clave de Ant Design. Las secciones del proyecto se organizaron en páginas específicas en Figma, con una nomenclatura consistente para facilitar la identificación. Se mantuvo la limpieza y la organización de capas, siguiendo una estructura de nombres uniforme. Las unidades de espacio se alinearon con Ant Design para una transición fluida al código. La paleta de colores se convirtió en variables CSS utilizando el plugin Color Styleguide, y se integró Ant Design para asegurar la coherencia en la implementación. Los estilos de texto se organizaron lógicamente, evitando jerarquías HTML y enfocándose en roles y tamaños para el diseño responsive. Se utilizaron componentes de Ant Design para mantener la consistencia visual y funcional. Además, se facilitó la comunicación continua con los programadores a través de la conexión Figma-Visual Studio Code, asegurando un proceso colaborativo y ágil desde el diseño hasta el desarrollo web.

Para mejorar aún más la solución de la mesa de ayuda, se emplearon Mapas de la Experiencia del Usuario (User Journey Maps) y Flujos de Tareas (Task Flows) para mapear las interacciones e identificar problemas específicos para cada usuario. Se definieron y priorizaron objetivos, optimizando flujos de trabajo e interfaces de usuario. Se integró Ant Design, una biblioteca de UI para React.js, para proporcionar una experiencia más amigable para el usuario y facilitar el desarrollo tanto para programadores junior como experimentados. Además, se implementó una ruta personalizada de incidentes, considerando métricas y la satisfacción del cliente para asegurar una resolución de problemas más efectiva. Scrum permitió una colaboración efectiva, la implementación iterativa y la mejora continua basada en la retroalimentación de los usuarios y métricas. La entrega final incluyó documentación completa de UI/UX para un fácil mantenimiento y escalabilidad. La solución logró un sistema de mesa de ayuda eficiente y personalizado, atendiendo a las necesidades específicas de cada grupo de usuarios y mejorando la experiencia general del usuario.

