All MicroEvals
Quiero que desarrolles una página web moderna para la venta ...
Create MicroEval
Header image for Quiero que desarrolles una página web moderna para la venta ...

Quiero que desarrolles una página web moderna para la venta ...

Prompt

Quiero que desarrolles una página web moderna para la venta de entradas de un museo ficticio llamado "Museo Nova". Objetivo: Crear una experiencia de compra de entradas completa, moderna y profesional. No quiero una simple landing page: debe ser una aplicación funcional de principio a fin. Tecnología: - React - TypeScript - Vite - Tailwind CSS - No uses backend ni APIs externas. - Los datos pueden almacenarse en localStorage. Página principal: - Header con logo "Museo Nova" - Navegación: Inicio, Exposiciones, Visita, Entradas - Hero con una imagen/ilustración relacionada con arte - Botón principal "Comprar entradas" - Sección de exposiciones actuales - Información sobre horarios y ubicación - Footer completo Sistema de compra: 1. Selección del tipo de entrada: - Adulto: 12 € - Estudiante: 8 € - Niño: 5 € - Menores de 6 años: gratis 2. Selector de cantidad para cada tipo. 3. Selección de fecha mediante calendario. 4. Selección de una franja horaria: - 10:00 - 11:30 - 13:00 - 16:00 - 17:30 5. Mostrar un resumen de la compra actualizado en tiempo real. 6. Aplicar un código de descuento ficticio: - NOVA10 → 10% de descuento 7. Formulario de datos: - Nombre - Apellidos - Email 8. Pantalla final de confirmación con: - Número de pedido generado - Fecha - Hora - Entradas compradas - Precio total 9. Guardar la última compra en localStorage. Requisitos de UX: - Diseño responsive para móvil, tablet y escritorio. - Animaciones sutiles. - Estados hover, focus, loading, error y éxito. - Validación de formularios. - No permitir continuar si faltan datos obligatorios. - Mostrar claramente el precio total. - El usuario debe poder volver atrás sin perder la selección. - La navegación debe funcionar sin recargar la página. Diseño: - Estética de museo moderno y elegante. - Mucho espacio en blanco. - Tipografía moderna. - Tarjetas con bordes suaves. - Animaciones discretas. - Buen contraste y accesibilidad. - No hagas una interfaz genérica de plantilla: quiero una identidad visual propia para "Museo Nova". Importante: - No te limites a crear el diseño visual. - Implementa toda la funcionalidad descrita. - Organiza correctamente los componentes y tipos de TypeScript. - Evita código duplicado. - Si detectas errores durante la implementación, corrígelos. - Al terminar, ejecuta el proyecto y comprueba que funciona correctamente. - Revisa especialmente la selección de entradas, cálculo de precios, descuentos, validación y persistencia en localStorage. - No declares la tarea terminada hasta haber comprobado que las funcionalidades principales funcionan.

A system prompt was added to support web rendering

Drag to resize
Drag to resize