Seguros Monterrey Clientes
Pitch de agencia
Realizar una propuesta de pitch de agencia para concursar para el rediseño web del portal comercial de clientes de Seguros Monterrey México y que la agencia digital Socialand (ahora BESO by LLYC) presentó y ganó sobre otras agencias competidoras al mostrar una metodología de diseño centrado en el usuario.
Fecha: Del 7 al 19 de julio de 2017.
Cliente: Agencia Socialand para Seguros Monterrey México
Servicios:
- Benchmark
- Evaluación heurística
- Cardsorting
- Entrevistas de usuario
- Analítica web
- Focus Group
- Arquitectura de información
- Wireframing
- Mockups y diseño visual
- Prototipado
- Test A/B
- Validación Eye traking
Objetivo
Ganar la competencia de pitch comercial entre diversas agencias premium en México para re diseñar y desarrollar el portal de clientes para Seguros Monterrey México.
Mi rol
Liderar el equipo de diseño UX y diseñar una estrategia de diseño centrado en el usuario para generar una propuesta a la medida con las necesidades del cliente para competir y ganar el pitch para seleccionar a la agencia que re diseñe y desarrolle el portal de clientes.
Responsabilidades
Crear la estrategia de diseño centrado en el usuario, definir los objetivos, métodos de diseño UX y asignar y supervisar tareas y responsabilidades a los miembros del equipo. Elaborar la presentación ejecutiva y presentar ante cliente.
- Definir la estrategia de investigación.
- Definir cómo acceder a la plataforma desde el portal comercial.
- Definir la arquitectura de información del portal de clientes.
- Diseñar los flujos de usuario.
- Definir y diseñar la interfaz de usuario.
- Crear los prototipos.
- Evaluar las propuestas con usuarios.
Contexto
El cliente tiene diversos portales además del sitio comercial. En particular es el portal de acceso a clientes el que desean re diseñar pues detectan muchas oportunidades en usabilidad y experiencia de usuario. Convoca a un concurso entre agencias para elegir la más adecuada a sus necesidades de negocio y con mejor propuesta.
El cliente tiene un proyecto previo con un diseño preliminar y un prototipo interactivo de una propuesta realizada por un equipo de diseño, pero no está convencido de desarrollar la propuesta y quiere analizar el diseño actual y la propuesta preliminar para crear un re diseño que cumpla con estándares de usabilidad y brinde una buena experiencia de usuario.
Propuesta anterior no aprobada
Entendiendo el contexto
Como experto investigador de usuario, el proceso de realización de un benchmark implica los siguientes pasos:
- Identificar los competidores y referentes relevantes del mercado.
- Definir los criterios de evaluación para comparar los sitios web o aplicaciones de los competidores.
- Recopilar y analizar datos de los competidores en función de los criterios de evaluación definidos.
- Identificar fortalezas y debilidades de los competidores.
- Sintetizar los hallazgos y presentarlos de manera clara y visual a los stakeholders.
- Obtener feedback de los stakeholders y realizar iteraciones si es necesario.
Este proceso permite obtener información valiosa sobre cómo se está desempeñando la competencia en el mercado y qué se puede aprender de sus fortalezas y debilidades. Estos hallazgos pueden ser utilizados para guiar la toma de decisiones en el diseño y desarrollo de un producto o servicio.
Benchmarks realizados:
- Benchmark de rendimiento en pares y competidores.
- Benchmark de arquitectura de información.
- Benchmark de contenidos.
- Análisis de datos públicos de Google Analytics.
Benchmarking de competidores
Menú de navegación principal y acceso a la plataforma
Identificar el tipo y forma de botón, llamada a la acción, paleta de colores y estilo para acceder a la plataforma de clientes como referencia.
Analítica web
Anaítica de la audiencia de los competidores
Identificar la media de datos demográficos para entender las audiencias usando herramientas de acceso a datos públicos de Google Analytics y Facebook Analytics de los competidores y de Seguros Monterrey.
Analizar heurísticas de usabilidad
Perspectiva de expertos: Heurísticas de Nielsen
Analizar las heurísticas de usabilidad de los competidores y del diseño preliminar del portal de clientes para identificar oportunidades en la plataforma propia y oportunidades aprovechables de los competidores para sumar a la propuesta de valor.
Como diseñador UX encargado del proyecto Portal de clientes de Seguros Monterrey, realicé una evaluación de heurísticas de usabilidad de Nielsen de la siguiente manera:
Selección de Heurísticas: Comencé por identificar las diez heurísticas de usabilidad de Nielsen como marco de referencia para la evaluación, asegurando una cobertura completa de los aspectos clave de la experiencia del usuario.
Revisión del Portal y de competidores: Navegué a través del portal de clientes y de los competidores, examinando cada interfaz y función en detalle, con el objetivo de identificar cualquier desviación de las heurísticas seleccionadas.
Documentación de Hallazgos: Registré meticulosamente las incidencias y áreas de mejora, documentando ejemplos específicos donde la usabilidad del portal no estaba en línea con las prácticas recomendadas.
Priorización de Problemas: Clasifiqué los problemas identificados según su gravedad, impacto en la experiencia del usuario y facilidad de implementación de las soluciones.
Recomendaciones de Mejora: Desarrollé un conjunto de recomendaciones detalladas, cada una vinculada a una heurística específica, para guiar las mejoras en la usabilidad del portal.
Plan de Acción: Trabajé con el equipo de diseño para establecer un plan de acción que abordara los problemas de usabilidad, asegurando que las recomendaciones se implementaran efectivamente.
Esta evaluación heurística fue esencial para optimizar la usabilidad del Portal de clientes, mejorando significativamente la experiencia del usuario y la eficiencia general del portal.
Definir arquitectura de información
Técnica de card sorting
Obtener feedback de los usuarios de los elementos y contenidos más relevantes para ellos, para los stakeholders, el negocio y el mercado.
Mi proceso para definr la arquitectura de información
Como arquitecto de información en el contexto de UX Design, el proceso para definir la arquitectura de información de un sitio web implica los siguientes pasos:
- Identificar los objetivos y necesidades del usuario y del negocio.
- Realizar una investigación sobre los usuarios y sus necesidades, para entender cómo se relacionan con la información del sitio web.
- Definir los principales temas y categorías de contenido que se abordarán en el sitio web.
- Desarrollar una estructura de navegación para el sitio web, identificando las secciones principales y subsecciones, y determinando cómo se relacionan entre sí.
- Crear un mapa del sitio web que visualice la estructura de navegación y cómo se relacionan las páginas entre sí.
- Definir las etiquetas y la nomenclatura utilizada en el sitio web, asegurándose de que sean claras y consistentes.
- Realizar pruebas de usuario para validar la estructura de navegación y la nomenclatura, y hacer ajustes según sea necesario.
Este proceso permite crear una arquitectura de información sólida que asegure que los usuarios puedan encontrar y comprender la información de manera efectiva y eficiente, mejorando la experiencia del usuario y cumpliendo con los objetivos del negocio.
Los resultados del cardsorting nos arrojan una navegación muy sencilla con sólo 5 secciones que son las más relevantes para los usuarios, los interesados y como ventaja sobre los competidores:
Customer Journey Map
Analizar el viaje del usuario de las tarea principales
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Como diseñador UX para el proyecto «Portal de clientes de Seguros Monterrey», la metodología aplicada se resumen así:
- Contexto y Objetivos: Se identificaron los objetivos del negocio y las necesidades de los usuarios finales para asegurar que el portal cumpliera con las expectativas de ambas partes.
- Investigación de Usuarios: Se efectuó una investigación de usuarios para captar una visión detallada de sus expectativas, comportamientos y los problemas que enfrentaban.
- Mapeo de Touchpoints: Se mapearon los puntos de contacto y canales de interacción, analizando cómo los usuarios interactuaban con el portal a lo largo de su experiencia.
- Esbozo del Customer Journey: Se delineó el viaje del cliente, ilustrando las fases críticas de interacción con el portal, desde la consideración inicial hasta el manejo de sus pólizas.
- Momentos de la Verdad: Se identificaron los momentos más impactantes para los usuarios, tales como la facilidad para encontrar información y el proceso para realizar reclamaciones.
- Desarrollo de Estrategias de Mejora: Basándose en el análisis realizado, se desarrollaron estrategias para optimizar la experiencia del usuario, como simplificar procesos y mejorar la información proporcionada.
- Implementación y Monitoreo: Se llevó a cabo la implementación de mejoras y se establecieron métricas para evaluar su impacto en la experiencia del usuario, con ajustes continuos según fuera necesario.
Este proceso garantizó una experiencia de usuario en el portal que no solo fue intuitiva y satisfactoria, sino que también se alineó estratégicamente con los objetivos comerciales de Seguros Monterrey.
Proto Personas
Hipótesis de las audiencias principales
Este enfoque de proto-personas permitió avanzar rápidamente en las fases iniciales de diseño y proporcionó un punto de referencia claro para la toma de decisiones de diseño en el desarrollo del «Portal de clientes de Seguros Monterrey».
Como diseñador UX especializado en la metodología Lean UX, la técnica de creación de proto-personas para el proyecto «Portal de clientes de Seguros Monterrey» se desglosa de la siguiente manera:
Compilación de Datos Iniciales: Reuní información básica a través de investigaciones rápidas, datos de mercado y análisis de comportamiento en la web existente, obteniendo así un entendimiento preliminar de los usuarios.
Taller de Brainstorming: Organice una sesión de brainstorming con el equipo de proyecto, incluyendo a miembros de diferentes departamentos como marketing, ventas y servicio al cliente, para aportar diversas perspectivas sobre los usuarios.
Esbozo de Proto-personas: Con la información recopilada, esbocé varias proto-personas, que representaban arquetipos básicos de nuestros usuarios, destacando sus características demográficas, comportamientos, necesidades y objetivos.
Refinamiento y Priorización: Refiné las proto-personas en función de los comentarios recibidos, priorizando aquellas que se alineaban más estrechamente con los objetivos del negocio y las necesidades identificadas durante la investigación.
Aplicación en el Diseño: Utilicé las proto-personas como guía durante el proceso de diseño, ayudando al equipo a mantenerse enfocado en las necesidades y experiencias de los usuarios representativos al tomar decisiones de diseño.
Iteración Continua: A medida que avanzaba el proyecto y surgía nueva información, actualicé y ajusté las proto-personas, asegurando que el diseño siguiera siendo relevante y centrado en el usuario.
Entrevistas con usuarios
Obtener datos cualitativos
Crea una ilustración vectorial 2d simple que contenga un diseñador ux, con barba, sin lentes, dirigiendo a un grupo de diseñadores, latinos, dentro de una oficina moderna y minimalista de una agencia digital realizando un ejercicio de UX llamado «Personas» utilizando fichas de personas en hojas y organizándolas en una mesa
Diseñé y conduje entrevistas con usuarios siguiendo el modelo de 5 personas de Nielsen, y el proceso se desarrolló de la siguiente forma:
Selección de Participantes: Seleccioné cinco usuarios representativos del público objetivo del portal, asegurando que reflejaran diferentes perfiles y niveles de experiencia con servicios de seguros en línea.
Diseño de la Entrevista: Diseñé un guion de entrevistas centrado en entender cómo los usuarios interactuaban con el portal actual y cuáles eran sus necesidades y frustraciones.
Conducción de Entrevistas: Realicé sesiones individuales de entrevistas, donde cada participante compartió su experiencia, perspectiva y sugerencias para mejorar el portal.
Análisis de Datos: Tras las entrevistas, analicé las respuestas para identificar tendencias comunes, puntos de dolor y áreas de oportunidad que podrían informar el rediseño del portal.
Síntesis y Reporte: Consolidé los hallazgos en un informe detallado, destacando insights clave y recomendaciones basadas en las respuestas de los usuarios.
Presentación de resultados Presenté los resultados en la presentación del Pitch del proyecto, proporcionando evidencia concreta para apoyar decisiones de diseño y estrategias de mejora en el portal.
Aplicación de Aprendizajes: Finalmente, aplicamos los aprendizajes de las entrevistas al diseño del portal, asegurando que las actualizaciones reflejaran las necesidades reales de los usuarios.
Propuesta de valor
Canvas de Propuesta de Valor y matriz de esfuerzo
Definí claramente las propuestas de valor que nuestro portal ofrecía, destacando cómo nuestros servicios aliviaban los dolores de los clientes y generaban ganancias significativas en su experiencia.
Propuesta de diseño
Wireframing
Este enfoque de wireframing en baja resolución permitió establecer una dirección clara para el diseño de interacciones del «Portal de clientes de Seguros Monterrey», facilitando la comunicación del concepto y acelerando el proceso de diseño.
Como diseñador de interacciones UI en el proyecto, la creación de wireframes en baja resolución se realizó de la siguiente manera:
Definición de Requisitos: Comencé por compilar y definir los requisitos funcionales del portal, trabajando estrechamente con el equipo de UX para entender las necesidades de los usuarios y del negocio. Con el contexto de los resultados de los ejercicios anteriores.
Esquema de la Interfaz de Usuario: Creé esquemas básicos para la interfaz de usuario, delineando la disposición general de elementos como encabezados, pies de página, menús y áreas de contenido principal.
Selección de Herramientas: Seleccioné herramientas de wireframing adecuadas para esbozar rápidamente las ideas, como lápiz y papel o software digital básico, que me permitiera iterar con facilidad.
Diseño de Wireframes: Diseñé wireframes en baja resolución para las páginas clave del portal, enfocándome en la disposición y la jerarquía de la información sin detalles de diseño como colores o tipografías.
Revisión y Colaboración: Revisé los wireframes con el equipo de UX asegurando que cada wireframe cumpliera con los requisitos y objetivos del proyecto.
Iteración y Refinamiento: Iteré los wireframes, refinándolos basándome en la retroalimentación recibida para mejorar la claridad y la usabilidad del diseño.
Documentación y Entrega: Documenté los wireframes finales y preparé una presentación para el equipo de diseño visual, proporcionando una base sólida para los prototipos de alta fidelidad y el desarrollo posterior.
Diseño Visual
Mockups
Este proceso fue crucial para crear una experiencia visual coherente y atractiva en el «Portal de clientes de Seguros Monterrey», y ayudó a garantizar una transición fluida desde el concepto de diseño hasta el producto final en vivo.
Posición del botón de acceso al portal
En equipo, definimos la solución de diseño, respetando la identidad de marca y colores oficiales del manual de identidad para posicionar el acceso de los clientes usuarios basado en los resultados de los benchmarks y mejores prácticas y tendencias de UI.
Propuesta de estrategia completa
¿Qué haremos si ganamos el proyecto?
Todo lo presentado para el concurso de agencias se basa en hipótesis pero necesitamos validarlas y obtener evidencias en un estudio más completo, un plan más robusto y un presupuesto más competitivo pues todo lo anterior se hico en una semana sin presupuesto y sólo con el trabajo del equipo en las horas de agencia destinadas para elaborar la propuesta y presentar el pitch ante el cliente en nuestro turno juento con otras agencias de prestigio en México.
Resultados
Ganamos el concurso de pitch de agencias
Convencimos al cliente de que teníamos la mejor propuesta debido a que estaba sólidamente sustentada en una metodología ágil de UX en un diseño centrado en el usuario.
El equipo de UX se consolidó en la agencia al obtener recursos derivado del presupuesto obtenido en el concurso y obtuvimos reconocimientos y felicitaciones al interior de la agencia por el profesionalismo y dedicación en el proyecto marcando un parteaguas en la manera que abordaríamos proyectos de UX dentro de la agencia.
Aprendizajes
Me hubiera gustado liderar el proyecto en las etapas después de ganado el concurso, pero la agencia me asigno nuevos concursos y nuevos proyectos y se contrató a terceros para ejecutar el plan original pero en el camino el plan fue modificado y afectó la calidad de los entregables con el cliente y el equipo de desarrollo.
No tuve la oportunidad de ver construida la solución de diseño y posteriormente cambiaron los stakeholders en la organización del cliente y en la agencia por lo que el proyecto no fue desarrollado. Pero la agencia obtuvo el presupuesto del cliente para ejecutar el plan de diseño UX y derivó en aumento del ROI y del margen de ganancias ese año para la agencia.
