Landing Page – Car One Center
El siguiente trabajo fue realizado junto al equipo de Cámara TBWA como parte de la campaña para el día de la madre realizada en mayo de 2025.
Objetivo
El objetivo fue crear una landing page con un formulario lógico, en el cúal los clientes de los locales adheridos a Car One Center ingresarán los datos de su compras durante un lapso de tiempo predefinido. En base a la suma de montos de las compras se generan una cantidad de chances para participar de un sorteo a la Riviera Maya, cada $2000 pesos uruguayos se genera una chance con un tope de 10 chances.
Proceso y desafíos
El proceso de trabajo comenzó con la definición de lógicas que tendría el formulario y la estructura visual inicial de la landing page, y en base a estas se definieron las herramientas a utilizar así como el puntapié inicial para el diseño por partes del equipo de diseño.
A la izquierda – Template base de referencia
A la derecha – Captura de landing final.
Configuración inicial
- Adquisición, vinculación, configuración del dominio y servidor (amigable con el medio ambiente).
- Cloudflare – Configuración esencial de seguridad y caché.
- Instalación y configuración de CMS (WordPress).
- Instalación y configuración de plugins de seguridad y rendimiento.
Desarrollo de contenido visual
Luego de recibido el diseño de la landing desarrollado por el equipo de diseño y aprobado por el cliente, se replicó y trabajo respetando las buenas prácticas del desarrollo web, con un enfoque hacía lo responsivo.
Selección de gestor de formularios
Para esta ocasión se opto por utilizar la herramienta Gravity Forms la cual nos permite acceder a una gran cantidad de funcionalidades avanzadas necesarias para este proceso, como las pertenecientes a Gravity Wiz. Otro motivo por el cúal se opto esta herramienta es su sencillez en la gestión de datos desde el escritorio de administración, así como de su exportación.
Formulario Lógico Condicional (el verdadero desafío)
Luego de definidas las pautas de la campaña que debía cumplir el formulario, se comenzó a trabajar en la parte lógica del mismo, el cúal paso por diferentes etapas y problemas que se fueron solucionando individualmente para lograr un producto terminado y acabado.
Puntos esenciales del formulario:
- Debe contar con campos básicos (Nombre, Cédula, Celular, Mail, Fecha de nacimiento).
- Debe haber un apartado donde poder agregar, editar y eliminar una o más facturas (dentro de ellas deberá aparecer la Tienda, el Nº de Factura, la Moneda y el Monto).
- Cada factura puede ser de USD o $UY, en caso de ser dólares debe realizarse la conversión automática a pesos para unificar los criterios de cupones.
- En base a el monto total generado por las facturas se muestra en pantalla cuantos cupones se han generado para el sorteo.
- Debe implementarse una lógica que no permita subir la misma factura más de una vez dentro del formulario o en diferentes instancias.
Para poder cumplir con estas condiciones se trabajo con formulas avanzadas dentro de campos ocultos del formulario para la lógica de cupones y conversión de monedas, con formularios hijos para la gestión y edición de facturas de forma individual y con lógica condicional dentro de campos para opciones como verificación de edad, campos correctos o mínimo de 1 cupón generado.
El proceso fue laborioso debido a que muchas configuraciones no eran nativas del gestor de formularios y/o que la documentación encontrada no era suficientemente detallada.
Vídeo funcional del formulario y funcionalidades:
Confirmación – Email – Panel
Se trabajo en el proceso de confirmación del formulario, los cuales mediante lógica condicional y dependiendo la cantidad de cupones generados mostraría un contenido distinto, remarcando las chances generadas e info importante.
Esta misma información fue enviada al participante por mail, para ello se trabajo en la configuración SMTP del mail, en el desarrollo de la estructura en HTML y CSS, y en la vinculación directa con los datos obtenidos por el formulario.
Para culminar con este proyecto se crea un usuario con acceso restringido y se optimizó el escritorio de administador para que la persona a cargo del sorteo pudiese acceder a toda la información correspondiente, filtarla y exportarla según las necesidades.
Reflexión
Este proyecto fue un desafío fascinante en cuanto los aspectos técnicos y de procesos. El tiempo acotado en el desarrollo y los problemas en cuanto a la falta de documentación retrasaron parte de las etapas, que se llegaron a dar solución luego de prueba y error.
Muy agradecidos como siempre a cámara TBWA y a Car One Center por confiar en nuestro trabajo en el desarrollo web.