HTML5 - Adobe Edge

Adobe Edge é uma nova ferramenta gráfica de animação e design de interação que permite aos designers produzir conteúdos animados para sites, usando padrões web como HTML5, JavaScript e CSS3.

Ainda em testes, o Adobe Edge será atualizado regularmente para adicionar novas funcionalidades, ficar à frente da evolução dos padrões web, e incorporar o feedback do usuário para oferecer a melhor funcionalidade e experiência possível.

Alguns dos principais recursos já disponíveis nesta versão preliminar do novo Adobe Edge :

Criar novas composições com ferramentas de desenho e texto
Importar e trabalhar com gráficos web nos formatos SVG, PNG, JPG e GIF.
Editar animações na timeline de maneira semelhante ao Flash e AfterEffects
Configurar e animar propriedades como, tamanho, cor, forma e rotação
Adicionar movimento e transições em arquivos HTML existentes preservando a integridade dos layouts baseados em CSS

Exemplo extraído de : http://labs.adobe.com/technologies/edge/resources

CSS e JavaScript gerados automaticamente

<!--Adobe Edge Runtime--> 
<script type="text/javascript" src="edge_includes/jquery-1.4.2.min.js"></script> 
<script type="text/javascript" src="edge_includes/jquery.easing.1.3.js"></script> 
<script type="text/javascript" src="edge_includes/edge.0.1.1.min.js"></script> 
<script type="text/javascript" src="edge_includes/edge.symbol.0.1.1.min.js"></script> 
<script type="text/javascript" charset="utf-8" src="wordAnimation2_edge.js"></script> 
<link rel="stylesheet" href="wordAnimation2_edge.css"/> 
<!--Adobe Edge Runtime End-->

O HTML :-)

 
<div id="stage" class="symbol_stage"> </div>

Conheça mais detalhes, samples, e baixe o novo Adobe Edge :http://labs.adobe.com/technologies/edge/