Trabajo / Caso de estudio
The Palace Company · 2024
Una plataforma tan confusa que los huéspedes preferían llamar por teléfono
Moon Vacation Getaway sirve para canjear certificados de descuento comprados de forma física. El problema no era estético: cada canje que se iba al Call Center costaba el triple de tiempo y dejaba la mitad de ingreso.
Problema y objetivo
La plataforma estaba desactualizada, sin información suficiente y con una lógica pensada para el administrador, no para el huésped. La gente abandonaba y terminaba llamando al Call Center.
Objetivo: subir el NPS 50% respecto al año anterior, sostener una conversión por encima del 1% de las visitas y equilibrar la redención en 50/50 contra el Call Center.
Solución propuesta
Rediseño completo del flujo de canje: menos pasos, información de guía en el momento en que hace falta, jerarquía nueva para los llamados a la acción y una experiencia móvil que antes no existía. Todo sobre un sistema de componentes basado en Vuetify 3 para que el equipo de desarrollo pudiera implementarlo sin reinventar piezas.
Mi participación
Product Designer responsable del proyecto, de principio a fin. Conduje la investigación, definí el usuario, facilité la ideación con stakeholders, diseñé los prototipos, corrí las pruebas de usabilidad y preparé la entrega a desarrollo.
Nivel de responsabilidad: decisión de diseño y priorización, con validación de producto y desarrollo.
Con quién trabajé
Equipo de desarrollo, equipo de diseño, dueño de producto, Call Center y áreas comerciales. Las entrevistas y la sesión de ideación fueron colaborativas por diseño, no por cortesía: quería que quien iba a construirlo escuchara a los usuarios de primera mano.
Resultado
NPS +200% contra un objetivo de 50%. Relación de redención 70/30 a favor de la plataforma, cuando la meta era 50/50. Conversión sostenida en 2.8% de las visitas, casi el triple del mínimo.
El problema
Lo que costaba en dinero, no en apariencia
Los huéspedes compran su certificado físicamente, entran al sitio y hacen su reserva con el descuento correspondiente. En teoría. En la práctica, el flujo era lo bastante confuso como para que una parte importante colgara el proceso y marcara al Call Center.
- El sitio era poco intuitivo: los huéspedes terminaban hablando al Call Center para canjear sus certificados.
- Al Call Center le tomaba hasta tres veces más completar una reserva con certificado que una reserva normal.
- El ingreso de las reservaciones con certificado era hasta dos veces menor que el de las reservas sin certificado.
Ese último dato es el que convirtió un proyecto de diseño en una prioridad de negocio. No estábamos arreglando una interfaz fea: estábamos tapando una fuga.
Objetivos
Definidos antes de empezar
Los acordamos con producto y comercial antes de abrir Figma, para poder decir al final si funcionó o no sin discutir el criterio.
Proceso · Design Thinking
Cómo llegué ahí
Cinco fases. En cada una hay una decisión que se puede discutir, no solo un entregable bonito.
Empatizar
Observación
Empecé por meterme en la experiencia real de los usuarios en vez de suponerla. Usé Datadog para analizar session replays y embudos, lo que me permitió identificar patrones de comportamiento, frustraciones comunes y los puntos exactos donde la gente se caía del flujo.
Esos datos fueron la base para entender el problema desde el usuario y no desde el organigrama.
Embudo y session replays. Imágenes de referencia por temas de confidencialidad.
Entrevistas
Hice entrevistas con siete usuarios para cubrir distintos perfiles. Las conduje junto con el equipo de desarrollo y diseño, a propósito: cuando el desarrollador escucha directamente a alguien atorarse en su pantalla, la discusión posterior sobre qué construir dura la mitad.
Guía para conducir las entrevistas.
Definir
Categoricé los hallazgos en FigJam, agrupando por temas y patrones. Con eso construí un user persona detallado basado en usuarios reales, no en suposiciones, y nos sirvió de brújula para todas las decisiones que vinieron después.
Idear
Corrí una sesión de Design Studio en FigJam con los stakeholders clave. Ideamos soluciones y votamos de forma anónima, que es la manera más simple de evitar que gane la idea del jefe en vez de la mejor idea.
Después, una matriz de impacto contra esfuerzo, hecha con el equipo, separó lo que dábamos ese trimestre de lo que requería más planeación para los siguientes.
Prototipar
Empecé a mano, con bocetos rápidos para explorar y descartar barato. De ahí a wireframes de baja fidelidad, que iteré con usuarios antes de invertir un solo minuto en pixel perfecto.
Wireframes de baja fidelidad, iterados con usuarios reales antes del diseño final.
Alta fidelidad sobre un sistema, no sobre pantallas sueltas
Implementé un sistema de diseño basado en Vuetify 3, para que cada prototipo de alta fidelidad correspondiera a componentes que el equipo ya podía construir. Sometí las pantallas a análisis heurístico y a las leyes de usabilidad antes de llevarlas a prueba.
Probar
Corrí pruebas de usabilidad en Maze con usuarios que correspondían al user persona. Aquí es donde el proyecto dejó de ser una opinión mía.
Plataforma de Maze. Imágenes de referencia por temas de confidencialidad.
La hipótesis de acortar los pasos para el canje del certificado. Menos pantallas, mismo resultado, menos abandono.
Los textos, para hacerlos más descriptivos. La gente no fallaba por no encontrar el botón, fallaba por no entender qué iba a pasar al oprimirlo.
El carrusel de la página principal y otras funciones que no aportaron valor ni fueron utilizadas. Eran ideas mías y las pruebas dijeron que no. Se fueron.
Algunas pantallas del prototipo final.
Colaboración
Con quién trabajé y cómo
Un rediseño de este tamaño no lo decide el diseñador solo. Esto es lo que aportó cada parte y dónde tuve que ceder.
Desarrollo
ImplementaciónLos invité a las entrevistas desde el inicio para que el contexto no llegara filtrado por mí. Definimos juntos el sistema sobre Vuetify 3 para que cada componente del prototipo tuviera correspondencia real en código. La entrega incluyó especificaciones, estados y comportamiento, no solo pantallas.
Producto
Prioridad y alcanceAcordamos los objetivos numéricos antes de diseñar. La matriz de impacto contra esfuerzo fue la herramienta para negociar qué entraba en el trimestre; varias ideas buenas se pospusieron y quedó por escrito por qué.
Call Center
Fuente de evidenciaEran el síntoma del problema y también quienes mejor lo conocían. Sus llamadas recurrentes me dijeron dónde estaban las dudas antes de que las entrevistas lo confirmaran.
Diseño
ConsistenciaRevisiones cruzadas para que el rediseño no se saliera del lenguaje visual de la marca ni creara componentes duplicados de los que ya existían.
Stakeholders
AlineaciónLa sesión de Design Studio con votación anónima sirvió para dos cosas: recoger ideas y conseguir que quienes tenían poder de veto se sintieran parte de la solución antes de verla terminada.
Entrega a desarrollo
Documentado para que se construya sin adivinar
Cada componente entregado con anatomía, medidas, estados y reglas de comportamiento. La meta de una buena entrega es que el desarrollador no tenga que escribirme para avanzar.
Resultados
Contra los objetivos que fijamos al principio
Reducir la dependencia del Call Center tuvo un efecto doble: bajó el costo operativo por canje y subió el ingreso promedio de las reservaciones con certificado, que era la fuga original.
Lo que hizo la diferencia no fue el rediseño visual. Fue haber medido antes, haber preguntado a siete personas reales y haber tenido la disciplina de tirar a la basura las funciones que a mí me gustaban y a nadie le servían.
Qué haría distinto
- Definir la medición antes del rediseño, no en paralelo. Tuvimos que reconstruir la línea base de satisfacción a medio camino, y eso hizo la comparación más discutible de lo necesario.
- Siete entrevistas alcanzaron para detectar patrones, pero no para segmentar. Con dos perfiles más habría podido separar al comprador primerizo del huésped que ya canjeó antes, que probablemente necesitan flujos distintos.
- Auditar accesibilidad desde el wireframe. La revisé al final. Contraste, orden de foco y etiquetas de formulario son mucho más baratos de resolver en baja fidelidad que en implementación.
- Instrumentar el embudo con eventos propios desde el día uno. Los session replays sirven para entender, pero para sostener una discusión de negocio hacen falta eventos definidos y nombrados con anticipación.