Ideias que
conectam pessoas
Saiba mais sobre a evolução das animações na web

Saiba mais sobre a evolução das animações na web

A era pós Flash na web era basicamente livre de animações. Atualmente, com as especificações de CSS Animations e bibliotecas Javascript realmente interessantes e eficientes, é hora das coisas mudarem novamente.

O PASSADO

Entre os anos 90 e até meados dos anos 2000, boa parte da web era dominada por animações em Flash. Porém, quando Steve Jobs anunciou, em 2010, que o iOS não suportaria Flash, as animações começaram a desaparecer da web e tudo se tornou mais estático. Acontece que o mundo real não é estático e são as animações que tornam o mundo digital mais intuitivo e interessante.

post-ana-02

 

O PRESENTE

Apesar de conseguirmos muitas coisas com CSS Animations, existem ainda grandes limitações. Animações simples e sem interação com o usuário (uma animação de carregamento de página ou uma troca de cor no :hover, por exemplo) podem facilmente ser conseguidas com CSS. Animações mais complexas, com lógicas que envolvem diferentes ações, dependendo da interação do usuário: ou exigem centenas de linhas de código CSS ou simplesmente não podem ser feitas sem Javascript.

Existe opção, felizmente! A biblioteca Green Sock Animations Platform – GSAP foi desenvolvida com Javascript puro e é livre e de código aberto. Com GSAP é possível fazer todas as animações que são possíveis com CSS Animations e, adicionalmente, controlar estados, interações de usuário, sequências, pausas, repetições, etc. GSAP ainda oferece suporte a navegadores antigos e não possui dependências com outras bibliotecas (jQuery, por exemplo), o que garante uma performance incrível.

O FUTURO

O W3C está trabalhando nas especificações da Web Animations API com o objetivo de fornecer uma interface única para animações CSS e SVG. O objetivo é facilitar as coisas através de Javascript, trazendo melhor performance, maior controle sobre interações e estados da animação. A API, no entanto, ainda tem pouco suporte por parte dos navegadores (no momento, somente Chrome e Opera).

Para quem já quer entrar no futuro, é possível utilizar um Polyfill para garantir suporte a todos os navegadores. O Polyfill para Web Animations API, porém, não oferece uma boa performance, ficando bem atrás da GSAP, que permanece a opção mais completa, concisa e rápida no momento.

Ana Paula Locatelli

Graduada em Ciência da Computação pela UFRGS, web developer e apaixonada por corujas. Curiosa, é pesquisadora nata de assuntos diversos e, apesar de programadora, não possui - nem de longe - o estereótipo nerd.

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *