Transiciones y animaciones creativas en CSS

Aprende a dar vida a tus interfaces web con transiciones y animaciones en CSS de forma práctica y visual. Este libro te guía desde los fundamentos de las transformaciones y transiciones básicas hasta la creación de efectos creativos sobre botones, imágenes, filtros y componentes HTML, para que puedas construir experiencias más atractivas, fluidas y modernas.

A lo largo de sus capítulos también explorarás animaciones más completas, proyectos experimentales con HTML, CSS y JavaScript, y técnicas de rendimiento que te ayudarán a lograr animaciones suaves y eficientes, incluyendo aceleración por hardware y optimización para 60 FPS. Es una guía ideal si quieres dejar atrás los estilos estáticos y empezar a crear interfaces con más personalidad e impacto visual.

Capítulo 1 - Transiciones y transformaciones básicas: En este capítulo vamos a dar un repaso a las transformaciones geométricas, traslaciones y animaciones en CSS.

Capítulo 2 - Transiciones y traslaciones sobre botones: En este capítulo, vamos a crear multitud de ejemplos de transiciones en CSS aplicados a botones, en estos ejemplos aplicaremos principalmente transformaciones geométricas, pero también trabajaremos con otras propiedades de CSS.

Capítulo 3 - Transiciones y traslaciones sobre imágenes: En este capítulo, vamos a presentar diferentes ejemplos de efectos en CSS con el evento hover; es decir, seguiremos utilizando las transiciones de CSS como se realizó en el anterior capítulo; para estos ejemplos, usaremos cualquier clase de estructura HTML que no serán botones como en el capítulo anterior.

Capítulo 4 - Efectos variados con CSS, transiciones y filtros: En este capítulo, crearemos efectos variados utilizando las transiciones, también, veremos sus limitantes mediante varios ejemplos que analizaremos en el siguiente capítulo utilizando las animaciones para lograr animaciones más completas.

Capítulo 5 - Animaciones creativas: En este capítulo, presentaremos el uso de las animaciones, basado en ejemplos, iremos viendo sus posibles variantes, configuraciones y ejemplos utilizando animaciones y transiciones por igual.

Capítulo 6 - Proyectos HTML, CSS y JavaScript: En este capítulo, vamos a crear varios experimentos usando HTML, CSS y JavaScript.

Capítulo 7 - Aceleración por Hardware y Rendimiento en Animaciones CSS: En este capítulo es imprescindible para desarrolladores front-end, aprenderás el secreto de la aceleración por hardware. Descubrirás cómo pasar del código ineficiente que devora la CPU a animaciones fluidas a 60 FPS delegadas directamente en la GPU.