Tutorial Adobe Flash CS5: Criando aplicativos para iPhone e iPod

O lançamento do pacote CS5 da Adobe está previsto para Abril desse ano, mas muitas das novidades do Photoshop CS5 e do Flash CS5 já foram anunciadas extensivamente pela Adobe em congressos e outros eventos. No caso do Flash CS5 o meu interesse é focado para as minhas atividades acadêmicas, pois ministro aulas de multimídia na web que usam a tecnologia do Flash como base para levar animação 3d para web usando classes personalizadas. Por exemplo, com o uso do Papervision 3D é possível trabalhar com sistemas e interfaces totalmente 3d na web usando o Flash Player como base, o que permite distribuir o seu projeto para uma base de usuários incrível.

Entre as novidades do Flash CS5 está o suporte nativo ao desenvolvimento de aplicativos para o iPhone e iPod, permitindo que os artistas e desenvolvedores passem a distribuir seus projetos usando o iTunes da Apple. Isso é excelente para maximizar o potencial de retorno financeiro para web designers e desenvolvedores que não tinham opção senão procurar clientes e empresas, para desenvolver web sites em Flash.

Como funciona essa integração? Caso você já tenha alguma experiência com classes personalizadas do Flash ou ActionSctipt, encontrei um tutorial que mostra de maneira bem simples como funciona essa integração com o iPhone OS. O tutorial de Flash CS5 mostra como aproveitar o acelerômetro do iPhone para criar aplicativos. É um tutorial em vídeo bem curto e que deve elucidar diversas dúvidas.

tutorial-adobe-flash-cs5-aplicativos-iphone.jpg

O ponto negativo para quem quiser começar a trabalhar com esse tipo de desenvolvimento é que será necessário ao menos, adquirir um iPod ou iPhone para realizar testes. Caso contrário os aplicativos criados com o Flash CS5 não podem ser avaliados. As diferenças nos projetos envolvendo o iPhone OS são relacionadas com classes especiais e o tamanho da tela que deve seguir o padrão do dispositivo. Já estou planejando e estudando os tutoriais e guias lançados pela Adobe para adicionar esse tipo de conteúdo nas minhas aulas durante esse semestre.

Esse tipo de material deve ajudar as pessoas interessadas em começar a trabalhar com aplicativos nesse modelo. Mais novidades devem ser divulgadas até Abril quando diversos softwares da Adobe devem ser atualizados para a versão CS5.

Simulações físicas em 3d na web com Papervision e Jiglibflash

Os projetos que envolvem o uso de animações 3d na web sempre foram um grande desafio para a maioria dos artistas, pois envolvia o uso de tecnologias especializadas em mostrar apenas vídeos ou vetores 2d. Esse problema era resolvido com o uso de vídeos incorporados em web sites criados em Flash, que acabavam mostrando o 3d, mas por outro lado carregavam significativamente o tamanho dos arquivos usados no web site. Desde que o Flash passou a usar o ActionScript 3, o número de módulos e classes personalizadas cresceu significativamente e possibilitou o surgimento de projetos como o Papervision 3d.

Só o uso do Papervision 3d com o Flash já permite a criação de web sites vetoriais de maneira muito semelhante ao que fazemos em softwares como o Blender 3D e 3ds Max. Ainda é possível adicionar um pouco mais de complexidade ao Flash com classes especializadas em física, como é o caso do JiglibFlash. Para termos uma idéia mais clara do que é possível fazer com a união dessas duas classes, os objetos 3d criados no Papervision podem participar de simulações como Rigid Bodies!

Se você quiser aprender os procedimentos necessários para criar uma animação usando Papervision 3d e JiglibFlash, simulando Rigid Bodies, visite o endereçoi indicado.

aninacao-3d-flash-papervision-jiglibflash

No web site é possível encontrar as instruções para criar uma cena com diversos cubos que sofrem ação da gravidade, como qualquer outra simulação de Rigid Body. Assim que os cubos colidem uns com os outros, as reações baseadas em massa entram em ação criando uma animação totalmente automática. O melhor de tudo é que o processo inteiro está armazenado em um arquivo vetorial bem pequeno.

Esse é um assunto interessante para artistas que gostariam de expandir seus projetos para a internet, pois o processo é muito semelhante a um jogo. É necessário aprender um pouco de programação e se adaptar as nuances do Flash e do próprio Papervision, mas garanto que o resultado dessas animações aplicadas em qualquer portfólio faz o profissional ter portas abertas na maioria das agências envolvidas com web.

Sempre que posso abordo o uso do Papervision 3D nas minhas aulas de desenvolvimento multimídia para web, mas infelizmente a carga horária acaba sendo curta para avançar na criação de aplicativos 3d para web.

Demonstração do Adobe Flash CS5: Codinome Viper

Para os que gostaram do vídeo mostrando algumas das novidades do Photoshop CS5, mais um vídeo publicado na web no final do mês passado, mostra algumas das novidades do que virá a ser o Flash CS5. O vídeo foi gravado por um usuário do Flash que visitou a conferência Flash on the Beach 2009, realizada no final de setembro. Mesmo tendo sido gravado usando um celular, podemos acompanhar várias das novidades para a próxima versão do Flash no curto período em que uma pessoa da Adobe faz a demonstração.

O Flash é uma aplicação extremamente importanta para quem está interessado em trabalhar com 3d para web, usando classes personalizadas como o Papervision 3d. Ele funciona muito bem com o Blender 3D, produzindo modelos 3d no formato COLLADA e criando interfaces 3d com o Papervision no Flash. Bem, vamos aos vídeos:

Logo no início do vídeo o apresentador mostra algumas das novidades do Flash em termos de interface, com um enorme painel de opções para formatação de texto no stage. Para as pessoas que precisam trabalhar com grandes documentos de texto na web, isso será uma excelente adição. Mas, o principal fica para depois que é a interação e desenvolvimento usando ActionScript.

Apesar de ser conhecida como uma ferramenta para designers, ficando o Flex voltado para programadores, muitas pessoas acabam escolhendo o Flash para criar aplicativos multimídia, pois a interface gráfica para ilustração e desenho, deixa o processo criativo mais interativo. Um dos problemas disso é que a ferramenta se torna mais voltada para design do que desenvolvimento. A conseqüência disso é a ausência das facilidades de um framework para criar aplicativos mais complexos no Flash de maneira rápida.

A primeira ferramenta demonstrada no vídeo é uma espécie de template que pode ser criado e adicionado em aplicativos, para acelerar o desenvolvimento de jogos e outros elementos. Logo depois, podemos visualizar algo realmente útil, que é a declaração de classes personalizadas com a opção de autocompletar.

Outra coisa interessante no Flash CS5 é a integração com o Flash Builder, que é a versão atualizada do que antigamente se chamada Flex Builder. Isso é demonstrado próximo do final no primeiro vídeo, em que um bloco inteiro de código é enviado para o Flash Builder. Assim podemos usar um aplicativo especializado em códigos para o ActionScript e o Flash apenas para o design.

Os vídeos ainda mostram apenas alguns dos novos recursos do Flash CS5, mas já podemos ter uma boa idéia do que está por vir em abril de 2010, quando a suíte CS5 deve ser lançada.

Usando SourceBinder para criar 3D interativo para web com Papervision 3D

Os profissionais que trabalham com computação gráfica 3d acabam direcionando a sua atuação profissional para a área publicitária, ou produção de conteúdo visual para cinema e TV. Mas, ainda existe um campo vasto e praticamente inexplorado para artistas 3d que é a internet. A produção de conteúdo 3d para internet ainda está apenas começando e pode apresentar diversas oportunidades em termos de projetos e criação. O Blender 3d até tentou se estabelecer como plataforma de criação 3d para a web com o seu plugin que permitia executar conteúdo 3d, diretamente no navegador. Mas, a aposta na tecnologia acabou levando a NaN a falência, pois ainda era cedo para basear a sua produção nesse tipo de tecnologia. Isso já tem mais de dez anos!

Hoje o cenário em termos tecnológicos e velocidade de banda na internet são completamente diferentes e um dos grandes responsáveis pela disseminação da web 3d é o Flash Player. Já existem diversas bibliotecas de classes e ferramentas que permitem criar conteúdo 3D compatível com o ambiente do Flash Player, que está presente em praticamente todos os computadores com acesso a internet. Um desses módulos mais famosos é o Papervision 3D que é um conjunto de classes personalizadas, capaz de manipular objetos em 3D e até mesmo animar modelos complexos modelados no Blender 3D ou outro software capaz de exportar objetos no formato COLLADA.

Nesse semestre, comecei a ministrar aulas sobre o Papervision para criação de conteúdo 3D para web integrado em aplicativos multimídia. No curso foi possível perceber um dos principais problemas relacionados ao Papervision que é o conhecimento e configuração das classes. Se você quiser fazer um teste com um ambiente de configuração visual do Papervision, recomendo consultar o SourceBinder que trabalha com um sistema de nós para configurar bibliotecas externas para o Flash. O software é capaz de fazer animações e simulações usando diversas bibliotecas para web, inclusive com simulações físicas!

Quer ver um exemplo? O vídeo abaixo mostra o software criando um ambiente 3d que simula o comportamento de Rigid Bodies com a aplicação do Papervision 3D e do JiglibFlash. O resultado é um ambiente interativo que é semelhante a um jogo 3d, mas que pode ser associado a qualquer navegador que suporte o Flash Player.

Physics made with SourceBinder using JiglibFlash and Papervision from Balazs Serenyi on Vimeo.

Quem conhece o funcionamento de um sistema baseado em nós, vai encontrar muita facilidade em usar o SourceBinder. Todo o processo de criação é visual e não requer conhecimentos em programação ou ActionScript para aplicar os comportamentos nos objetos.

No vídeo é possível acompanhar a criação de um pequeno muro formado por vários cubos. Esses cubos recebem propriedades de Rigid Body para reagir com colisões e também com a gravidade. No final do vídeo podemos acompanhar a criação de um objeto de maior massa, que acaba deslocando todos os objetos no cenário.

Para quem ainda está com dúvidas sobre a área de atuação no mercado de computação gráfica 3d, esse é um excelente caminho a seguir.

Adobe Flash Catalyst: Crie interface interativas de arquivos PSD, AI e PNG

Para qualquer artista envolvido com a criação de conteúdos ou apresentações para a internet, um dos maiores desafios é mesclar a sua formação direcionada com as artes visuais e o ambiente técnico e cheio de códigos da web. Sempre que ministro cursos sobre o Flash ou ActionScript percebo isso de maneira bem evidente, pois quando o público do curso é formado por pessoas interessadas na parte visual, o ActionScript fica meio de lado e quando o público é de desenvolvedores, a parte visual dos aplicativos sempre deixa a desejar. A Adobe está tentando minimizar essas diferenças para o lado dos artistas com o lançamento do Adobe Flash Catalyst. Esse é um aplicativo ainda em estágio beta no Adobe Labs que tem como objetivo criar interfaces para internet, sem o uso de nenhum tipo de código.

O processo de criação no Flash Catalyst funciona com base na importação de arquivos produzidos no Photoshop, Illustrator ou Fireworks. Assim que os arquivos são importados é possível converter os mesmos para elementos interativos como botões. O vídeo abaixo mostra uma demonstração do software em ação:

Se você produz material gráfico e gostaria de testar o Catalyst para criar apresentações, o software pode ser copiado de maneira gratuita no web site da Adobe, enquanto ainda estiver em fase beta. O apelo de criar apresentações interativas sem a necessidade de usar uma linha de código é muito interessante para artistas, que não tenham interesse em estudar linguagens de programação. Para promover o uso do software, existe um treinamento gratuito sobre o Adobe Catalyst disponível nesse endereço, ainda que seja básico é uma ótima introdução ao software.

Essa opção não é tecnicamente a melhor escolha, pois softwares que criam esse tipo de comportamento de maneira automática geralmente adicionam muitos blocos de código desnecessários ao aplicativo.

Ainda acredito que a melhor solução, pelo menos para quem precisa apresentar material em 3d é usar engines 3d para o Flash, caso o trabalho seja apresentado na web. Entre as diversas opções de engines 3d a que mais me agrada é o Papervision 3D, que é totalmente gratuito e de pode criar efeitos muito interessantes para apresentar interfaces e modelos 3d direto no navegador. O ponto negativo do Papervision 3D é que você precisa de conhecimentos intermediários em ActionScript para conseguir elaborar alguma interface interativa em 3D.