Microinteracciones
que se sienten vivas.
Aprende animación web con demos reales… o ve directo a mi perfil si buscas a un frontend junior con proyectos en producción.
Veintidós efectos, veintidós mini cursos
Pasa el mouse por cada lienzo para verlo en acción. Abre “ver código” para leer el truco. El código de cada demo es HTML, CSS y JavaScript puro, sin frameworks.
Todo se reduce a una idea: lerp
El cursor, la mascota y los seguidores usan la misma fórmula. En vez de saltar al destino, se acercan solo una fracción en cada fotograma. Esa “pereza” es lo que se siente suave y natural.
posicion += (destino - posicion) * 0.15;
La mascota se arma sola
Baja despacio: cada parte del búho vuela a su lugar. Sube y se desarma. Está atado al scroll con anime.js.
El código encuentra su lugar
Símbolos dispersos que, al bajar, se juntan para formar el nombre. Mismo anime.js, atado al scroll.