En un mundo donde el ritmo acelerado y las responsabilidades cotidianas dejan poco espacio para el autocuidado, las mujeres enfrentamos una creciente necesidad de desconectar del entorno y reconectar con nosotras mismas.
VivaFem es un hotel-spa para mujeres, que surge como un caso de estudio enfocado en diseñar una solución digital para atender esta necesidad, combinando bienestar, creatividad y relajación en un único espacio accesible y funcional. Más allá de crear una página web responsive, el reto fue imaginar cómo este producto podría integrarse en la realidad, desarrollando una propuesta de valor concreta y aplicable.
Para comprender a fondo las necesidades de las usuarias, se realizó una encuesta a un grupo de mujeres entre 28 y 45 años. La recopilación reveló de datos que permitieron identificar sus preferencias, hábitos y motivaciones en relación con escapadas de bienestar:
La encuesta ayudó a definir las necesidades de las usuarias, destacando la preferencia por escapadas de corta o mediana duración, presupuestos accesibles y actividades centradas en el bienestar físico, la creatividad y la relajación mental. Estos hallazgos fueron clave para crear una propuesta adaptada a sus intereses.
Se realizó un análisis heurístico de tres plataformas que ofrecen servicios similares a VivaFem: Hotel Los Ángeles, MASQi y SHA Wellness.
Este análisis permitió identificar buenas prácticas como el diseño minimalista y mecanismos claros de prevención de errores, pero también resaltó áreas de mejora, especialmente en la accesibilidad móvil, consistencia visual y uso de tablas comparativas. Estos hallazgos sirvieron como base para tomar decisiones estratégicas en el diseño de VivaFem, priorizando una experiencia accesible y centrada en el usuario.
Basados en los resultados de las encuestas, se desarrollaron dos User Personas que representan a las posibles clientas de VivaFem. A través de un Mapa de Empatía, se generó una comprensión profunda de sus necesidades, facilitando la toma de decisiones de diseño.
Marina y Olga reflejan dos perfiles distintos pero complementarios de clientas objetivo. Ambas buscan desconexión y bienestar, pero mientras Marina prioriza la personalización y el precio, Olga necesita sentirse respaldada en su decisión de tomarse un descanso.
“Las mujeres de 28 a 45 años desean una plataforma accesible y personalizada que ofrece escapadas de bienestar diseñadas para satisfacer diversas preferencias de duración, presupuesto y actividades.”
Crear un producto que tenga las siguientes características:
Realicé un ejercicio de card sorting para organizar la información de manera clara y coherente, permitiendo a los usuarios encontrar fácilmente lo que necesitan y cumplir sus objetivos.
El user flow se diseñó específicamente para el proceso de checkout, enfocándose en pasos concretos que guíen al usuario desde su entrada hasta la finalización exitosa de la reserva. Cada etapa fue diseñada para ser simple y clara, garantizando una experiencia fluida y sin fricciones hacia la acción final de compra.
Una vez definida la arquitectura de la información y el user flow, procedí a crear los wireframes. La estructura inicial me permitió visualizar cómo organizar las secciones más simples de la web, pero hubo elementos más complejos que requerían un análisis más profundo.
Un ejemplo claro es la tabla comparativa, donde debía asegurar que la información fuera clara y funcional tanto en versión móvil como en desktop. Exploré varias alternativas de diseño para encontrar una solución que mantuviera la coherencia visual y la usabilidad, sin que la experiencia del usuario se viera afectada por los cambios en el diseño responsive. Finalmente, logré organizar los datos de forma que se mantuvieran accesibles y fáciles de leer en cualquier dispositivo.
Con las bases bien establecidas, el siguiente paso fue crear un sistema visual sólido que conectara cada elemento conceptual con los prototipos finales. Inspirado en los principios del Atomic Design, este sistema asegura consistencia y flexibilidad en todos los componentes visuales.
Creé un sistema de diseño para asegurar la consistencia visual y funcional en todo el proyecto. Este sistema incluye colores, tipografías, iconos y componentes esenciales, organizados según los principios de Atomic Design para mantener una jerarquía clara y facilitar su reutilización en diferentes contextos.
Este sistema simplifica la expansión futura de la plataforma, permitiendo añadir nuevas secciones o funcionalidades sin comprometer la experiencia del usuario ni la consistencia del diseño.
En la fase de Prototipar, todas las pantallas fueron desarrolladas teniendo en cuenta los breakpoints establecidos por Bootstrap para garantizar una experiencia totalmente responsive. Diseñé versiones específicas para móvil, tablet y desktop, asegurándome de que cada componente se adaptara perfectamente a las distintas resoluciones sin perder funcionalidad ni coherencia visual.
Además, se trabajó en la interacción para los tres dispositivos, incorporando transiciones fluidas y una navegación intuitiva, optimizada para las características únicas de cada formato. El resultado es un prototipo interactivo que refleja cómo los usuarios experimentarán el producto final en cualquier dispositivo.
El proyecto logró cumplir con sus objetivos principales: se diseñó un balance entre actividades físicas, creativas y de relajación, acompañado de una arquitectura de información clara que facilita la navegación mediante una jerarquía visual bien definida. Además, las tablas comparativas ayudan a las usuarias en la toma de decisiones, mientras que la experiencia intuitiva diseñada las motiva a planificar sus escapadas. Finalmente, se optimizó el sistema de reservas, reduciendo pasos y que pueda proporcionar una retroalimentación en tiempo real para garantizar una experiencia fluida.