# Maison Néroli

> Hacer que una colección de fragancias se explore como una experiencia editorial, no como una cuadrícula de ecommerce.

- Servicio demostrado: Diseño web para perfumería de lujo
- Tipo: demostración independiente
- Sector: Perfumería
- Dirección visual: Cold luxury
- Interacción: Selector olfativo
- Caso: https://devforgeapp.pro/proyectos/maison-neroli
- Demo: https://neroli.devforgeapp.pro/

## Respuesta corta

Ocho perfumes, familias olfativas y una narrativa visual que deja al producto ocupar el escenario.

## El reto

La propuesta parte de un problema habitual en perfumería: cuando todos los frascos se presentan como fichas equivalentes, desaparece la personalidad de la colección. El reto era crear deseo y orientación sin convertir la página en una tienda saturada.

## Dirección

La dirección visual mezcla una base mineral oscura, azul cobalto y tipografía sobria para construir un lujo frío, silencioso y contemporáneo. Cada decisión deja espacio para que la textura del frasco y las familias olfativas sean las protagonistas.

## Experiencia

La navegación se organiza como un recorrido editorial: un hero integrado, un strip horizontal para descubrir ocho perfumes y notas agrupadas por familias. Las muestras cromáticas ayudan a reconocer cítrico, iris, madera o ámbar antes de leer toda la descripción.

## Resultado

El resultado es una demostración independiente diseñada y desarrollada para mostrar una experiencia comercial completa: identidad, catálogo, responsive, motion y un camino claro hacia la presentación de la colección, sin prometer métricas de un cliente real.

## Decisiones

- Un hero integrado donde frasco y propuesta comparten la misma escena.
- Un strip editorial para explorar ocho fragancias sin adoptar patrones de tienda genérica.
- Notas agrupadas por familia y codificadas con pequeños tonos materiales.

## Capacidades demostradas

- Catálogo de ocho fragancias
- Navegación suave
- Revelados por viewport
- Modo claro y oscuro

## Fuentes

- [WCAG 2.2 — Target Size (Minimum)](https://www.w3.org/WAI/WCAG22/Understanding/target-size-minimum.html): Criterio usado para que el selector olfativo y sus controles sigan siendo utilizables en touch.
- [Core Web Vitals](https://web.dev/articles/vitals): Referencia para reservar espacio, evitar saltos visuales y medir la experiencia real.

Este caso no representa a un cliente real ni atribuye testimonios, disponibilidad o resultados comerciales reales.