Las animaciones son un toque fundamental en el diseño web, conseguimos desde impresionar a nuestros visitantes, hasta sacarles una sonrisa y en algunas ocasiones espantarlos si usamos un intro, después del fallecimiento de flash, han surgido muchas propuestas para suplir los vacíos que llenaban nuestros archivos .swf, muchos dicen que aún no contamos con una solución como fue flash, (aunque ahora en sus ultimas versiones flash es capaz de exportar a HTML5), pero existen proyectos muy interesantes que a simple vista son muy prometedores y como pueden darse cuenta en el tema de este artículo uno de esos proyectos es Velocity.js, una inspiración de Julián Shapiro, el cual puede ser implementado con o sin la utilizacion de JQuery, además es compatible con los navegadores actuales, Incluyendo Internet Explorer 8.
Puedes acceder a la descarga desde este link, posteriormente de la descarga tendrás a tu disposición todos los efectos con los que cuenta Velocity, los cuales se dividen en CallOuts y Trancisiones
Veamos a Velocity.js en Acción:
Transiciones:
Para los que ya están familiarizados con JQuery Mobile sabrán la elegancia que brinda una transición dentro de una aplicación web – mobile, básicamente logramos presentar (aparecer) o sacar (desaparecer) información, imágenes o contenido, o de nuestro sitio:
See the Pen Velocity.js – Basics: Values by Julian Shapiro (@julianshapiro) on CodePen.
See the Pen Velocity.js – Option: Easing (jQuery UI) by Julian Shapiro (@julianshapiro) on CodePen.
See the Pen Velocity.js – UI Pack – Stagger by Juan Andres Núñez Charro (@juanwmedia) on CodePen.
See the Pen CallOuts Con VelocityJs by julian andres gonzalez (@belial9826) on CodePen.
Aquí podemos ver un ejemplo de CallOuts personalmente muy elegante esta forma de informar al usuario de un error dentro de un componente del sitio
See the Pen FfLJt by julian andres gonzalez (@belial9826) on CodePen.
Esto es solo un abre bocas de lo que es Velocity.js si desean mas información pueden pasar por el sitio web del creador como también ver la galería oficial de este estupendo plugin.
Byspel