CASE STUDY / 02
ME AND ME
Del catálogo al cuidado según cada etapa.
Rediseño UX/UI y desarrollo de un comercio digital que conecta información dermohormonal, productos y compra.
01 / INTRODUCCIÓN
Una marca que explica antes de vender.
ME AND ME relaciona el cuidado de la piel con las distintas etapas hormonales de la mujer. Su web reúne contenido divulgativo, información sobre formulaciones y un catálogo de productos.
Mi trabajo consistió en convertir esas piezas en una experiencia coherente, desde la primera visita hasta la ficha de producto.
02 / RETO
Dos maneras de llegar al mismo producto.
Algunas personas saben qué producto buscan. Otras necesitan entender qué opciones se relacionan con su situación. La web debía servir a ambos recorridos sin ocultar el contexto de la marca ni complicar la compra.
03 / ENFOQUE
Organizar la oferta desde el contexto.
La arquitectura incorpora las etapas hormonales como vía de descubrimiento junto al acceso directo al catálogo. La home y el menú presentan ambas entradas de forma reconocible; el contenido editorial aporta contexto antes de conducir hacia productos relacionados.
3.1 / HOME Y MENÚ
Orientar desde el primer contacto.
La navegación en escritorio reúne marca, contenido y comercio sin exigir un único camino de entrada.
El mapa de la experiencia
La estructura conecta páginas por etapa, catálogo, contenidos y área profesional.
04 / SOLUCIÓN
Contenido y producto dentro de un mismo recorrido.
Las páginas por etapa desarrollan las necesidades y preguntas de cada momento. La ficha de producto ordena la información esencial para comprar y deja accesibles las explicaciones sobre uso, formulación y contexto.
4.1 / ETAPAS HORMONALES
Explorar por etapa.
Las páginas de etapa combinan contenido editorial, acceso a otras etapas y preguntas frecuentes en una jerarquía que orienta la exploración.
4.2 / FICHA DE PRODUCTO
Decidir con información.
La ficha combina imágenes, precio y acción de compra con beneficios, detalle de uso, opiniones y productos relacionados.
05 / IMPLEMENTACIÓN
La experiencia también funciona en móvil.
El diseño se llevó a WordPress y WooCommerce, con adaptación de contenido, navegación y funciones comerciales. En móvil, el menú conserva las entradas por productos y etapas; el recorrido mantiene la continuidad entre lectura y catálogo.
5.1 / NAVEGACIÓN MÓVIL
Un recorrido compacto.
El menú móvil conserva el acceso a productos y etapas y permite llegar a las recomendaciones sin interrumpir la lectura.
06 / CONCLUSIONES
Una estructura que conecta necesidad y compra.
El resultado reúne dos formas de explorar: por contexto hormonal y por producto. La aportación del diseño está en la arquitectura y la jerarquía que permiten pasar del contenido especializado a una decisión de compra sin perder orientación.