Guião da Animação

Cena 1 - Botão para clicar que ira pa cena seguinte e ganhar um iphone.
 
Cena 2 - Introdução a animação com musica e botões.
 
Cena 3 - A acção principal onde aparece a maquina e as teclas são carregadas.
 
Cena 4 - A maquina vai para baixo e escreve Quem sou eu? entretanto esta fogem.
 
Cena 5 - A frase volta a aparecer e pensa entretanto as Bolhas de pensamento transformao-se nao iniciais correspondestes aos trabalhos. A barafunda das letras.
 
Cena 6 - Os botões para ir para as cenas correspondestes aos meus trabalhos.
 
Cena Som - Onde se pode ouvir o meu trabalho de som
Cena Vídeo - Onde se pode ver o vídeo.
 
Cena Imagem - Onde se pode ver o meu trabalho de imagem
 
Creditos - Ficha técnica da animação.
 
Fim - Fim da animação. 

Tutoriais para animação

Motion”, “rotation”, “scale”, “color”, “shape” “tweening” e “motion guide"

 

Botões

 



Bones
Texto Animado

 
 Cursor animado

 
Outros :


Animação Flash

  • Introdução
Neste 3º e último período do ano lectivo trabalhamos com "flash", com a intenção de criarmos uma animação, e o que vou apresentar é o meu trabalho desta unidade.
O principal programa para realizar este trabalho foi o “Adobe Flash” (https://www.adobe.com/cfusion/tdrc/index.cfm?product=flash&promoid=EBYEX), um programa em que se pode fazer animações. No entanto para fazer algumas coisas também usamos outros programas em que já trabalhamos anteriormente, o "Photoshop" (manipulação de imagem) e o "Audacity" (manipulação de som). A animação teria de ter obrigatoriamente "motion", "rotation", "scale", "color", "shape tween", "motion guide", efeitos, texto e o mínimo de 3 botões.
Após de nós terem iniciado na unidade, procedemos a criação de umas pequenas animações de teste.
Estas animações tinham como objectivo ensinar como inserir as seguintes técnicas “Motion”, “rotation”, “scale”, “color”, “shape” “tweening” e “motion guide” no "flash". Escrevemos num bloco de notas como chegar a estas técnicas para depois nós servir de cábula caso tivéssemos dúvidas.


  • Protótipo
Após a conclusão destas animações procedemos a escolha de um tema no qual iríamos trabalhar no flash como a assinatura ou os cartazes realizados na 2 unidade.
Decidi então fazer o trabalho com base na minha assinatura.
Depois de pensar em várias maneiras em como realizar o trabalho, a professorar aconselhou-me a usar a ideia de uma máquina de escrever que escrevia " quem sou eu", então decidi pesquisar máquinas de escrever para usar como base. Durante a minha pesquisa encontrei este vídeo que serviu como inspiração para a realização da animação (http://www.youtube.com/watch?v=nJ_0Xw7o-7A).
Então depois de ter ganho inspiração procedi a procura de imagens de máquinas para depois usar o “Photoshop” para isolar as teclas para então usar "scale" e "motion tween" para dar a impressão que a teclas estavam a ser pressionadas.
As teclas que isolei foram Q, E, M, U, S, O.
Ao fim de isolar estas teclas, inseri-as no "flash" por cima da imagem da máquina original para poder atingir o efeito anteriormente referido, na cena seguinte fiz com que a máquina fosse mais para baixo para dar a impressão de que tinha papel e, procurando na Internet encontrei um tutorial de como aplicar no texto uma mascara para assim produzir o efeito de como se uma maquina de escrever tratasse.
Supostamente o meu trabalho estaria completo mas revendo melhor apercebi-me que o poderia melhorar e acrescentar mais coisas.
Usando uma animação de um aluno do ano anterior decidi então aplicar como extras, botões no qual iriam demonstrar os meus trabalhos anteriormente realizados nomeadamente Vídeo, Imagem, “Blog” e Som.
Então na cena 3, fiz com que o texto “Quem sou eu? ” desaparecesse usando um efeito de transição e uma “motion guide” para fazer com que o texto mova-se para o fundo da página onde começa a pensar em quem serei eu. Entretanto na última bolha de pensamento aparece a minha assinatura para assim dar uma pequena ideia de quem se trata. A seguir a bolhas de pensamento transformam-se nas iniciais correspondentes as unidade (ex. a primeira bolha transforma-se num B de blog) onde depois se irá pode carregar para então poder ver os meus trabalhos.
Então um colega de turma sugeriu que desenha-se todas as letras (escrever não daria pois não se pode usar uma “motion shape” em texto) e fazendo uma brincadeira com elas onde elas aparecem de todos os lados criando assim uma confusão de letras. Aceitando a sugestão decidi aplicar a ideia numa só letra para demonstrar o que ali se ia passar. Como o tempo era breve terminou aqui o meu Protótipo.



  • Final
Após a terminação do protótipo comecei imediatamente a trabalhar no final aproveitando o protótipo.
Então acabei a cena das letras no qual tinha anteriormente falado onde apliquei nas letras várias técnicas como “rotation”, “scale”, “color”, “shape” “tweening” e “motion guide". Depois foi só converter as palavras em botões para cada um demonstrar os meus trabalhos realizados (ex clicar no blog leva-nos até ao meu Blog, clicar no vídeo leva-nos ao vídeo etc.). Após ter feito os botões foi só criar as cenas correspondentes e lá colocar os trabalhos.
Coloquei também, nessas cenas 2 botões para repetir e para retroceder, no caso da cena do som acrescentei ainda um botão para "Play" e outro para "Stop". Depois de ter concluído acrescentei um fundo para ficar mais bonito e agradável.
Por fim então criei um botão no início para assim iniciar a animação. O meu botão foi baseado no seguinte tutorial (http://www.flashwebtraining.com/tutoriais/basicos/botao_animado/01.php) onde substitui o rato pela minha assinatura e o background com a imagem de uma biblioteca pois assim tem mais a ver comigo próprio. Acrescentei ainda um texto onde se pode ler “Carrega-me para ganhares um Iphone” não só para gozar com as várias publicidades que se encontra na Internet mas assim inserir um pouco mais de piada no trabalho.
Em seguida criei uma pequena introdução ao trabalho para assim ficar mais um bocado completo.
Nessa introdução inseri como funda a assinatura juntamente com uma espécie de moldura igual a que nas cenas anteriores inseri para simples propósitos cosméticos.
Após feito a introdução, realizei então os créditos onde inseri uma simples ficha técnica do trabalho. Aqui nesta cena, inseri “fade in’s” e “fade out’s” para assim ter mais técnicas.
Pus também uma pequena conclusão antes dos créditos para no caso as pessoas ainda não saberem quem eu sou.

Eis o resultado final
 

  • Lista de efeitos
    Técnicas e extras.
    Motion tween - 1º cena na assinatura
    as letras na segunda cena a dizer quem sou eu
    maquina a ir para baixo na 5 cena
    Algumas das letras na 6 cena.
    Rotation - cena 6 nas letras
    color - na cena 6 letras e fade in, fade out
    Shape - nas letras da cena 6
    motion guide - nas cenas 6 e 5 nas palavras quem sou eu
    Motion presets -  transition na cena 5 no quem sou eu
    Botões - na cena 1, 7 e nas cenas em relação aos extrasassim como no
    Extras - Som vídeo e imagem dos trabalhos anteriores.
    Sons - assinatura na cena som e musicas de entrada e  inicio e fim
    créditos 
    • Bibliografia 
                                               
                                             Músicas

    The cat attached to rust – Guilty Gear Isuka Ost (http://www.youtube.com/watch?v=qZ0tUeVvj00)
    Knife Fight – Lemon Demon (http://www.youtube.com/watch?v=bZ6f5r64F-I)
    Stardust Memories – BlazBlue Ost (http://www.youtube.com/watch?v=G_nWKy-sSlw)
    Benni Hill Theme (http://www.youtube.com/watch?v=MK6TXMsvgQg)

                                             Vídeos

    http://www.youtube.com/watch?v=nJ_0Xw7o-7A

    Imagens






                                           Programas
    Flash 5 (https://www.adobe.com/cfusion/tdrc/index.cfm?product=flash&promoid=EBYEX)
    Flash 8 (por ser “portable” o que eu usei é me impossível arranjar links e aqui postar)

                                                Sons   
    Maquina de escrever (http://www.freesound.org/samplesViewSingle.php?id=118591)
    Rodar (http://www.soundjay.com/communication/typewriter-paper-roll-up-1.wav)
    • Conclusão
    Apesar de ser o trabalho mais exaustivo foi também o que mais gostei, embora o trabalho final tem uns ou outros erros no qual eu intenciono resolver.
    Em geral gostei muito do trabalho e de trabalhar e espero que me sirva de base para os meus trabalhos para o futuro

    Cabula para técnicas

    Aqui posto a "cabula" que me ajudou a lembrar como aplicar as técnicas

    Motion Tween
    Criar um objecto, depois de o ter criado, cria-se dois “keyframes”, o primeiro na 1º frame para fazer o começo do movimento e o 2º na ultima “frame” onde o movimento acaba, depois de fazer os “keyframes” e movimentos, carrega-se, sobre um espaço livre entre o começo e o fim com o botão direito do rato onde se quer que haja o movimento, e clicar em “Motion Tween” para assim criar movimento.


    Shape + Color Tween
    Criar dois “keyframes”, no primeiro cria-se uma forma desejada, no último desenha-se uma forma e escolhe se a cor que deseja-mos que apareça no fim, depois de realizado estes passos clica-se na “layer” onde se encontra situado a “shape” e coloca-se o cursor entre o principio e o fim da “timeline” correspondente a “shape” e depois com o botão direito do rato clicar sobre “Create Shape Tween”.


    Motion Guide
    Na “layer”, onde se quer que haja movimento, clicar com o botão direito do rato em “Add Motion Guide”, esta opção ira criar uma nova “layer”, sobre a esta “layer” adjacente á outra, desenha-se com a ferramenta “lápis” o movimento desejado (ex: espiral), a começar no meio da imagem ou “shape” até ao fim, onde se deve posicionar o meio da imagem na parte final da trajectória. Depois com o botão direito do rato, sobre a “layer” onde foi criado o movimento clicar em “Create Classic Motion”. Depois para fazer com que que a linha correspondente ao movimento desapareça mas ainda haja movimento, basta apenas ocultar a “layer” do movimento.


    Transf (Rotation + Scale)
    Cria-se duas “keyframes”, na primeira desenha-se um objecto no momento inicial, e na última depois de ter ocorrido uma transformação depois de feito estes passos basta clicar com o botão direito do rato sobre a parte da layer onde ocorre a transformação, e carregar em “Create”, “Shape Tween”.



    Botão
    Para realizar um botão, é necessário em primeiro fazer um objecto como um quadrado por exemplo e algo escrito como botão. Depois temos de seleccionar tudo, e clicar em “Covert to Symbol” e no tipo de símbolo carregar em “Button”. A seguir temos de ir às “Actions” da layer e escolher a opção “Global Functions”, “Timeline Control” e “stop”. A seguir fazemos duplo clique no botão que criamos e mudamos as definições em “Up”, “Over”, “Down”, “Hit”. Depois disso vamos a Actions do Botão criado, e escolhemos as opções “Global Functions", "Movie Clip Control", "on" e "release", a seguir fazemos um enter. Depois disso basta colocar onde o botão direcciona. Seleccionamos “Global Functions", “Timeline Control”, "gotoAndPlay" e escolher cena e frame, após escolher o botão já fica configurado. Ficando por exemplo: on (release) { gotoAndPlay("Scene 2",1);