JOÃO NETO (78 pts)

EDUARDO PERROUD (52 pts)

DEMIS BUCCI (50 pts)

BÁRBARA TOSTES (64 pts)

ALEXANDRE PORTO (1281 pts)

SYDNEY GANHO (60 pts)

MAURO ROCHA TAVARES (40 pts)

SASHA GUDEY (235 pts)

GUILHERME G.G. (137 pts)

DENIS CARAVALHO (85 pts)

IRAPUAN MARTINEZ (45 pts)

RÔMULO NUNES (32 pts)
Treinamento PontoFlash de Flash e ActionScript

Como manipular uma cena de um movieclip?

Como faço um cursor customizado apenas em uma determinada área do site?

Como fazer com que a rotação de um ponteiro demore 10 segundos?

Como crio um controlador de som de play e stop e em loop infinito desse som?

Função chamada createFunctionCall, que permite criar uma função para executar uma outra função com certos parâmetros.

O que é e para que serve o método getBounds()?

Como avaliar se uma variável externa foi carregada por completo, sem usar o evento Data?

Como se usa o "linkage/export this symbol"?

Eu fiz um som e queria que ele só tocasse quando a pessoa passasse o mouse por cima dele.

Tenho um arquivo .exe e gostaria que este ao ser executado, preencha a tela toda em fullscreen.

Tem como abrir um PDF (acrobat reader) entro do Flash? Pode ser com Delphi?

Começando a entender o evento onResize do objeto Stage.

Aumento da velocidade de loops.

Como saber se uma variável externa foi carregada?
MMSave

Editor de banco de dados (PHP-MySql) orientado a Objetos (OOP)

Menu infinito

Objeto Movieclip - Endereçamento (primeira parte)

Calendário dinâmico

Integrando o Flash com Tecnologias Externas.

Loops Alternados (Objeto Sound).

Flash Communication Server MX - Primeira Parte

Local Shared Objects segunda parte.

GuestBook usando integração Flash e PHP.

Jpeg, Gif, texto, gradientes X slices no Fireworks

Cadastro de usuários, com Flash+ASP
Texto esticado

Menu Flash e XML

Cmponente Radio Button

Spectrum Sound Analyzer

HTML edit

Menu cortina

Magnetismo

Bounce

Motion guide

Loading trail

Chinese dragoon

Intro animada
HOME | TUTORIAIS
Dicas para otimizar seu SWF (revisado e atualizado).
por Luís Herrera

Após a lançamento do Flash MX e de comentários/sugestões de outros leitores, chegou a hora de revisar este Artigo. Para facilitar a identificação das mudanças/inclusões, irei incluir o novo texto em AZUL.

A otimização de um filme em Flash é um dos principais pontos a serem levados em conta pelos desenvolvedores. Porém para os iniciantes isso é um pouco difícil ou pior, acaba passando despercebido.

Quem nunca visitou um site e teve a paciência testada? Ficou minutos, vários por sinal, e nada de animação ou quando aparecia era deplorável. Ai se arrependimento matasse? O que eu estou fazendo aqui? Etc....

Isto é o que ocorre quando não estamos preocupados com o usuário e com o resultado completo de nosso trabalho. Não adianta nada fazer um filme igual ao Star Wars e ter um SWF com 2 Megas para Web. Com certeza só os "fissurados" em Flash é que talvez fiquem esperando o carregamento do filme.

Como em geral os arquivos na web são destinados ao maior público possível, e com equipamentos variados é de se esperar que nossas animações estejam ao alcance da maioria dos visitantes, se não da totalidade. Desta forma, você deve tomar muito cuidado com o tamanho (Kb) de seu filme. Como esse assunto não é uma "ciência exata", incluí neste artigo diversas dicas que devem ser observadas e implementadas sempre que possível.

Um tamanho aceitável para um SWF e aceito pela maioria dos desenvolvedores, fica em torno de 60Kb a 100kb. Entretanto isso pode variar em função da aplicação.

Alguns exemplos:

Banners - sua função é chamar a atenção do internauta para alguma coisa, seja produto ou serviço. Sendo assim seu tamanho deve ser pequeno para agilizar o carregamento e não comprometer o desenpenho do site. Um tamanho recomendado pela maioria dos desenvolvedores é de 15 Kb no máximo. Vale lembrar que muitos desenvolvedores estão criando técnicas interessantes de interação com o usuário e a própria página de exibição, com a flexibilidade do Flash.

Menus - o mais indicado são arquivos com menos de 15Kb, isto em função da agilidade necessária ao carregamento. O menu deve ser claro, eficiente e se possível presente em toda a navegação. Quanto maior o uso de ActionScript na elaboração e gerenciamento de um site, tanto MENOR será o tamanho deste MENU, pois o uso de efeitos como SHAPE e Twenning Motin elevam o tamanho do SWF final.

Sites Completos - aqui depende do bom senso. Se você quer atrair visitação, é bom atentar para vários dos itens explicados abaixo e manter seu filme dividido em várias partes de tamanho individual reduzido, podendo ficar em torno de uns 60kb cada.

Animações em Geral - (Charges, Estórias em Quadrinhos, Desenhos, etc...) Essas podem ser um pouco maiores, mas não abuse da paciência de seus visitantes e inclua um carregando...(loading) eficiente em cada filme.

Jogos e Aplicativos - aqui o tamanho não é tão importante, pois os benefícios do mesmo irão validar o trabalho/espera do carregamento.

Nota: Estes são apenas alguns parâmetros para utilização na Web, pois em CD-Rom ou Intranet's isso não será tão importante.

Para reduzir o tamanho de um SWF, existem várias formas que dependem de vários fatores, vejamos:

Dicas:

A) Faça um tratamento das imagens para reduzir seu tamanho, dando preferência ao formato PNG com 75 dpi's no máximo. Isto é o suficiente para visualização nos monitores. Na pior das hipóteses, use o jpg ou jpeg, mas nunca um BMP. Nota: A compactação efetuada pelo próprio Flash não é das melhores. Assim se possuir um programa específico para edição, seja de imagens ou sons, use-o para esse fim e somente depois importe para o Flash.
Nota: Com a versão MX, o Flash integrou o recurso de carregamento dinâmico de Imagens, som e vídeo. Assim é possível reduzir consideravelmente o tamanho de um filme, fazendo uso destes novos recursos. Existem alguns tutoriais sobre isto aqui no Portal Ponto Flash, faça uma busca e melhore o resultado de seu trabalho.


B) Se tiver de incluir algumas imagens no filme, procure usar o menor número possível, pois o tamanho está diretamente relacionado ao conteúdo e recursos empregados. Se puder dê preferência as imagens com dimensões pequenas, e se possível do tamanho exato da necessidade e não dimensioná-las manualmente.


C) Reduza ao máximo o uso de sons. Quando necessário, use o formato MP3 e altere o modo de exportação na biblioteca, para o menor tamanho possível, desde que também não comprometa a qualidade mínima aceitável.

D) Evite sempre que possível o uso de gradientes (degradê). Sendo inevitável, use o menor número de cores que puder.

E) Procure sempre usar as fontes de dispositivos (_sans, _serif e _typewriter) pois não são incorporadas ao filme. Existem novos tipos de fontes desenvolvidas especialmente para o Flash. Elas não causam distorções e podem ser usadas com tamanhos bem pequenos (6, 7 e 8 Pixels).

F) Se estiver usando textos muito grandes, retire-os do filme e inclua-os em arquivos TXT. A importação destes textos para caixas de texto dinâmicas, agiliza o carregamento e reduz muito o tamanho do swf. Perceba que na versão 5 do Flash, é possível incluir formatação HTML dentro destas caixas. Veja em Formatando TXT.
Nota: A versão MX acrescentou uma ótima funcionalidade as caixas de texto dinâmicas, com a possíbilidade de criá-las dinamicamente com formatação padronizada. Isto com um pouco de criatividade, permitirá seu uso de forma semelhante ao CCS (Folhas de Estilo) usadas no HTML.

G) Evite usar Twenning Motion e Shape no filme. Desde que seja possível, troque esses recursos por Action Script que além de mais flexíveis, possibilita uma redução considerável no tamanho do SWF. Você poderá inclusive criar efeitos que interajam com o internauta e não simples animações pré-definidas.

H) Transforme tudo que for usar mais de uma vez no filme, em símbolos (gráficos, MC e Buttons) assim é possível uma grande redução. Não faça dois botões para a mesma coisa (sobe e desce), simplesmente use o mesmo símbolo para representar os sentidos com rotação para cada instância.

I) Procure usar a ferramenta Ímã (Snap to Objects)  para unir todos os pontos de um objeto, pois se estes ficarem separados (abertos) o Flash tem mais trabalho na execução, tendo que fazer vários cálculos desnecessários.

J) Sempre que possível, agrupe os objetos como linhas, preenchimentos, etc...

k) Reduza o número de frames desnecessários no filme.

L) Analise seu código Action Script e se houver duplicações, crie funções para executá-las, principalmente quando houver grande quantidade de comandos. Lembre-se sempre que quanto mais elementos existirem no seu filme, tanto maior seu tamanho será.
Estou montando um curso via e-mail sobre ActionScript para iniciantes. Os interessados em conhecer a metodologia e conteúdo, poderão fazer o download para "Test Driver"
AQUI: Para abrir os arquivos DOC, será necessário o uso da SENHA: AlunoASLH e na próxima tela pressionar o botão SOMENTE LEITURA.

M) Evite usar "Break apart" em imagens ou use com muito cuidado, pois em muitos casos o tamanho do arquivo acaba ficando maior que a imagem original, mesmo que se elimine as partes desnecessárias da imagem. Isto em função principalmente do número de pixels selecionado. Leia a documentação do Flash para saber melhor como usar este recurso.

N) Faça filmes objetivos que tenham ligação direta com o site. Evite usar animações apenas porque tem um efeito "legal". Seja objetivo e use somente o necessário.

O) Evite animar tudo que existe no filme. Movimentos só devem ser usados, nos itens realmente úteis e que precisam chamar muito a atenção ou sejam parte fundamental do contexto de seu site.

P) Faça uma limpeza na biblioteca do Fla, eliminando tudo o que não foi usado no filme e salve o arquivo com outro nome. Depois feche-o, exclua a versão anterior e renomeie o arquivo com o nome anterior. Isto deve ser feito periodicamente e principalmente quando se altera muito um FLA, pois o Flash possui um problema e deixa lixo na biblioteca ocupando espaço inútil no FLA. A conseqüência disto é que em certos casos se reflete no SWF. Eu já constatei esse fato por diversas vezes.

Q) Divida seu filme principal (SWF) em filmes menores (vários SWF) e chame-os somente quando necessário. Isto agiliza o carregamento, diminui o tamanho da animação e só exibe o que o visitante desejar. Isto associado ao novo recurso da versão MX (ITEM A), possibilita uma perfeita manutenção, agilização e redução no tamanho dos seus filmes.

R) Procure otimizar o conteúdo dos objetos e comandos. Muitas vezes se faz algo que após uma breve análise, podemos chegar ao mesmo resultado com um código mais enxuto e eficiente. Isto é conseguido com muito estudo e análise de técnicas de programação.

S) O item acima é válido também para desenhos em objetos. Quanto mais detalhes, maior será o tamanho do SWF. Por exemplo nos sites voltados a estórias em quadrinhos, torna-se necessário um grande trabalho de desenho e pintura para se atingir boa qualidade gráfica, porém as técnicas empregadas podem ou não minimizar o tamanho final do filme.

T) Cuidado com o uso de variáveis. É muito comum para os iniciantes, usar variável para tudo e inclusive incluir diversas variáveis para fazer coisas semelhantes que seriam possíveis com a utilização de uma única. Isto é possível com um maior conhecimento de programação. Sempre que não necessitar usar novamente uma variável, delete-a para reduzir o "consumo" de memória RAM do micro. Um número elevado de variáveis, podem travar o micro. Isto dependerá é claro, da configuração de cada equipamente, recursos disponíveis, consumo da memório por programas rodando simultaneamente na máquina e complexidade de seu filme.

U) O uso de nomes explicativos para variáveis é uma prática "correta", porém devemos tomar cuidado com os excessos. Não use muitas variáveis com nomes grandes (Variável_para_checar_o_numero_de_vezes_que_passamos_aqui). Este exemplo além de totalmente improdutivo é difícil de analisar na janela Action do Flash, além de consumir muito espaço no código aumentando consequentemente o tamanho do filme. Poderíamos fazer assim: npassagens
Nota: Eu já ví coisas assim e várias vezes.

V) Dependendo de cada aplicação, é mais fácil, produtivo, legível e profissional incluir os objetos no filme através de actions do que montar previamente o layout dentro do SWF. Isto também pode reduzir alguns kbs no filme.

W) Quando se faz uso de muitas variáveis (URL, Títulos, Respostas à perguntas, etc...) é mais viável criá-las em arquivos txt e importar para o filme. Isto reduz o tamanho e agiliza o carregamento, como já explicado anteriormente.

X) Se dividir seu filme em vários SWF e precisar usar os mesmos objetos em mais de um swf, faça bibliotecas reutilizáveis que possam ser compartilhadas por todos os swf. Isto também é útil para fontes.

Y) Completando o item (M), o uso de imagens para preechimento de objetos é um recurso útil, mas aumenta consideravelmente o tamanho dos SWF. Uma prática interessante neste caso é reduzir o tamanho da imagens, geralmente usada como textura, antes de importá-la para o FLA. Essa redução deve ser feita de duas formas:

1º) Retirando o peso das imagens (qualidade e resolução) com programas específicos.

2º) Reduzindo as dimensões da mesma, ou seja, se tem 100 x 100 pixels, transforme-a em 50 x 50 pixels. Isto geralmente reduz em 50% o tamanho final do arquivo.

Z) O uso de ActionScript é uma poderosa ferramenta e ainda pouco usada no Flash, principalente pelos designer. A cada nova versão as Actions são incrementadas, permitindo maior e melhor controle sobre o filme, porém como citado em diversos itens acima, não basta conhecer os comandos, propriedades e onde incluí-las, você precisa primeiramente planejar o que seu script fará para depois implementá-lo.

Os mais experientes vão direto escrevendo o código, mas para isto tiveram de treinar e aprender muito e mesmo assim, por vezes tem que refazer, testar e alterar o código até atingir os objetivos.

Z1) A otimização também se aplica aos script do filme, como já relatado acima. Um script mal escrito pode sobrecarregar o processamento da máquina e até aumentar o tamanho do filme.

Z2) Para quem fica em dúvida, os textos escritos como comentários no FLA, não são incluídos no arquivo final SWF, isto porque ele tem por finalidade auxiliar a documentação do código e facilitar sua compreensão posterior.

Chegamos ao fim desta segunda revisão. Espero poder ajudar aos colegas que estejam lendo este texto e fico a disposição para eventuais esclarecimentos.

NOTA FINAL: Caso você tenha alguma nova dica de otimização ou queira complementar as já citadas, favor entrar em contado direto pelo e-mail abaixo.

Acho que você já tem muito trabalho pela frente. O que acha?

Agradecimentos especiais ao TALES, membro da lista PontoFlash que teceu comentários e elogios a este artigo.



Devido à reformulação implementada no site, pode ser que você encontre alguns links quebrados. Por favor, ajude-nos a corrigir eventuais problemas nos informando links quebrados
0 comentário