Antes de nos dedicarmos à nossa primeira animação, o Bouncing Ball, quero primeiro propor um desafio técnico: o texto deverá ser desenhado de forma limpa, como se tivesse sido escrito à mão. O Fig Leaf Rag tem uma bela introdução com destaque no final, onde iremos colocar o ponto de exclamação.
Existem vários métodos, mais ou menos eficazes, dependendo da situação em que nos encontramos. Como trabalho com uma mesa digitalizadora, vou desenhar a tipografia e mostrar como a animação funciona. Mas antes disso, mostrarei como também poderia ser feito, embora não seja minha opção favorita:
Passos 1-10
Passo 1
Quero eliminar a camada de texto e, em vez disso, criar uma camada de composição, uma camada de pixels normal, na qual eu possa pintar. O texto deve estar dentro da camada. Portanto, eu crio uma subcomposição com Ctrl+Shift+C ou em Camada>Criar subcomposição. Chamo isso de "Typo_Intro".
Passo 2
Todos os atributos foram mantidos, incluindo Deslocamento Turbulento.
Como não quero isso, clico em Deslocamento Turbulento, pressiono Ctrl+X e colo tudo em uma composição acima ("Fig Leaf Rag").
Passo 3
Voltamos para a composição "Typo_Intro". Aqui temos o texto exposto e podemos animá-lo.
A primeira opção é através de Trilhas. Pego na Ferramenta Caneta e desenho a primeira linha da letra A no texto. Depois, paro e clico em algum lugar na área preta com a tecla Ctrl pressionada para encerrar o caminho atual, antes de desenhar a segunda linha do A.
Paro novamente, clico na área preta com a tecla Ctrl pressionada e então desenho a próxima linha e assim por diante, até o texto completo ser desenhado.
Passo 4
Agora aplico um efeito. Isso é encontrado como Contorno na versão CC em Gerar. Até o CS6, era chamado Efeito de Traçado.
Selecionamos uma máscara ou marcamos a opção Todas as Máscaras, para que as máscaras sejam desenhadas assim.
Passo 5
Desligo as máscaras com este pequeno ícone e coloco o Caminho em vermelho. Também posso alterar o Tamanho, mas apenas globalmente para todas as máscaras.
E quando ligo as máscaras novamente, posso mover e ajustar os pontos individualmente, de modo a cobrir todo o texto branco por baixo.
Passo 6
O bom disso é que tenho um controle deslizante de Início e Fim aqui: Arrasto do início ao fim e consigo desenhar todo o texto assim.
Isso funciona muito bem, mas não se tem um controle preciso. Por exemplo, é necessário utilizar sempre a mesma espessura de traço, ou seja, não dá para variar entre fino e grosso.
Portanto, gostaria de mostrar ainda um outro método que, na minha opinião, é um pouco mais rápido do que desenhar tudo individualmente…
Passo 7
Neste caso, prefiro o método um pouco mais rápido com o Pincel.
No entanto, esse Pincel não pode ser aplicado em camadas de texto. Então, teremos que novamente criar uma subcomposição e nomeá-la "Typo_Estático". Podemos trabalhar diretamente nesta subcomposição.
Passo 8
Quando queremos usar o Pincel e clicamos duas vezes no Modo Pincel, a guia de camadas é aberta e só aí podemos trabalhar com o Pincel.
Também surgiram dois novos painéis: Pincel e Pintura. No painel Pincel, podemos ajustar o tamanho, dureza, etc. do pincel.
E no painel Pintura, podemos selecionar o tipo de pintura. Inicialmente, está definido como constante, mas eu altero para Animação de Pintura.
Faço um traço e outro e mais um - mas estranhamente, uma vez que termino um traço, ele desaparece.
Passo 9
Quando volto para a outra guia e ando ao longo da linha do tempo, vejo que todas as linhas estão lá e são desenhadas automaticamente.
Passo 10
Se pressionar UU para todas as propriedades alteradas, teremos muitas subpropriedades listadas abaixo.
Para cada uma, também são exibidos o início e o fim.
Além disso, podemos alterar a distância, dureza e até a posição de cada linha - mesmo depois de desenhar.
Continuar: Passos 11–20
Passo 11
Vou apagar tudo novamente para termos mais visibilidade.
Vou desenhar uma nova linha e quando estiver na visualização em camadas, você verá o caminho. Isto é o que é salvo.
Se por acaso não gostar da linha desenhada, posso redesenhá-la selecionando-a e simplesmente desenhando novamente. Isso será atualizado e sobrescrito facilmente.
Passo 12
Também quero recriar o texto, pois é a maneira mais rápida de animar algo assim.
Portanto, vou diminuir meu diâmetro um pouco e com a mesa digitalizadora, vou redesenhar o texto aqui.
Passo 13
Desenhei todas as linhas e se reproduzirmos tudo na linha do tempo, veremos que tudo está presente.
Se pressionar U, teremos todos os keyframes de volta.
Passo 14
Se eu pressionar a tecla Ü, a janela sobre a qual o mouse está passando será maximizada. Neste caso, a linha do tempo. Assim, tenho mais espaço e posso identificar melhor os elementos que se destacam. Eu os recuo um pouco para que todos durem aproximadamente o mesmo tempo.
Passo 15
Vamos reproduzir isso.
Aliás, se por acaso pressionou acidentalmente a tecla Caps Lock, o After Effects não será atualizado. Neste caso, você receberá a mensagem Desativar Caps Lock para atualizar a visualização.
Ao reproduzirmos agora, o After Effects começa a desenhar todas as letras ao mesmo tempo. Mas deve começar na frente e seguir para trás. E é exatamente aí que está o problema. Para fazer do jeito que quero, teria que cronometrar tudo manualmente - uma linha de cada vez. Isso dá muito trabalho. Gostaria de fazer isso mais rápido.
No próximo passo, explicarei como - mas antes disso, vamos selecionar todas as linhas.
Passo 16
Por isso, uso um script que define esses keyframes sequencialmente.
Esse script fui eu quem escreveu e, é claro, incluí para vocês. Vocês o encontrarão na pasta Scripts com o nome Sequence strokes. Quem conhece o filme "Sequenzaebenen from After Effects" pode ter uma ideia do que o script faz.
Abro o script no Extend Script e o executo.
Passo 17
Agora temos uma espécie de escada de keyframes e o texto é desenhado passo a passo. No entanto, ainda muito lentamente.
Precisamos acelerar isso. Para isso, selecionamos tudo, pegamos o último keyframe encontrado, pressionamos a tecla Alt e arrastamos para 5 segundos.
Aí vai ser bem mais rápido.
O último ponto precisa ser um pouco mais atrasado, mas vamos cuidar disso em breve.
Passo 18
Gostaria de falar sobre o valor de offset. Isso afeta as transições de keyframes:
Se olharmos as transições de keyframes atuais, o próximo sempre começa exatamente onde o anterior termina (a).
Se eu não quiser isso e, por exemplo, prefiro ter uma pausa de dois frames entre dois traços, então eu digito 2 em offset.
Claro, preciso selecionar todos os pincéis novamente antes de ativar o script. Com Ctrl+A, posso selecionar todos de uma vez.
Ou se eu quiser que os frames se sobreponham, então eu coloco o valor -2 em offset. Assim, ele sempre voltará dois frames atrás do original. No entanto, se tivermos reduzido a velocidade tão rapidamente como aqui, não faz sentido. Estou satisfeito com 2.
Passo 19
O que definitivamente quero mudar é o timing do ponto de exclamação. Gostaria de ajustá-lo melhor à música.
Por isso, também preciso da música na composição. Então eu vou para o guia "Fig Leaf Rag" e copio o arquivo.
Depois, se necessário, volto para a composição com um clique Alt-e insiro aqui.
Passo 20
Agora vamos ver onde estão as duas posições que precisamos. Para isso, uso o Num-Pad e pressiono a tecla de vírgula para criar uma visualização. Pressiono a tecla asterisco * no Num-Pad para adicionar um marcador. Em dispositivos sem Num-Pad, especialmente no Mac, seriam cmd+vírgula para visualização e cmd+8 para o marcador.
Agora deixo a música tocar e coloco os marcadores exatamente onde o traço e o ponto do ponto de exclamação devem aparecer (1). Ou seja, exatamente nos dois acentos da melodia.
Então, defini dois marcadores: no primeiro, o traço do ponto de exclamação deve estar pronto e no segundo, o ponto deve ser definido.
Coloco a linha auxiliar no primeiro marcador e mudo para a composição "Typo_Statisch". Lá eu movo o frame para a linha auxiliar que indica a linha do ponto de exclamação (2).
Faço o mesmo com o segundo marcador, que indica a posição do ponto: coloco a linha auxiliar no marcador, vou para a composição e movo o frame de acordo.
Os últimos passos
Passo 21
Gostaria que o traço do ponto de exclamação fosse desenhado mais lentamente do que a fonte anterior, para enfatizarmos isso mais no ponto de exclamação (1).
E a fonte deve ser concluída um pouco mais rapidamente no geral. Portanto, seleciono tudo antes (2) e movo um pouco para frente (3).
Assim, o timing é perfeito.
Passo 22
Nós desenhamos a fonte sobre o texto e agora vamos fazer mais algumas alterações.
Primeiro duplico a camada "Typo_Statisch" e removo o efeito de pintura na camada inferior.
Passo 23
Na camada superior temos o texto desenhado com o original branco por baixo.
Na camada inferior temos o texto branco normal.
Se marcarmos a caixa de Pintar transparência na camada superior, apenas os traços vermelhos desenhados permanecerão visíveis.
Passo 24
A camada superior deve ser usada como máscara para a inferior.
Se a máscara não estiver visível, basta clicar em Ativar/Desativar modos de mistura na parte inferior, então a máscara de movimento BewMas será exibida.
Então posso selecionar uma máscara alpha e obter exatamente o resultado que preciso. Ou seja, onde esses traços são desenhados, minha fonte original também será visível.
No entanto, algo está deslocado, porque logo no início já tem o A.
Passo 25
Então, é melhor selecionar novamente todos os pincéis com uma seleção de retângulo de baixo para cima (1) e depois excluir os dois frames do ponto de exclamação com a seleção Shift (2). Eles já estão perfeitamente posicionados no tempo.
Em seguida, movo o primeiro frame um pouco para a direita, para que o A não seja visível bem no início.
Agora está tudo certo.
Passo 26
Fizemos isso na subcomposição, aqui ainda temos o efeito de Turbulência.
Se analisarmos isso tudo nesta composição, não só é em amarelo e a cor muda, mas também balança.
Passo 27
Está maravilhoso e perfeito, mas a cor só deve mudar depois, ou melhor, não mudar no momento. Portanto, por enquanto, Alterar Cores fica desativado.
Assim, terminamos os primeiros 4 segundos do trailer e nos encontraremos novamente na próxima parte do tutorial, com a bola quicando.