Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

T0Z01D3

Tutorial: Como criar um PLAYER DE FLASH (*.swf) com Menu!

6 posts neste tópico

Antes de copiar este tutorial e colocá-lo em seu site, veja o que está escrito no fim do tutorial!


Olhem este Player de Flash com menu e tudo: Clique aqui para visualizar o Exemplo!

Gostaria de ter um igual no seu Site?? Pois é Fácil! Basta seguir este tutorial e saiba como fazer o seu!

Programa necessário: Camtasia Studio

Instale-o e abra o Camtasia Theater (Programa que acompanha o Camtasia Studio) e você irá se deparar com esse tela:

Agora vamos ao que interessa...

Vamos estudar cada parte dessa tela para ficar igual ao meu Exemplo a cima:

 30.gif 1ª Parte - Opções Gerais:

37674-camtasiatheater8-7-2005-14.13.48.gif

Nesta parte da tela, se escolhe as propriedades Gerais (Visuais) do Player e do Menu.

Menu Title: Título do Menu (Que no caso do Emplo acima está se Chama "Tutorial").

Menu title font size: Tamanho da Fonte do Título do Menu (No exemplo a cima é 14).

Menu item font size: Tamanho da Fonte de cada item do Menu (No exemplo é 12).

Menu Alignment: Deseja que o Menu fique à esquerda ou à direita do Vídeo? Left = Esquerda e Right = Direita (No exemplo está na Esquerda).

Play movies in sequence: Se ativado, vai rodando os vídeos na sequência que eles estão no Menu. Assim que acaba de exibir um, ele começa o outro (No Exemplo, está ativado).

 30.gif 2ª Parte - Cores:

37674-camtasiatheater8-7-2005-14.20.26.gif

Nesta parte, escolhe-se as cores de tudo que será exibido. As cores padrões são boas, mas se você quiser personalizar, esteje a vontade.

Movie background: É a cor do fundo do filme, caso ele não preencha a tela toda [se sobrar espaços para cima, para baixo ou para um dos lados].

Menu background: Fundo do Menu. OBS: Lembre-se de colocar uma cor que os itens fiquem legíveis nesse fundo.

Menu title: Título do Menu. Mesma observação que o item anterior.

Item Normal: Cor dos Itens do Menu, sem estar com o mouse em cima. Também siga a mesma observação anterior.

Item rollover: Cor dos Itens do Menu quando o Ponteiro do Mouse está em cima do Item.

 30.gif 3ª Parte - Itens do Menu:

37674-camtasiatheater8-7-2005-14.28.16.gif

Aqui você irá escolher os itens ou vídeos (lembre-se, sempre arquivos *.swf) que ficaram no Menu, para serem exibidos na parte do Vídeo quando clicados.

Coluna Menu item name: Nome que irá ser exibido no Menu. Duplo-Clique para editar.

Coluna Menu item file: Caminho completo para o arquivo no SEU computador.

Agora vamos aos botões:

37674-camtasiatheater8-7-2005-14.31.25.gif Adicionar vídeo (*.swf).

37674-camtasiatheater8-7-2005-14.32.16.gif Move o item selecionado na Tabela ao lado Direto para cima ou para baixo. Deixe na ordem que você deseja que apareça no Menu.

37674-camtasiatheater8-7-2005-14.33.22.gifExclui o item selecionado na tabela à direita.

OBS: O Double-click entries to edit significa Duplo-Clique para editar os itens.

Agora escolha a guia Controls (37674-camtasiatheater8-7-2005-14.35.20.gif) e você irá se deparar com a seguinte tela:

37674-camtasiatheater8-7-2005-14.36.28.gif

Esta Parte serve para Configurar o "Controle" do Vídeo. Controle são os botões de Play, Stop, Pause, etc...

 30.gif 1ª Parte - Propriedades Gerais:

37674-camtasiatheater8-7-2005-14.38.32.gif

Aqui iremos apenas configurar 2 opções, mas que são muito importantes.

Paused at start: Define se o filme só será exibido depois que o botão Play for clicado (Ativado), ou se irá rodar os filmes direto, sem precisar apertar o Play (Desativado).

Movie controller color: Escolhe a cor dos Botões de controle. Eu prefiro a cor padrão, que conbina com o resto da tela, mas se você quizer trocar, basclicar no botão e escolher a cor...

Show About Box: Mostra uma "caixa" de texto, com um informações. Digite ali o que deseja que seja visto nessa "caixa de texto". (Máximo de 8 linhas).

30.gif 2ª Parte - Configuração do Tempo:

37674-camtasiatheater8-7-2005-14.45.22.gif

Aqui iremos ajustar a parte onde é mostrado o tempo decorrido ou o tempo que falta:

Display format: Formato de exibição do Tempo. Eu aconselho HH:MM14.gifS. Lembrando H = Horas, M = Minutos, S = Segundos.

Show elapsed time: Se ativado, mostra o tempo decorrido.

Show duration: Se ativado, mostra a duração do vídeo (*.sfw).

Font: Escolhe o Estilo de Fonte que será usado para exibir o Tempo. Arial é a melhor na minha opnião.

Font Color: Escolhe a Cor da Fonte. Lembre-se colocar algo de acordo com as cores escolhidas acima.

 30.gif 3ª Parte - Opções do Carregamente do Vídeo:

37674-camtasiatheater8-7-2005-14.49.21.gif

Nesta tela, configuramos o "Loading", que é a parte de Carregamento do Vídeo.

Show loading movie: Se ativado, mostra o vídeo sendo carregado.

Match movie size: Ele mostra carregando de acordo com o tamanho do vídeo *.swf (Completamente Recomendado).

Loadinf movie URL: Escolhe o arquivo SWF que irá exibir o vídeo carregando. Se você não tiver nenhuma, deixe a padrão que está boa.

% of main movie to preload: Porcentagem mínima do arquivo SWF que terá que ter sido baixada para que o vídeo SWF começe a ser exibido.

Minumum preload movie display time: É como a opção acima, mas aqui você escolhe por quanto TEMPO deve ter sido baixado... Essas 2 opções trabalham em conjunto.

 30.gif 4ª Parte - Finalização:

37674-camtasiatheater8-7-2005-14.54.45.gif

Clique em Export Flash Menu, escolha aonde quer que ele seja salvo, e pronto!

Ele irá criar vários arquivos dentro de uma pasta. Para visualizar o Player, é só abrir o que tem o nome que você deu ao Player com extensão HTML. Exemplo: nome_do_menu.html

Pronto, seu Player está FEITO!


Alguns Programas Úteis:

Flash Optimizer - Reduza arquivos SWF de 60 a 70% sem perder a qualidade.

 54.gif Magic Swf2Avi - Converte animações em Flash para AVI.

 


Deseja colocar este tutorial em seu site? Leia abaixo!

Fale comigo pelo MSN: [email protected]! Não irei pedir nada em troca não, apenas para colocar a Fonte, o Autor e o Fórum do Babaoo! E para eu saber em quais sites ele está também! Mas por favor, fale comigo antes de colocá-lo em seu site!

 


Autor: T0Z01D3

Direitos Autorais: T0Z01D3


24zdspi.png

0

Compartilhar este post


Link para o post
Compartilhar em outros sites
Data: 8/7/2005

Autor:T0Z01D3

Antes de copiar este tutorial e colocá-lo em seu site, veja o que está escrito no fim do tutorial!


Olhem este Player de Flash com menu e tudo: Clique Aqui Para Abrir O Exemplo

Gostaria de ter um igual no seu Site?? Pois é Fácil! Basta seguir este tutorial e saiba como fazer o seu!

Programa necessário: Camtasia Studio

Instale-o e abra o Camtasia Theater (Programa que acompanha o Camtasia Studio) e você irá se deparar com esse tela:

37674-camtasiatheater8-7-2005-14.09.33.gif

Agora vamos ao que interessa...

Vamos estudar cada parte dessa tela para ficar igual ao meu Exemplo a cima:

 30.gif 1ª Parte - Opções Gerais:

37674-camtasiatheater8-7-2005-14.13.48.gif

Nesta parte da tela, se escolhe as propriedades Gerais (Visuais) do Player e do Menu.

Menu Title: Título do Menu (Que no caso do Emplo acima está se Chama ''Tutorial'').

Menu title font size: Tamanho da Fonte do Título do Menu (No exemplo a cima é 14).

Menu item font size: Tamanho da Fonte de cada item do Menu (No exemplo é 12).

Menu Alignment: Deseja que o Menu fique à esquerda ou à direita do Vídeo? Left = Esquerda e Right = Direita (No exemplo está na Esquerda).

Play movies in sequence: Se ativado, vai rodando os vídeos na sequência que eles estão no Menu. Assim que acaba de exibir um, ele começa o outro (No Exemplo, está ativado).

 30.gif 2ª Parte - Cores:

37674-camtasiatheater8-7-2005-14.20.26.gif

Nesta parte, escolhe-se as cores de tudo que será exibido. As cores padrões são boas, mas se você quiser personalizar, esteje a vontade.

Movie background: É a cor do fundo do filme, caso ele não preencha a tela toda [se sobrar espaços para cima, para baixo ou para um dos lados].

Menu background: Fundo do Menu. OBS: Lembre-se de colocar uma cor que os itens fiquem legíveis nesse fundo.

Menu title: Título do Menu. Mesma observação que o item anterior.

Item Normal: Cor dos Itens do Menu, sem estar com o mouse em cima. Também siga a mesma observação anterior.

Item rollover: Cor dos Itens do Menu quando o Ponteiro do Mouse está em cima do Item.

 30.gif 3ª Parte - Itens do Menu:

37674-camtasiatheater8-7-2005-14.28.16.gif

Aqui você irá escolher os itens ou vídeos (lembre-se, sempre arquivos *.swf) que ficaram no Menu, para serem exibidos na parte do Vídeo quando clicados.

Coluna Menu item name: Nome que irá ser exibido no Menu. Duplo-Clique para editar.

Coluna Menu item file: Caminho completo para o arquivo no SEU computador.

Agora vamos aos botões:

37674-camtasiatheater8-7-2005-14.31.25.gif Adicionar vídeo (*.swf).

37674-camtasiatheater8-7-2005-14.32.16.gif Move o item selecionado na Tabela ao lado Direto para cima ou para baixo. Deixe na ordem que você deseja que apareça no Menu.

37674-camtasiatheater8-7-2005-14.33.22.gifExclui o item selecionado na tabela à direita.

OBS: O Double-click entries to edit significa Duplo-Clique para editar os itens.

Agora escolha a guia Controls (37674-camtasiatheater8-7-2005-14.35.20.gif) e você irá se deparar com a seguinte tela:

37674-camtasiatheater8-7-2005-14.36.28.gif

Esta Parte serve para Configurar o ''Controle'' do Vídeo. Controle são os botões de Play, Stop, Pause, etc...

 30.gif 1ª Parte - Propriedades Gerais:

37674-camtasiatheater8-7-2005-14.38.32.gif

Aqui iremos apenas configurar 2 opções, mas que são muito importantes.

Paused at start: Define se o filme só será exibido depois que o botão Play for clicado (Ativado), ou se irá rodar os filmes direto, sem precisar apertar o Play (Desativado).

Movie controller color: Escolhe a cor dos Botões de controle. Eu prefiro a cor padrão, que conbina com o resto da tela, mas se você quizer trocar, basclicar no botão e escolher a cor...

Show About Box: Mostra uma ''caixa'' de texto, com um informações. Digite ali o que deseja que seja visto nessa ''caixa de texto''. (Máximo de 8 linhas).

  30.gif 2ª Parte - Configuração do Tempo:

37674-camtasiatheater8-7-2005-14.45.22.gif

Aqui iremos ajustar a parte onde é mostrado o tempo decorrido ou o tempo que falta:

Display format: Formato de exibição do Tempo. Eu aconselho HH:MM14.gifS. Lembrando H = Horas, M = Minutos, S = Segundos.

Show elapsed time: Se ativado, mostra o tempo decorrido.

Show duration: Se ativado, mostra a duração do vídeo (*.sfw).

Font: Escolhe o Estilo de Fonte que será usado para exibir o Tempo. Arial é a melhor na minha opnião.

Font Color: Escolhe a Cor da Fonte. Lembre-se colocar algo de acordo com as cores escolhidas acima.

 30.gif 3ª Parte - Opções do Carregamente do Vídeo:

37674-camtasiatheater8-7-2005-14.49.21.gif

Nesta tela, configuramos o ''Loading'', que é a parte de Carregamento do Vídeo.

Show loading movie: Se ativado, mostra o vídeo sendo carregado.

Match movie size: Ele mostra carregando de acordo com o tamanho do vídeo *.swf (Completamente Recomendado).

Loadinf movie URL: Escolhe o arquivo SWF que irá exibir o vídeo carregando. Se você não tiver nenhuma, deixe a padrão que está boa.

% of main movie to preload: Porcentagem mínima do arquivo SWF que terá que ter sido baixada para que o vídeo SWF começe a ser exibido.

Minumum preload movie display time: É como a opção acima, mas aqui você escolhe por quanto TEMPO deve ter sido baixado... Essas 2 opções trabalham em conjunto.

 30.gif 4ª Parte - Finalização:

37674-camtasiatheater8-7-2005-14.54.45.gif

Clique em Export Flash Menu, escolha aonde quer que ele seja salvo, e pronto!

Ele irá criar vários arquivos dentro de uma pasta. Para visualizar o Player, é só abrir o que tem o nome que você deu ao Player com extensão HTML. Exemplo: nome_do_menu.html

Pronto, seu Player está FEITO!


Alguns Programas Úteis:

 54.gif Flash Optimizer - Reduza arquivos SWF de 60 a 70% sem perder a qualidade.

 54.gif Magic Swf2Avi - Converte animações em Flash para AVI.

 


Deseja colocar este tutorial em seu site? Leia abaixo!

Fale comigo pelo MSN: [email protected]! Não irei pedir nada em troca não, apenas para colocar a Fonte, o Autor e o Fórum do Baboo! E para eu saber em quais sites ele está também! Mas por favor, fale comigo antes de colocá-lo em seu site!

 



Autor: T0Z01D3

Direitos Autorais: T0Z01D3

Valeu colega, mas exatamente como disse, realmente a voz não sai totalmente , sempre fica um som baixo no fundo.Mas legal valeu, pela colaboração um abraço.

0

Compartilhar este post


Link para o post
Compartilhar em outros sites

Atualizado4.gif

 56.gif Corrigi o Link do exemplo, porém agora tem só uma Screenshot. Se alguém souber uma hospedagem grátis que tenha FTP que eu possa fazer um UPLOAD de exemplo, me diga por favor. 2.gif

 56.gif Alterei meu e-mail do MSN se alguém quiser colocar o tutorial em seu site.

 54.gif O Programa pode estar com algumas mudanças (Mas se estiver, serão muito poucas mesmo), pois o tutorial é da versão 2.0 do Camtasia, e que agora já está na 3.01, mas visualmente ele está praticamente a mesma coisa. 9.gif


24zdspi.png

0

Compartilhar este post


Link para o post
Compartilhar em outros sites
    • 6 Mensagens
    • 146 Visualizações
    • 2 Mensagens
    • 90 Visualizações
    • 2 Mensagens
    • 174 Visualizações
    • 4 Mensagens
    • 262 Visualizações
    • 4 Mensagens
    • 284 Visualizações