Un vistazo al proyecto que vamos a desarrollar en el curso a modo de ejemplo. Una web moderna para uno de mis productos que dejaremos bien pulida con animaciones y efectos fluidos.

Antes de empezar a construir, haremos la configuración inicial del proyecto y añadiremos todos los recursos. Además, crearemos una guía de estilo que nos dará fluidez durante el resto del desarrollo.

Con eso tendremos todo listo para empezar a construir.

Empezaremos primero con establecer la estructura base que tiene que tener cualquier proyecto en Webflow para que esté optimizado y bien organizado.

Siempre al iniciar los proyectos empiezo maquetando el navbar y el footer. Aunque más adelante tendremos que modificar algunas cosas, vamos a ir dejando los elementos en su sitio.

Empezamos ya a incluir los elementos de la primera sección de nuestra web.

Seguimos con el proceso de maquetado de elementos de nuestra web. Esta vez, dejamos casi lista la sección de contenido.

En este módulo vamos a experimentar un poco con la función grid para crear nuestras columnas con elementos.

Vamos a dejar lista nuestra marquesina para luego aplicar la animación en bucle.

Dejamos lista una sección con una estructura un poco especial para luego darle un efecto de profundidad al hacer scroll.

Creamos nuestra primera sección conectada a una lista dinámica (CMS).

Dejamos lista nuestra sección de dudas o preguntas frecuentes para luego darle interacción.

Empezaremos a dar movimiento a nuestra web, y a configurar correctamente los cursores.

Así se crea desde cero una interacción para desplegar el contenido de una sección de FAQ.

Nuestra primera scroll animation para darle un toque de profundidad a la sección.

Una solución simple para cuando tenemos dos secciones con mucho contraste de fondo.

Así se crea un banner horizontal infinito con una animación simple de hacer que siempre da un toque de movimiento entre secciones muy estáticas.

Uno de los módulos más complicados y más largos del curso.

Cómo pedir a ChatGPT scripts para animaciones complejas.

Así vamos a añadir la interacción de drag a nuestra sección de Comunidad usando ChatGPT.

Así se integran elementos 3D de Spline en Webflow.

Una animación simple que da una primera impresión brutal a nuestro proyecto.

Veremos cómo seguir dando ese aspecto smooth a nuestra web con algunas de las animaciones predefinidas de Webflow.

Damos un repaso a todos nuestros botones y enlaces para que estén correctamente vinculados.

Así se toca la estructura e información para el SEO de nuestra web, así como la auditoría y optimización de recursos nativa de Webflow.

Te cuento un poco sobre cómo se configura el dominio de producción para cualquier proyecto y tipo de dominio.