Gypsy — Tickets

El brief pedía una página de entradas: dos meses de fechas de función seleccionables, formas alternativas de comprar y tres preguntas frecuentes desplegables. Desarrollé la interfaz como un prototipo interactivo, tomando como punto de partida la identidad visual que se proporcionó para el espectáculo.

Fue un ejercicio de evaluación de habilidades. El caso presenta el diseño y sus estados de interfaz funcionales, con horarios y textos de demostración, y no un servicio de venta de entradas en funcionamiento.

El rojo neón, la luz cálida de las bombillas y un fondo azul medianoche crean el ambiente teatral. El calendario se apoya en un panel color crema inspirado en un programa de mano, que da a la densa cuadrícula de fechas un fondo de lectura más tranquilo.

En los archivos fuente, el color, la tipografía, el espaciado y el movimiento están organizados en tokens compartidos. Los títulos condensados en Antonio, el texto de cuerpo geométrico y los detalles en tipografía manuscrita dan al hero, al calendario y a las secciones de apoyo funciones distintas dentro del mismo sistema visual.

Dos meses contiguos mantienen la programación visible en una sola vista. Las fechas disponibles llevan pequeños marcadores de función; al seleccionar una fecha, el panel de abajo se actualiza con su día, el lugar y las opciones de matiné o de noche.

Los controles de mes recorren la temporada de demostración, mientras que las fechas pasadas y los días sin funciones están deshabilitados. La fecha elegida sigue visible en la cuadrícula y en el panel, y conecta la elección con el siguiente paso. El prototipo se detiene antes del checkout.

La entrada combina las bombillas de la marquesina, la marca de neón de Gypsy y unas cortinas que se abren para revelar la página. La introducción se puede saltar, y el prototipo la omite cuando se solicita movimiento reducido.

La versión en movimiento y el handoff estático cumplen funciones distintas: el prototipo demuestra los tiempos y los cambios de estado, mientras que las exportaciones del hero, el calendario y las secciones de apoyo conservan la composición para la revisión de diseño.

Tres tarjetas numeradas separan las vías de taquilla, teléfono y sorteo. Debajo, un acordeón de tres elementos mantiene una sola respuesta abierta a la vez y permite cerrar la respuesta actual.

Estas secciones usan el texto de relleno que permitía el brief de la evaluación. La estructura entregada incluye el prototipo de la página, tokens visuales reutilizables y exportaciones por sección preparadas para un handoff a Figma.