Grip: Health Tech E-commerce
UX/UI Design · User Research · Mobile First · Health Tech
El Contexto: Democratizando la Salud Hormonal
Grip es una startup holandesa con una misión clara: dar a las personas con útero el control de su salud hormonal y fertilidad a través de pruebas de sangre en casa. Como UX/UI Designer Intern, mi objetivo fue transformar una experiencia web funcional pero limitada en un ecosistema digital de confianza, educativo y orientado a la conversión.
El sitio original utilizaba una plantilla genérica que no reflejaba la autoridad médica de la marca ni respondía a las necesidades emocionales de los usuarios. Con el 90% del tráfico proviniendo de dispositivos móviles, la prioridad absoluta fue el rediseño bajo una estrategia Mobile-First.
01 — Descubrimiento y Empatía: Entendiendo el Tabú
No podíamos diseñar para la salud hormonal sin entender a quienes la viven. Realicé una fase de investigación profunda para identificar por qué los usuarios abandonaban el carrito o no terminaban de confiar en el servicio.
Puntos de Fricción detectados:
- Falta de Confianza Médica: El diseño no transmitía la seguridad necesaria para un producto que requiere una muestra de sangre.
- Complejidad en la Oferta: Los usuarios no entendían qué prueba necesitaban (¿Fertilidad? ¿SOP? ¿Salud General?).
- Barreras en Mobile: Elementos demasiado pequeños, textos densos y una navegación que dificultaba el cierre de la compra.
Herramientas de Diagnóstico: Utilicé Hotjar y Google Analytics para mapear el comportamiento del usuario, detectando que el 60% de los rebotes ocurrían en la página de selección de producto debido a la sobrecarga de información.
02 — Estrategia de Diseño: Confianza y Claridad
Basándome en el research, definimos tres pilares estratégicos:
- Autoridad Visual: Evolución del sistema de diseño para equilibrar la cercanía de una startup con la sobriedad de un laboratorio médico.
- Educación Proactiva: Implementación de bloques de contenido que explicaran el proceso de forma sencilla (Test > Laboratorio > Resultados).
- Fricción Cero: Rediseño del flujo de checkout para reducir pasos y optimizar campos en dispositivos móviles.
03 — Ejecución: Rediseño del 80% del Ecosistema
Trabajé codo a codo con el equipo de producto y fundadoras para rediseñar las páginas clave del sitio:
Optimización de la Home:
- Sustitución de textos densos por propuestas de valor claras.
- Inclusión de pruebas sociales (Trustpilot y testimonios) en puntos estratégicos.
Página de Producto (PDP) & Cuestionario:
- Rediseñamos el selector de productos para que fuera intuitivo.
- Introdujimos un “Quiz de Salud” visualmente guiado que ayudaba al usuario a descubrir qué prueba era la adecuada para su situación personal.
Dashboard de Resultados:
- Mejoré la visualización de los datos médicos para que fueran comprensibles para una persona sin formación sanitaria, utilizando gráficos claros y recomendaciones accionables.
04 — Impacto y Resultados
El rediseño no solo mejoró la estética, sino que tuvo un impacto directo en el negocio de la startup:
- Crecimiento del 10% Mensual: Las ventas se mantuvieron en un crecimiento constante gracias a la mejora en la confianza del usuario.
- Optimización de Conversión: La tasa de conversión se estabilizó por encima del 1% incluso con el aumento de tráfico, eliminando cuellos de botella críticos en mobile.
- Eficiencia en Diseño: Creé una librería de componentes en Figma que permitió al equipo de marketing lanzar nuevas campañas y landing pages en la mitad de tiempo.
Entregables del Proyecto
- Auditoría de UX y mapas de calor (Hotjar).
- Rediseño completo de la interfaz Mobile-First.
- User Flows del proceso de compra y recepción de resultados.
- Librería de componentes UI para Wix/Custom Code.
- Prototipos interactivos para testing con usuarios reales.
Lecciones Aprendidas y Reflexiones
Reflexionando sobre este proyecto, estas son las tres lecciones principales que integraré en mis futuros flujos de trabajo:
-
La simplicidad vence a la navegación tradicional: A veces, seguir el patrón estándar de E-commerce (Home > Shop > Product Page > Checkout) genera demasiada fricción. Al fusionar la página de tienda con la de producto, demostramos que reducir los pasos de 5 a 2 era exactamente lo que el usuario necesitaba para sentirse seguro al comprar un producto médico complejo.
-
Diseñar con restricciones técnicas es una ventaja: Trabajar con Wix me enseñó a equilibrar la creatividad en Figma con la viabilidad técnica. Aprendí que es mejor diseñar una solución robusta y posible de implementar rápidamente que una propuesta visualmente compleja que el CMS no puede soportar, acelerando así el tiempo de lanzamiento (Time-to-Market).
-
La data cuenta la historia, pero el feedback cualitativo da la solución: Si bien Google Analytics nos mostró qué estaba pasando (alto rebote), fue el comentario de la usuaria en Confluence sobre la confusión con el SOP (PCOS) lo que nos dio el porqué. Esto reafirmó mi convicción de que los números y las palabras de los usuarios deben ir siempre de la mano.