Treinamento e Consultoria em Midia Impressa e Digital
www.dualpixel.com.br | contato@dualpixel.com.br
Animação para iPad
R...
Treinamento e Consultoria em Midia Impressa e Digital
www.dualpixel.com.br | contato@dualpixel.com.br
PASSO 3 - com o efei...
Treinamento e Consultoria em Midia Impressa e Digital
www.dualpixel.com.br | contato@dualpixel.com.br
PASSO 5 - Use o util...
Próximos SlideShares
Carregando em…5
×

Crie animações em HTML5 para Adobe DPS com InDesign e Wallaby

467 visualizações

Publicada em

Tutorial sobre a produção de objetos animados a partir do Adobe InDesign, com posterior conversão do arquivo .FLA gerado no InDesign para HTML5 através do utilitário Wallaby.

Para baixar o Wallaby acesse o link http://bit.ly/dps-anima.

Publicada em: Educação
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
467
No SlideShare
0
A partir de incorporações
0
Número de incorporações
3
Ações
Compartilhamentos
0
Downloads
5
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Crie animações em HTML5 para Adobe DPS com InDesign e Wallaby

  1. 1. Treinamento e Consultoria em Midia Impressa e Digital www.dualpixel.com.br | contato@dualpixel.com.br Animação para iPad Recurso indicado para vnhetas e animações simples. Não suporta ActionScript PASSO 1 - crie o elemento que voce deseja animar na página. PASSO 2 - escolha o tipo de animação. De preferência para animações de deslocamento, que fazem o objeto entrar e/ou sair da página. treinamento
  2. 2. Treinamento e Consultoria em Midia Impressa e Digital www.dualpixel.com.br | contato@dualpixel.com.br PASSO 3 - com o efeito de animação aplicado no objeto, crie um novo documento com as mesmas dimensões do objeto animado. Nomeie este arquivo como vinheta.indd, por exemplo. ATENÇÃO - crie uma subpasta nesta seção do projeto para salvar este novo arquivo do InDesign e osdemais queserão criados. Mantenha o mesmo nome em todos eles. PASSO 4 - Exporte o arquivo vinheta.indd para o formato Flash. Escolhe o Menu File > Export > opção de formato FLA. Nomeie este arquivo como vinheta.fla (mantenha o mesmo nome do InDesign). Altere a opção de Text para Convert to Outlines
  3. 3. Treinamento e Consultoria em Midia Impressa e Digital www.dualpixel.com.br | contato@dualpixel.com.br PASSO 5 - Use o utilitário Wallaby (beta) para convertar de Flash para HTML5. Salve este arquivo no mesmo diretorio do InDesign e com o mesmo nome. Neste caso, vinheta.html Vários arquivos são criados da conversãode Flash para HTML5 como voce pode notar na figura acima. Abra o arquivo vinheta.html num browser compativel com HTML5 (Safari, Firefox 5, Chrome, IE9) para atestar que animação está funcionando. NOTA - o resulta deste processo é uma animação em looping, como voce pode notar no browser. Para corrigir esta falha será preciso editar o arquivo .CSS. PASSO 6 - Abra o arquivo vinheta.css no Dreamweaver (ou outro editor de html) e através do comando Find/Change altere o parâmetro Infinite para 1.

×