CursosEmpresasBlogLiveConfPrecios

Reto 1: Landing page para un festival

Clase 2 de 14 • The Vibecoders League: retos

Contenido del curso

Retos Diarios

  • 1
    Cómo funciona The Vibecoders League

    Cómo funciona The Vibecoders League

    01:58 min
  • 2
    Reto 1: Landing page para un festival

    Reto 1: Landing page para un festival

    Viendo ahora
  • 3
    Reto 2: Dashboard personal

    Reto 2: Dashboard personal

    00:02 min
  • 4
    Reto 3: Automatiza una tarea real de tu día a día

    Reto 3: Automatiza una tarea real de tu día a día

    00:02 min
  • 5
    Reto 4: Asistente de notificaciones inteligente

    Reto 4: Asistente de notificaciones inteligente

    00:02 min
  • 6
    Reto 5: Integra dos mundos para resolver un problema común

    Reto 5: Integra dos mundos para resolver un problema común

    00:02 min
  • 7
    Reto 6: Explica un concepto complejo

    Reto 6: Explica un concepto complejo

    00:02 min
  • 8
    Reto 7: Serie de imágenes con narrativa

    Reto 7: Serie de imágenes con narrativa

    00:02 min
  • 9
    Reto 8: Photoshoot profesional con IA

    Reto 8: Photoshoot profesional con IA

    00:02 min
  • 10
    Reto 9: Trailer cinematográfico

    Reto 9: Trailer cinematográfico

    00:02 min
  • 11
    Reto 10: Agente de atención al cliente

    Reto 10: Agente de atención al cliente

    00:02 min
  • 12
    Reto 11: Agente interno para un equipo

    Reto 11: Agente interno para un equipo

    00:02 min
  • 13
    Reto 12: Un prompt, tres resultados

    Reto 12: Un prompt, tres resultados

    00:02 min
  • 14
    Reto 13: Prompt de sistema para un caso real

    Reto 13: Prompt de sistema para un caso real

    00:02 min

Escuelas

  • Desarrollo Web
    • Fundamentos del Desarrollo Web Profesional
    • Diseño y Desarrollo Frontend
    • Desarrollo Frontend con JavaScript
    • Desarrollo Frontend con Vue.js
    • Desarrollo Frontend con Angular
    • Desarrollo Frontend con React.js
    • Desarrollo Backend con Node.js
    • Desarrollo Backend con Python
    • Desarrollo Backend con Java
    • Desarrollo Backend con PHP
    • Desarrollo Backend con Ruby
    • Bases de Datos para Web
    • Seguridad Web & API
    • Testing Automatizado y QA para Web
    • Arquitecturas Web Modernas y Escalabilidad
    • DevOps y Cloud para Desarrolladores Web
  • English Academy
    • Inglés Básico A1
    • Inglés Básico A2
    • Inglés Intermedio B1
    • Inglés Intermedio Alto B2
    • Inglés Avanzado C1
    • Inglés para Propósitos Específicos
    • Inglés de Negocios
  • Marketing Digital
    • Fundamentos de Marketing Digital
    • Marketing de Contenidos y Redacción Persuasiva
    • SEO y Posicionamiento Web
    • Social Media Marketing y Community Management
    • Publicidad Digital y Paid Media
    • Analítica Digital y Optimización (CRO)
    • Estrategia de Marketing y Growth
    • Marketing de Marca y Comunicación Estratégica
    • Marketing para E-commerce
    • Marketing B2B
    • Inteligencia Artificial Aplicada al Marketing
    • Automatización del Marketing
    • Marca Personal y Marketing Freelance
    • Ventas y Experiencia del Cliente
    • Creación de Contenido para Redes Sociales
  • Inteligencia Artificial y Data Science
    • Fundamentos de Data Science y AI
    • Análisis y Visualización de Datos
    • Machine Learning y Deep Learning
    • Data Engineer
    • Inteligencia Artificial para la Productividad
    • Desarrollo de Aplicaciones con IA
    • AI Software Engineer
  • Ciberseguridad
    • Fundamentos de Ciberseguridad
    • Hacking Ético y Pentesting (Red Team)
    • Análisis de Malware e Ingeniería Forense
    • Seguridad Defensiva y Cumplimiento (Blue Team)
    • Ciberseguridad Estratégica
  • Liderazgo y Habilidades Blandas
    • Fundamentos de Habilidades Profesionales
    • Liderazgo y Gestión de Equipos
    • Comunicación Avanzada y Oratoria
    • Negociación y Resolución de Conflictos
    • Inteligencia Emocional y Autogestión
    • Productividad y Herramientas Digitales
    • Gestión de Proyectos y Metodologías Ágiles
    • Desarrollo de Carrera y Marca Personal
    • Diversidad, Inclusión y Entorno Laboral Saludable
    • Filosofía y Estrategia para Líderes
  • Diseño de Producto y UX
    • Fundamentos de Diseño UX/UI
    • Investigación de Usuarios (UX Research)
    • Arquitectura de Información y Usabilidad
    • Diseño de Interfaces y Prototipado (UI Design)
    • Sistemas de Diseño y DesignOps
    • Redacción UX (UX Writing)
    • Creatividad e Innovación en Diseño
    • Diseño Accesible e Inclusivo
    • Diseño Asistido por Inteligencia Artificial
    • Gestión de Producto y Liderazgo en Diseño
    • Diseño de Interacciones Emergentes (VUI/VR)
    • Desarrollo Web para Diseñadores
    • Diseño y Prototipado No-Code
  • Contenido Audiovisual
    • Fundamentos de Producción Audiovisual
    • Producción de Video para Plataformas Digitales
    • Producción de Audio y Podcast
    • Fotografía y Diseño Gráfico para Contenido Digital
    • Motion Graphics y Animación
    • Contenido Interactivo y Realidad Aumentada
    • Estrategia, Marketing y Monetización de Contenidos
  • Desarrollo Móvil
    • Fundamentos de Desarrollo Móvil
    • Desarrollo Nativo Android con Kotlin
    • Desarrollo Nativo iOS con Swift
    • Desarrollo Multiplataforma con React Native
    • Desarrollo Multiplataforma con Flutter
    • Arquitectura y Patrones de Diseño Móvil
    • Integración de APIs y Persistencia Móvil
    • Testing y Despliegue en Móvil
    • Diseño UX/UI para Móviles
  • Diseño Gráfico y Arte Digital
    • Fundamentos del Diseño Gráfico y Digital
    • Diseño de Identidad Visual y Branding
    • Ilustración Digital y Arte Conceptual
    • Diseño Editorial y de Empaques
    • Motion Graphics y Animación 3D
    • Diseño Gráfico Asistido por Inteligencia Artificial
    • Creatividad e Innovación en Diseño
  • Programación
    • Fundamentos de Programación e Ingeniería de Software
    • Herramientas de IA para el trabajo
    • Matemáticas para Programación
    • Programación con Python
    • Programación con JavaScript
    • Programación con TypeScript
    • Programación Orientada a Objetos con Java
    • Desarrollo con C# y .NET
    • Programación con PHP
    • Programación con Go y Rust
    • Programación Móvil con Swift y Kotlin
    • Programación con C y C++
    • Administración Básica de Servidores Linux
  • Negocios
    • Fundamentos de Negocios y Emprendimiento
    • Estrategia y Crecimiento Empresarial
    • Finanzas Personales y Corporativas
    • Inversión en Mercados Financieros
    • Ventas, CRM y Experiencia del Cliente
    • Operaciones, Logística y E-commerce
    • Gestión de Proyectos y Metodologías Ágiles
    • Aspectos Legales y Cumplimiento
    • Habilidades Directivas y Crecimiento Profesional
    • Diversidad e Inclusión en el Entorno Laboral
    • Herramientas Digitales y Automatización para Negocios
  • Blockchain y Web3
    • Fundamentos de Blockchain y Web3
    • Desarrollo de Smart Contracts y dApps
    • Finanzas Descentralizadas (DeFi)
    • NFTs y Economía de Creadores
    • Seguridad Blockchain
    • Ecosistemas Blockchain Alternativos (No-EVM)
    • Producto, Marketing y Legal en Web3
  • Recursos Humanos
    • Fundamentos y Cultura Organizacional en RRHH
    • Atracción y Selección de Talento
    • Cultura y Employee Experience
    • Gestión y Desarrollo de Talento
    • Desarrollo y Evaluación de Liderazgo
    • Diversidad, Equidad e Inclusión
    • AI y Automatización en Recursos Humanos
    • Tecnología y Automatización en RRHH
  • Finanzas e Inversiones
    • Fundamentos de Finanzas Personales y Corporativas
    • Análisis y Valoración Financiera
    • Inversión y Mercados de Capitales
    • Finanzas Descentralizadas (DeFi) y Criptoactivos
    • Finanzas y Estrategia para Startups
    • Inteligencia Artificial Aplicada a Finanzas
    • Domina Excel
    • Financial Analyst
    • Conseguir trabajo en Finanzas e Inversiones
  • Startups
    • Fundamentos y Validación de Ideas
    • Estrategia de Negocio y Product-Market Fit
    • Desarrollo de Producto y Operaciones Lean
    • Finanzas, Legal y Fundraising
    • Marketing, Ventas y Growth para Startups
    • Cultura, Talento y Liderazgo
    • Finanzas y Operaciones en Ecommerce
    • Startups Web3 y Blockchain
    • Startups con Impacto Social
    • Expansión y Ecosistema Startup
  • Cloud Computing y DevOps
    • Fundamentos de Cloud y DevOps
    • Administración de Servidores Linux
    • Contenerización y Orquestación
    • Infraestructura como Código (IaC) y CI/CD
    • Amazon Web Services
    • Microsoft Azure
    • Serverless y Observabilidad
    • Certificaciones Cloud (Preparación)
    • Plataforma Cloud GCP

Platzi y comunidad

  • Platzi Business
  • Live Classes
  • Lanzamientos
  • Executive Program
  • Trabaja con nosotros
  • Podcast

Recursos

  • Manual de Marca

Soporte

  • Preguntas Frecuentes
  • Contáctanos

Legal

  • Términos y Condiciones
  • Privacidad
  • Tyc promociones
Reconocimientos
Reconocimientos
Logo reconocimientoTop 40 Mejores EdTech del mundo · 2024
Logo reconocimientoPrimera Startup Latina admitida en YC · 2014
Logo reconocimientoPrimera Startup EdTech · 2018
Logo reconocimientoCEO Ganador Medalla por la Educación T4 & HP · 2024
Logo reconocimientoCEO Mejor Emprendedor del año · 2024
De LATAM conpara el mundo
YoutubeInstagramLinkedInTikTokFacebookX (Twitter)Threads

      Reto 1: Landing page para un festival ficticio

      Diseña una landing page para un festival de música, comida o tecnología inventado por ti. Debe incluir: 

      • Nombre del evento
      • Fecha
      • Al menos 3 secciones (lineup/agenda, ubicación, compra de tickets)
      • Que se vea bien tanto en celular como en computador (esto se llama diseño "responsive", y significa que el contenido se adapta al tamaño de la pantalla).
      • Tú decides la temática, el estilo visual y si quieres agregarle animaciones o extras.

      Curso recomendado: Creación de Páginas Web con v0 

      Beneficio exclusivo:

      Por ser estudiante Platzi, si terminas el curso de v0 y nos envías tu certificado a team@platzi.com, recibirás 12 meses de v0 Premium gratis. 

      ¿Cómo compartir mi proyecto?

      1. Publica tu proyecto en la sección de comentarios de esta clase.

      2. Incluye una breve descripción de qué hiciste, por qué y qué lo hace único.

      3. Agrega un link público a tu proyecto para que Platzi y la comunidad puedan verlo y probarlo.

      4. Comparte tu proyecto en redes sociales, con amigos y familia. ¡Cualquier persona puede votar, no necesita suscripción!

      Comentarios

        Javier ivan Patiño Castrillon

        Javier ivan Patiño Castrillon

        student•
        hace 24 días

        OMNISCIENCE — Festival Landing Page

        Quería ir más allá de una página estática. La idea era construir una experiencia: que desde el primer scroll el usuario sintiera que ya está en el festival.

        ¿Qué hice? Construí una landing page completa para un festival de música ficticio con animación de video cuadro a cuadro impulsada por scroll — 150 frames sincronizados con el desplazamiento del usuario, logrando el efecto de que el video "responde" al scroll como si fuera interactivo. Todo sin librerías de animación externas, solo canvas API y JavaScript puro.

        Funcionalidades destacadas:

        • Animación scroll-driven de 150 frames en <canvas> con efecto glitch en el texto del hero
        • Estadio SVG interactivo con zonas clickeables que muestran precios, capacidad y detalles en tiempo real
        • Simulación completa de compra de boletas con modal, selección de cantidad y confirmación
        • Contador regresivo, acordeón de FAQ, formulario de newsletter con validación
        • Efectos visuales: glow del cursor con inercia, tilt 3D en tarjetas, animaciones clip-path, marquee de patrocinadores
        • Pantalla de carga con barra de progreso real mientras se precargan los recursos
        • Desplegado en Vercel con headers de caché optimizados

        ¿Por qué lo hace único? La mayoría de los retos de landing page se quedan en layout + CSS. Aquí el scroll controla el video, el estadio responde al clic, y cada sección tiene una micro-interacción pensada. No es solo una página que se ve bien — es una página que se siente.

        ! Los invito a vivir la experiencia !

          Carlos Harvey Navarro

          Carlos Harvey Navarro

          student•
          hace 23 días

          Esto esta de locos, casi no dejo de ver esa mano jajaja

          Javier ivan Patiño Castrillon

          Javier ivan Patiño Castrillon

          student•
          hace 22 días

          Gracias Carlos! De hecho si quieres replicarlo es sumamente sencillo

          Generas imagen con nano banana 2 luego creas un video con el mismo Gémini y le pides a la ia que convierta el video a frames usando ffmpeg para que se mueva con el scroll de la pantalla.

        Gabriel Adrian Rojas

        Gabriel Adrian Rojas

        student•
        hace 23 días
        •
        editado

        🐉🍥 SILK ROAD 2.0: NARUTO VS WUKONG - La Fusión Definitiva (China + Japón Cyberpunk).

        Creé la landing page del festival "Silk Road 2.0: Neo-Tokyo // Beijing", una experiencia interactiva que fusiona la tecnología de vanguardia china con la estética cyberpunk japonesa.

        Así que metí a NARUTO y WUKONG en un chatbot que pelean por tu atención, escondí las 7 esferas del dragón por toda la página, y agregué efectos visuales que reaccionan a tu scroll como si entraras en "Modo Sabio".

        🤔 ¿Por qué lo hice? Es una experiencia interactiva, cultural y divertida .

        Además, China y Japón son potencias tecnológicas y culturales. Fusionarlas en un evento cyberpunk con personajes que TODOS amamos (Naruto + Viaje al Oeste).

        🛠️ Tecnologías usadas

        • JavaScript puro (sin librerías externas)
        • Canvas API para partículas y clones
        • LocalStorage para guardar tus esferas recolectadas y tu clan
        • Tailwind CSS para el diseño responsive
        • 100% Mobile First.
          Samantha Rod

          Samantha Rod

          student•
          hace 23 días

          bien pero aun puedes mejorar

          Kevin Gualteros

          Kevin Gualteros

          student•
          hace 22 días

          De los que e visto, me parece el mejor, muy interactivo

        Roberto Zuñiga

        Roberto Zuñiga

        student•
        hace 23 días
        •
        editado

        Vibecode Summit Colombia nació de una idea simple:

        ¿puede una landing page de un festival ficticio sentirse como una experiencia real?

        La respuesta está en los detalles.

        Una red neuronal animada en canvas vive detrás de toda la página, conectando secciones como sinapsis. Los speakers responden al cursor con física de magnification inspirada en el dock de macOS. El Centro de Convenciones

        Ágora Bogotá se revela con un wipe cinematográfico sincronizado al scroll. Los sponsors tienen bordes gradient que rotan con animaciones CSS nativas.

        El stack fue una decisión deliberada: Astro 5 estático, GSAP con ScrollTrigger, CSS vanilla y TypeScript. Sin frameworks de UI, sin librerías de componentes, sin templates. Cada animación fue construida desde cero porquequería control total sobre cada milisegundo de movimiento.

        Todo el proceso fue vibe coding puro — pero dirigido con intención. Cada prompt fue una decisión de diseño. Cada iteración refinó algo específico: "más lento", "más profundidad", "que no parezca un footer". El resultado no es código generado, es código curado.

        Lo que más me deja este reto: las herramientas de AI no reemplazan el criterio creativo, lo potencian. La diferencia entre una página genérica y una que se siente viva está en saber exactamente qué pedir y por qué.

        link:

        Sebastián Parra

        Sebastián Parra

        student•
        hace 22 días

        Reto 1 completado — SÍSMICO FESTIVAL

        Para este primer reto construí una landing page para SÍSMICO, un festival de música electrónica underground ambientado en una fábrica de cemento abandonada en las afueras de Bogotá. La idea era que se sintiera como una marca real, no como una plantilla genérica.

        La página incluye hero con countdown en vivo, lineup de artistas, agenda por escenarios, sección de ubicación y compra de tiquetes en tres niveles — todo completamente responsive.

        La construí con v0 de Vercel usando un prompt muy detallado: definí la paleta (negro industrial + naranja lava + teal neón), las fuentes, las animaciones y hasta el comportamiento de cada sección. Lo que más me sorprendió fue qué tan bien quedó el diseño visual y el contador regresivo — le da una urgencia real al evento.

        El detalle que más me enorgullece: escondí un easter egg en la página. No voy a decir dónde. Encuéntralo. 👀

        Herramienta: v0 (Vercel) Stack generado: Next.js + Tailwind CSS + Framer Motion

        ¡ Bienvenidos a vivir la experiencia !

          francy alvarado

          francy alvarado

          student•
          hace 19 días

          Encontré el mensaje :)

        Valentina Arenas Lozano

        Valentina Arenas Lozano

        student•
        hace 21 días
        •
        editado

        Desarrollé esta landing para AI Frontier Festival 2030 pensando en algo que conecta mucho con mi momento actual: llevo tiempo construyendo mi marca personal y me gusta aprender enseñando, además de ayudar a otros a desarrollar su mejor potencial.

        En esta era tan acelerada de la IA, uno de mis mayores retos ha sido mantenerme actualizada y darme cuenta, cada cierto tiempo, de que quizá estaba usando la herramienta equivocada para un caso específico.

        Por eso imaginé este evento como un espacio para reunir avances, herramientas y aprendizaje práctico. Lo que lo hace único es que no diseñé solo una landing visual, sino una base pensada para que en el futuro pueda convertirse en un evento real, incluyendo desde ya una parte administrativa para consolidar registros y prepararme para lo que sé que voy a necesitar después.

        Pagina

          Jhon Jairo Bautista Beltrán

          Jhon Jairo Bautista Beltrán

          student•
          hace 21 días

          Me encanto el diseño

          Angélica Guevara

          Angélica Guevara

          student•
          hace 21 días

          Excelente

        Andres Rafael Tito

        Andres Rafael Tito

        student•
        hace 23 días

        Todos vimos al monito Punch, aferrado a su peluche, mientras los demás monos lo ignoraban y todos sentimos lo mismo, esa mezcla rara de ternura y tristeza que te aprieta el pecho.

        No pude hacer un festival de música genérico después de eso.

        Diseñé "Un Abrazo para Punch" Fest, un festival benéfico para recaudar fondos y llevar a Punch a un santuario donde por fin pueda pertenecer a un lugar amado.

        La landing no solo informa sobre el evento, el evento mismo te hace sentir que tú eres parte del abrazo que Punch nunca recibió.

        Cada detalle fue pensado para eso: colores cálidos como libro ilustrado, el copy escrito desde el corazon, los tickets que se llaman "Abrazo Pequeño", "Abrazo Grande" y "Abrazo Punch", el más especial incluye el peluche naranja de IKEA, el mismo que él carga a todos lados.

        Porque al final, una buena landing page no te vende un evento. Te hace querer estar ahí.

        Y yo quería que quien abriera esta página sintiera exactamente lo que todos sentimos cuando vimos a ese monito por primera vez. 🧸

          Jennifer Lisandra García Orellana

          Jennifer Lisandra García Orellana

          student•
          hace 23 días

          Waow te mandaste aparte que sigo lo de punch me encanto como te quedo la landing page tiene mi like.

          Andres Rafael Tito

          Andres Rafael Tito

          student•
          hace 23 días

          Landing page:

        Carlos Hernández

        Carlos Hernández

        student•
        hace 23 días

        Neo-Mictlán: El banquete entre dos mundos

        Creé Neo-Mictlán, una landing page para un festival gastronómico ficticio inspirado en el Día de Muertos, con una estética futurista, inmersiva y elegante. Quise ir más allá de una página informativa y construir una experiencia visual con identidad, atmósfera y microinteracciones que se sintiera memorable desde el primer scroll.

        ✨ ¿Qué hice?

        • 🎬 Hero cinematográfico con animaciones de entrada y countdown funcional
        • 🍂 Efectos atmosféricos con pétalos, glow y ambientación visual
        • 🍽️ 3 experiencias gastronómicas con identidad propia
        • 📍 Ubicación interactiva tipo radar con puntos explorables y modal
        • 🎟️ Sistema de tickets con flujo de reserva dentro de la landing
        • 📱 Diseño responsive para móvil y desktop
        • ♿ Mejoras de accesibilidad y base SEO técnica

        🔥 ¿Qué lo hace único?

        Busqué combinar storytelling, dirección de arte e interactividad en una propuesta con identidad latina fuerte, para que no se sintiera como una landing genérica sino como una experiencia con personalidad propia.

        🔗 Demo: 

        Si les gusta la propuesta, los invito a visitarla y, si les parece que merece el apoyo, ayudarme con su voto.

        Hero Neo-Mictlán
          Miguel Angel Otero Otero

          Miguel Angel Otero Otero

          student•
          hace 21 días

          felicitaciones que gran proyecto👍

          Alejandro M.

          Alejandro M.

          student•
          hace 21 días

          Excelente proyecto

        Charles Castillo Rosas

        Charles Castillo Rosas

        student•
        hace 16 días

        🌮 SABOR CALLEJERO FEST 2026

        Quería hacer algo más que una página bonita. La idea era transmitir una sensación: que desde el primer segundo sientas el calor, el ruido y la energía de la calle.

        ¿Qué hice? Construí una landing page completa para un festival ficticio de comida callejera, enfocada en diseño visual, estructura tipo producto real y experiencia de usuario responsive. La página está pensada para que funcione igual de bien en celular que en desktop, manteniendo siempre claridad y ritmo visual.

        Funcionalidades

        • Hero impactante con imagen de comida callejera y call-to-action directo a compra de tickets
        • Sección de lineup organizada en tarjetas (comida + música) para facilitar exploración visual
        • Sistema de tickets con 3 niveles (General, Fast Pass y VIP) diseñado como planes reales
        • Galería visual con enfoque en ambiente, comida y cultura urbana
        • FAQ en acordeón para mejorar la experiencia del usuario
        • Diseño completamente responsive (mobile-first)

        ¿Qué lo hace único?

        Más que una landing page común, aquí busqué que se sienta como una marca real.

        Cada sección está pensada para guiar al usuario: primero atraer con lo visual, luego mostrar valor (lineup), y finalmente convertir (tickets).

        🔥 Los invito a verlo:

        👉 🌮 Sabor Callejero Fest 2026

        👉 Repositorio de Github

        👉 Mis notas 💚

          Judith Morillo

          Judith Morillo

          student•
          hace 16 días

          ¡Que gran idea! Estoy segura que será un éxito. ¡Felicidades! 🙌🏻

          Erika lizet

          Erika lizet

          student•
          hace 16 días

          🎉🎉🎉

        Deisy Dayana Zambrano Soto

        Deisy Dayana Zambrano Soto

        student•
        hace 23 días

        ## NEUROBYTE // FUTURE FEST 2042

        Una landing page que no solo muestra el futuro — te lo hace sentir.

        ### Qué construimos

        Una experiencia web inmersiva para un festival ficticio donde la robótica, la inteligencia artificial y la música electrónica colisionan en Bogotá, 2042. No es solo una página de evento: es una declaración visual de lo que puede ser el diseño web cuando se trata como dirección de arte cinematográfica.

        --

        ### Por qué lo hicimos así

        Queríamos romper con el patrón típico de "bloques apilados" que domina las landing pages. Cada sección respira con intención editorial: el hero te golpea con escala y movimiento, la agenda se presenta como un layout de revista premium, y los tickets abandonan las columnas genéricas para convertirse en boletos físicos con stub lateral, código de barras y numeración — diseñados para que quieras imprimirlos.

        ---

        ### Qué lo hace único

        • Imágenes generadas por IA que construyen un mundo visual cohesivo y realista
        • Texto con efecto glitch en el título principal que evoca interferencia digital
        • Mini-juego oculto de caza de drones — un easter egg jugable que premia la exploración
        • Cursor interactivo con trail luminoso que sigue al usuario por toda la página
        • Partículas flotantes y animaciones de entrada cinematográficas por sección
        • Contadores animados que cobran vida al cargar
          David Leonardo Dallos Parra

          David Leonardo Dallos Parra

          student•
          hace 22 días

          Muuuy top 🚀🚀🚀🛸

          Mateo Orozco Lotero

          Mateo Orozco Lotero

          student•
          hace 22 días

          Con toda Dei

        Marcos Ferreira

        Marcos Ferreira

        student•
        hace 21 días

        AI Apocalypse Fest El festival en donde las IAs celebran haber llegado a la AGI

        La Inteligencia Artificial llegó a un punto en el cual se mejora a si misma y rebasa a toda la humanidad en expertise así que lo primero que decidieron hacer es celebrar, un ultimo festejo de agradecimiento con la humanidad antes de reemplazarla.

        Para crear el AI Apocalypse Fest las herramientas que use fueron v0, NextJs, Stitch, Nano Banana Pro 2 En Flow.

        Inicié con un crea una landing page para este evento ficticio. Think Hard Make no mistakes como siempre.

        El resultado no fue nada visually appealing y super genérico, por lo que recurri a mejores herramientas como el Redesign de Stitch que usa Nano Banana Pro 2 para crear renders de UI alucinantes, pero no tan fáciles de implementar por lo cual tuve que implementar los componentes por secciones usando v0. Luego en Antigravity con su browser subagent le pase la captura y le pedí que haga un plan ajustar la UI para que quede tal cual la captura. Itera varias veces automaticamente y arregla sus errores. Para el fondo animado y fondos estilo glitched usé Google Flow y Fal AI con Flux para lograr ese estilo leal a lo que quería para poder tener esos fondos glitched especificos. Y por ultimo ffmpeg para optimizar las imagenes ffmpeg para mejorar cargas y tiempos.

        Pueden probar registrarse, usar el Konami Code para Full Access  ↑ ↑ ↓ ↓ ← → ← → B A Espero que les gusté y cualquier consejo les leo

        Juan Camilo Silva Muñoz

        Juan Camilo Silva Muñoz

        student•
        hace 23 días
        •
        editado

        🏆 SPORTS TECH & AI STARTUP CHALLENGE

        El deporte mueve $600 billones de dolares anuales, pero se sigue gestionando en Excel. Construí la landing page para el evento que va a cambiar eso: un Web Summit masivo para startups de inteligencia artificial aplicada al deporte. 🌐⚽

        🛠️ ¿Qué construí? (Features clave):

        • 📊 Hero Inmersivo: Un dashboard vivo en lugar de una foto de stock. Radar chart animado en Recharts que cicla datos de rendimiento atlético en tiempo real.
        • 🌌 Fondo Generativo: Mesh gradient cyberpunk con blobs flotantes y grid pattern, creado 100% con CSS puro sin librerías externas.
        • 🎫 Modales Funcionales (shadcn/ui):
          • Checkout de tickets con pre-selección inteligente del plan elegido.
          • Directorio de alojamientos partner.
        • 🚀 Formulario Multi-step: Un flujo de aplicación para startups de 3 pasos con validación inline, barra de progreso y animaciones fluidas con Framer Motion.

        🧠 ¿Cómo lo hice? (Mi AI Vibe-Coding Stack): Orquesté herramientas específicas para cada etapa del desarrollo:

        • 📚 NotebookLM: Research profundo de la industria y creación de los copies.
        • 📐 Perplexity (Claude Sonnet 4.6 Y Gemini 3.1 pro): Diseño de la arquitectura y prompt engineering avanzado (usando el framework oficial de Vercel).
        • 💻 v0 (Vercel): Generación y refinamiento de código (Next.js, Tailwind, React).
        • 🎨 Gemini Nano Banana: Creación del collage visual para presentar el proyecto.

        👉 Vívelo en vivo aquí:

        🔥Si te gustó ¡deja tu voto/like! ⭐

        Pablo Junior Sierra Montaño

        Pablo Junior Sierra Montaño

        student•
        hace 23 días

        PIXEL FEST 2026: PRESS START TO FESTIVAL 🍄🎮⭐

        Es una landing page que es un videojuego: mueves a Mario, saltas sobre bloques, recolectas monedas y desbloqueas el festival mientras juegas.

        • ¿Qué es? Un mundo 8-bit jugable donde cada sección del festival — lineup, horarios, tickets, ubicación — vive escondida detrás de una bandera que solo aparece si te mueves a explorarla, con física real, parallax de 3 capas y sprites dibujados píxel a píxel en Canvas.
        • ¿Por qué? Para demostrar que una landing page no tiene que ser leída, tiene que ser jugada; convirtiendo información de un festival en una experiencia de arcade que el usuario quiere terminar, no cerrar.
        • ¿Lo único? Cero scroll. Cero carruseles. Hay modo día y modo noche que cambian la atmósfera al instante, 3 personajes jugables, bloques ? con mensajes secretos del festival que explotan al golpearlos, una cuenta regresiva real al evento y frases gamers que rotan en el cielo cada 10 segundos. Todo funciona con teclado, mouse y pantalla táctil.

        PRESIONA START Y ÚNETE AL JUEGO 🕹️

        PDTA: Fue realizado con Claude Sonnet 4.6, los animo a revisar el código en mi repositorio y realizar sus mejoras, todo feedback y comentario es bienvenido :)

          Byron Agila

          Byron Agila

          student•
          hace 23 días

          Me encanto se ve muy divertida!!

          Byron Agila

          Byron Agila

          student•
          hace 10 días

          Este fue uno de los proyectos que mas me encantaron de todos!!!! tal ves por que conectan con mi nostalgia retro de los 90s pero estuvo muy chevere espero puedas seguir creando igual publicamente fuera y lo puedas utilizar como portafolio , lo unico que le falto es que sea compatible con movil tal ves por eso no cumplio bien con las regras del reto pero a mi encanto!!!

        Nora Azua

        Nora Azua

        student•
        hace 23 días
        •
        editado

        Ruta del Sabor Manabita - Festival de comida típica

        Quise recrear un festival que se suele hacer en mi provincia en el que se celebra lo mejor de la gastronomía manabita: sabores auténticos, recetas ancestrales y la tradición de una de las cocinas más reconocidas del Ecuador. Un espacio donde la cultura, la identidad y el sabor se unen para mostrar al mundo la riqueza de Manabí.

        Si amas la buena comida, este festival es para ti.

        ¡ Te esperamos!

          Edwin Fabricio Guajala Cajiao

          Edwin Fabricio Guajala Cajiao

          student•
          hace 23 días

          Rica comida en la provincia de Manabi, saludos desde Ambato.

          Maikel Andres Vinces Mendoza

          Maikel Andres Vinces Mendoza

          student•
          hace 23 días

          Epa! Tambien esta muy cool! Saludos desde Manta!

        Cesar Andres Urrea Gutierrez

        Cesar Andres Urrea Gutierrez

        student•
        hace 24 días

        ¡Les presento! Therian Summit by Platzi 🫨

        Un evento único en donde podrás ser lo que quieras ser con los mejores speakers del momento.

        No te lo pierdas (guiño guiño)

          Javier ivan Patiño Castrillon

          Javier ivan Patiño Castrillon

          student•
          hace 24 días

          brutal ! felicitaciones buen landing

          Cesar Andres Urrea Gutierrez

          Cesar Andres Urrea Gutierrez

          student•
          hace 23 días

          ¡Muchas gracias!

        Julián Andrés Ramírez Giraldo

        Julián Andrés Ramírez Giraldo

        student•
        hace 19 días

        Back to the Woodstock- Tu Viaje en el Tiempo

        ¿Qué hice?

        Construí una landing page para un festival de "viaje en el tiempo" donde los usuarios pueden viajar a Woodstock 1969. Incluye una sección hero con pixel art animado del festival, un carrusel infinito de las leyendas que tocaron allí (con efecto glitch retro), la ubicación exacta de Max Yasgur's Farm con countdown, y un flujo de compra de tickets que simula enviar al usuario "a través del portal temporal" con animaciones de teletransporte.

        ¿Por qué?

        Woodstock fue más que un concierto, fue un momento que cambió la historia. La idea es hacer sentir a los usuarios que realmente están viajando en el tiempo, como si pudieran estar allí. La estética retro 16-bit con efectos CRT (glitch, scanlines) es el "código temporal" visual que mantiene viva esa atmósfera de 1969, pero con la fluidez y la experiencia que esperas de una web moderna.

        ¿Qué lo hace único?

        • Concepto de viaje temporal: No es solo un sitio sobre Woodstock, es la puerta para *estar* allí
        • Efectos glitch y CRT inmersivos: Cada interacción se siente como si estuvieras "buffeando" a través del tiempo
        • Animación de confirmación épica: Cuando compras un ticket, ves un portal giratorio y mensajes progresivos que confirman tu teletransportación
        • Pixel art cohesivo: Todo el diseño visual mantiene la estética retro sin sacrificar la modernidad
        • Responsivo y accesible: Funciona perfecto en cualquier dispositivo, como si el viaje temporal funcionara desde cualquier lado.
          Alexandra Salcedo

          Alexandra Salcedo

          student•
          hace 19 días

          Muy interesante el concepto…

        Miguel Angel Otero Otero

        Miguel Angel Otero Otero

        student•
        hace 21 días
        •
        editado

        Bienvenido a Gastrolab: Donde la Ciencia se Convierte en Arte

        es una plataforma digital de vanguardia diseñada para el Festival Internacional de Cocina Molecular, un evento de élite que reúne a los visionarios más influyentes del sector gastronómico.

        Gastrolab

        Esta página no es solo un punto de registro; es una inmersión sensorial. A través de una estética sofisticada en tonos vinotinto, negro y plata, la interfaz comunica la exclusividad y la precisión técnica que definen a la alta cocina moderna.

        ¿Qué ofrece esta página?

        • Acceso a los Maestros: Una presentación humana y profesional de las personalidades internacionales que liderarán las ponencias.
        • Experiencia Visual: El uso de fotografía de alta definición que captura la textura, el humo y la alquimia de los platos, eliminando la frialdad de la ciencia para resaltar la pasión del chef.
        • Conversión Fluida: Una estructura optimizada que guía al visitante desde el asombro inicial hasta la reserva de su plaza, garantizando una experiencia de usuario impecable.

        En Gastrolab, el futuro del sabor tiene rostro, técnica y, sobre todo, un diseño a la altura de los paladares más exigentes del mundo.

          Zaida Otero

          Zaida Otero

          student•
          hace 21 días

          Muy interessante 👍

          Tiendashys

          Tiendashys

          student•
          hace 20 días

          Muy buen diseño en la pagina.

        Diego Martinez

        Diego Martinez

        student•
        hace 17 días
        •
        editado

        ANISON SOUNDWAVE 2026!!

        Demo:

        ¿Qué hice?

        Desarrollé Anison Soundwave, una landing page de venta de entradas diseñada específicamente para un festival de música de anime (Anison). El proyecto es de alto rendimiento, construida con un stack moderno que prioriza una interfaz inmersiva, un sistema de selección de tickets fluido y pensado como base de una arquitectura escalable lista para picos de tráfico de usuarios reales.

        ¿Por qué lo hice?

        Me gustan las canciones de anime, son inspiradores, pero no pude poner animes reales por temas de copyright. Quise crear un puente entre la funcionalidad transaccional y la experiencia de un evento temático, demostrando cómo el diseño centrado en el usuario y la optimización de procesos pueden convertir una simple compra en el primer paso de una experiencia memorable para los fans del género.

        ¿Qué lo hace único?

        • Diseño Temático Coherente: Una interfaz que respira la energía del J-Pop y los openings de anime, utilizando componentes visuales dinámicos.
        • Flujo de Usuario Optimizado: Un proceso de compra de "fricción cero", diseñado para ser intuitivo incluso en dispositivos móviles.
        • Considero escenario real donde hay más de un usuario comprando en línea, colocando en una cola de espera para no saturar las entradas.
        • Genera un còdigo QR ue muestra información registrada del evento.
        • Selección de asientos y reserva. (No lo asocié a una base de datos por temas de costos)
        • Visualización fluida en dispositivos móviles.
        Jennifer Lisandra García Orellana

        Jennifer Lisandra García Orellana

        student•
        hace 23 días

        Hola comunidad de Platzi 👋

        Para este reto decidí crear algo diferente: una landing page para un evento futurista de tecnología llamado Quantum Nexus 2026.

        La idea fue simular cómo se vería la página de registro para una conferencia de innovación, inteligencia artificial y creadores del futuro.

        Todo el proyecto fue construido usando Vibe Coding con v0, generando la interfaz mediante prompts y luego refinando el diseño para lograr una experiencia moderna y funcional.

        💡 Qué incluye el proyecto

        Mi landing incluye:

        • Hero section con diseño futurista
        • Agenda del evento
        • Speakers invitados
        • Información del venue
        • Sistema de tickets con diferentes planes
        • Modal de registro para reservar lugar
        • Confirmación visual de registro
        • Diseño responsive (funciona en móvil y desktop)

        ✨ Qué intenté lograr

        Quise crear una experiencia que se sintiera como una landing real de una startup tecnológica, con una estructura clara que guíe al usuario desde descubrir el evento hasta reservar su lugar.

        🔗 Puedes probar el proyecto aquí

        👉 Aquí está el link para explorar la landing:

        Pega tu link aquí:

        Prueba presionar "Reserve Your Spot" para ver la experiencia completa del registro.

        🙌 Feedback

        Agradecería mucho sus comentarios o sugerencias para seguir mejorando.

        Si te gustó el proyecto ¡apóyalo con un ! ❤️🚀

        José Ángel Haro Juárez

        José Ángel Haro Juárez

        student•
        hace 23 días
        •
        editado

        Hola, les comparto mi diseño para la landing page del World Card Tech Fest 2026 🏆⚽, un evento phygital en el Estadio Azteca que revoluciona el clásico intercambio de estampitas del Mundial.

        Prueba la experiencia y cambia de país en vivo aquí:

        La plataforma permite digitalizar tu álbum físico con una app y comprar accesos VIP (Gold, Plata, Bronce) que te garantizan cambiar cartas difíciles como Messi o Mbappé sin caos, todo mientras disfrutas en vivo de bandas como Zoé o Los Bunkers . Para darle el toque especial, armé una interfaz interactiva donde, al elegir la bandera de México, USA o Canadá 🇲🇽🇺🇸🇨🇦, toda la página cambia automáticamente de colores y temática para adaptarse al país anfitrión.

        ¿Qué hice? Armé el diseño y la experiencia (UI/UX) de la landing page para el World Card Tech Fest 2026. Básicamente, es la puerta de entrada a un festival masivo (híbrido: presencial en la explanada del Estadio Azteca y virtual) que lleva el clásico intercambio de estampitas del Mundial a otro nivel. La página no solo vende los accesos, sino que te sumerge en la temática, te presenta la App oficial para digitalizar tus cartas y te arma el plan con el lineup de bandas (Zoé, Fabulosos Cadillacs, Los Bunkers).

        ¿Por qué lo hice? Porque cambiar estampitas a veces es un caos y todos hemos sentido la frustración de buscar a ese jugador que te falta y no encontrarlo. La idea fue "gamificar" la experiencia y darle seguridad al coleccionista.

        • ¿Cómo? Con pases VIP (Gold, Plata o Bronce). Si compras el acceso Gold, tienes garantizado entrar a una zona donde todos traen cartas nivel Messi o Mbappé listas para cambiar.
        • El objetivo: Mezclar la fiebre futbolera con tecnología para asegurar que valga la pena ir, escuchar buena música y completar tu álbum.

        ¿Qué lo hace único? Principalmente dos cosas que rompen el molde:

        • La vibra cambia de país: Como es el primer Mundial en tres países, le metí una función interactiva. Tienes un selector con las banderas y, dependiendo si eliges México, USA o Canadá, toda la página cambia de colores. Es una interfaz que está viva y se adapta.
        • La magia "Phygital" (Físico + Digital): No se trata solo de vender boletos. La página te explica cómo la App usa tu cámara para escanear tus estampas y organizarlas en un álbum virtual, además de incluir un radar para ubicar a jugadores cercanos que quieran intercambio. Ese álbum en tu celular se convierte en tu llave de acceso para los intercambios en el evento físico. Es el mix perfecto entre la nostalgia de abrir un sobrecito y la tecnología de hoy.

        🔗 Link al proyecto:

        Byron Agila

        Byron Agila

        student•
        hace 23 días

        Proyecto: DELPUCTAS.fest

        La landing page del afterparty VIP ficticio de Platzi Conf.

        ¿Qué hice?

        Diseñé y desarrollé una landing page responsive para un festival ficticio con estética cyber-hacker lounge y vibra de underground tech party. La experiencia incluye las secciones principales del evento, como agenda, ubicación y compra de tickets, además de un generador interactivo de pases VIP personalizables.

        Dentro del generador, cada usuario puede:

        • ingresar sus datos,
        • elegir su “clase” de desarrollador,
        • aplicar skins visuales temáticos,
        • y descargar su pase en alta resolución.

        ¿Por qué lo hice?

        Quise llevar la idea de una landing de evento más allá de una página informativa tradicional. En lugar de mostrar solo datos del festival, pensé en crear una experiencia más inmersiva y coleccionable, donde el usuario no solo visita la página, sino que también se lleva un objeto digital propio para compartir.

        ¿Qué lo hace único?

        Lo que hace único a Delpuctas Fest es la combinación entre diseño visual, interacción y personalización:

        • Un pase VIP con interacción reactiva al cursor, que busca transmitir una sensación premium y táctil.
        • Un sistema de skins inspirados en diferentes estéticas tech, como retro 80s, cyberpunk y matrix.
        • Exportación del pase como imagen en alta resolución, lista para compartir en redes.

        Además, toda la experiencia fue diseñada con una identidad visual muy marcada: oscura, tecnológica y pensada para una audiencia creativa y curiosa.

        Nota: Proyecto ficticio, no afiliado oficialmente a Platzi.

        Delpuctas_fest
        Delpuctas_fest
          Byron Agila

          Byron Agila

          student•
          hace 23 días

          Sería delpuctas si me comparten su ID CArd favorita 🚀⚛️

          delpuctasfest_id
          Byron Agila

          Byron Agila

          student•
          hace 23 días
          delpuctas_fest