# Landing promocional por fases para una marca de dulces | abuenoben

> Implementación frontend de una campaña de dulces en España: landing por fases, responsive y QA. Caso anonimizado con demo BRIZZI para recorrer la mecánica.

Canonical URL: https://abuenoben.com/casos/landing-campana-promocional
Language: es-ES

[Volver a casos](/casos)

Dulces y gran consumo · Colaboración con agencia · Marca anonimizada

Una misma base frontend permite revisar tres fases, activar sus módulos y cambiar los destinos de campaña. La entrega incluye configuración documentada y comprobaciones visuales y funcionales para escritorio y móvil.

Por [Armando Bueno Ben](/sobre-mi)

[Ver la recreación BRIZZI por fases](#showcase)

![Gominolas ficticias de BRIZZI, recreación visual para explicar el caso.](/images/cases/brizzi/macro-1440.webp)

BRIZZI es una recreación visual. No son imágenes de la campaña del cliente.

## Recorre las tres fases con BRIZZI

BRIZZI recrea la mecánica con una marca de gominolas y recursos generados con IA. Su identidad, productos, códigos y resultados son ficticios; no son piezas ni datos de la campaña original.

![Bolsa amarilla de la marca ficticia BRIZZI, con gominolas de colores.](/images/cases/brizzi/hero-960.webp)

Demo sin registro, API ni sorteos reales.

1.  ### 1. Lanzamiento
    
    Presenta el producto, sus sabores y la caja de la promoción. Anticipa la participación sin mostrar todavía el formulario.
    
    [Probar lanzamiento](https://showroom.abuenoben.com/campanas/brizzi/)
2.  ### 2. Participación
    
    Activa la prueba de códigos. BRZ-PLAN muestra un premio ficticio; BRZ-MIX, la respuesta sin premio. No pide datos personales.
    
    [Probar participación](https://showroom.abuenoben.com/campanas/brizzi/participa/)
3.  ### 3. Cierre
    
    Retira la participación y la promoción de la caja. Publica referencias ficticias y mantiene el contenido de producto y las preguntas.
    
    [Probar cierre](https://showroom.abuenoben.com/campanas/brizzi/cierre/)

## Cómo se ejecutó

01

### Punto de partida

Una marca de dulces de gran consumo en España necesitaba una landing que acompañase los distintos momentos de su campaña. La presentación, el acceso a la participación y el cierre debían cambiar sin mantener tres webs independientes.

02

### Qué hice

Implementé el frontend a partir del diseño de la campaña: estructura responsive, módulos por fase, navegación, animaciones, contenido audiovisual y páginas legales. Separé la configuración de fases y destinos del código de presentación para facilitar las revisiones y el relevo técnico.

03

### Mi responsabilidad

Colaboración técnica con la agencia responsable de la campaña. Mi alcance fue la implementación frontend, los ajustes responsive y la comprobación funcional y visual. La estrategia, la identidad y la dirección creativa pertenecen a la marca y a su agencia.

04

### Resultado

Una misma base frontend permite revisar tres fases, activar sus módulos y cambiar los destinos de campaña. La entrega incluye configuración documentada y comprobaciones visuales y funcionales para escritorio y móvil.

## Decisiones y alcance

### La fase cambia el contenido y las acciones

Una configuración central define los módulos activos. El acceso a participación y la publicación de resultados responden al momento de campaña; los contenidos de demostración quedan separados de los datos oficiales.

### Movimiento que acompaña al contenido

La navegación conserva el scroll nativo. Las animaciones y el audiovisual se revisan junto con teclado, foco, movimiento reducido y tamaños de pantalla.

### Un frontend con límites claros

El trabajo incluye destinos configurables hacia participación y otros recursos externos. No se atribuye a esta entrega el backend, la gestión de premios, la integración directa con CRM ni los resultados comerciales de la campaña.

## Cómo aplicarlo en tu agencia

Ejecución de una landing a partir de tu diseño: módulos de campaña, cambios por fase, responsive, animación y QA. La agencia conserva la dirección creativa y la relación con su cliente; los destinos y los contenidos se dejan configurables.

## Contexto del proyecto

Contexto

Campaña de una marca de dulces de gran consumo en España, realizada en colaboración con agencia.

Entrega técnica

Frontend responsive, módulos por fase, configuración y documentación de revisión.

Qué puedes probar

BRIZZI recrea el patrón con una marca y productos ficticios. Sus códigos y resultados se resuelven localmente, sin registro ni API.

Resultado que se documenta

La implementación y su funcionamiento. No se publican cifras de tráfico, participación, conversión o ventas.

## Tecnología y decisiones

Base técnica

HTML, JavaScript modular, Sass y Webpack. GSAP para movimiento y carga bajo demanda de los módulos que lo requieren.

Duración y alcance

Desarrollo y validación de una campaña con tres fases. El calendario comercial y las fechas de activación pertenecen al cliente.

Lo que aprendí

Conviene acordar qué aparece, desaparece o cambia de destino en cada fase antes de implementar los módulos. Esa matriz permite revisar también la transición y el cierre, no solo el lanzamiento.

## Servicios relacionados

[Desarrollo web en marca blanca](/agencias/desarrollo-web-marca-blanca)[Desarrollo web a medida](/desarrollo-web-a-medida)[Más demos del showroom](/demos/experiencias-web-interactivas)

## ¿Tienes una entrega con un riesgo parecido?

Con objetivo, fecha, estado actual y responsable de validación puedo decirte si el encaje es real y qué revisaría primero.

[Cuéntame el proyecto](/contacto?organizationType=agency#contact-form-shell)
