Introdução às expressões do After Effects para iniciantes

1. Introdução: Aqui está o acordo. Aprendi muito depois de graças e animação com alguns grandes designers, animadores e ilustradores, aqui no Skillshare ou no YouTube ou onde quer que tenha encontrado os recursos disponíveis. E dentro desses tutoriais e recursos, é claro, se depararam com expressões After Effects. E eu sei o quão poderosos eles podem ser mais frequentemente do que não, eu descobri que esses grandes animadores e designers que aprenderam uma tonelada de expressões de tweets como bicos mágicos. E há, claro, razões para isso, uma vez que a expressão é tão fortemente baseada na programação, nem todo animador é também um programador. Portanto, este desapego da profissão é uma das razões. Portanto, na maior parte, tudo o que eu aprendo com esses tutoriais é que, hey, aqui está a expressão, copie-a, cola-a aqui. E isso é o que ele faz, como ele faz, realmente não importa. E honestamente, na maior parte, não acontece. Você é capaz de criar belas animações copiando e colando algumas expressões de sua coleção. E é isso. Mas essa mentalidade e fluxo de trabalho perpetuam fazendo com que cada nova geração de animadores tratem expressões como feitiços mágicos e nada mais. Mas, claro, ambos sabemos que expressões não são feitiços mágicos. Eles são lindos. Eles são um dos mais belos fóruns de código para mim. E muitas vezes há um debate sobre qual linguagem de programação ou alguém você faz programação. Hughes e eu acreditamos muito. As expressões After Effects são a melhor maneira de introduzir um pouco a sua programação, principalmente porque é visual. Você não tem que criar e carregar em torno de um modelo mental em sua cabeça, você pode ver as coisas mudar e se mover na tela enquanto você digita. E esse elemento visual torna muito mais fácil absorver os conceitos de programação. Mas eu divago, esta aula é sobre espreitar atrás das cortinas e entender como expressões realmente funcionam para que você não só pode ter uma biblioteca de expressões, mas também entender como cada uma delas funciona. E quando você entende que você pode fazer suas próprias expressões e também twittar as que você encontra on-line para atender o trabalho de expressão, como você realmente gostaria. Além dos benefícios de saber como as expressões funcionam, a pura alegria de entender algo que não tem sido Elian para você é verdadeiramente satisfatória. E esse é o meu, um dos principais objetivos desta classe para remover o misticismo que envolve expressões After Effects, expressões são baseadas na linguagem de programação JavaScript. Se você tem alguma experiência anterior com programação depois sair limpo e dizer que você vai encontrar um grande pedaço desta classe, super chato porque eu vou ensinar tudo do zero, tudo do zero, tudo, desde os fundamentos, e tudo desde o básico. Chega de falar comigo, vamos começar a ensinar. 2. Antes de começar: Está bem. Se esta é sua primeira vez ouvindo sobre expressões After Effects, me dê seus dois minutos ou um minuto, mas definitivamente menos de dois para lhe dar a idéia muito básica do que as expressões After Effects são a maneira mais básica ou dominante de animar algo no After Effects. Como por keyframe propriedades, você quer algo de posição para mudar. Você entra na propriedade position em transformação, você adiciona um quadro-chave. Você segue em frente no tempo e você sabe, mudar a posição do que você estava animando e bam, lá está a animação. Quando eu animar e outra propriedade entrar na propriedade, Digamos rotação, adicionar um quadro-chave, mover evento no tempo, diminuir o valor ou aumentar o valor. Isso é outro quadro-chave. E lá vai você. Há outra animação, os deuses depois dos efeitos posteriores. Isto poderia ter sido. Sim, lá vai você. Isso é praticamente tudo. Use propriedades e quadros-chave e faça coisas legais. Sim. Mas não, eles nos deram expressões e devemos ser muito, muito gratos por isso. As expressões permitem montar e animar todas as propriedades do quadro-chave ou em massa. Agora, as expressões que você monta é essencialmente escrever código. E nesta aula vamos fazer sentido antes de prosseguir com o resto da turma. As duas únicas coisas que precisas de saber é este número 1. Para adicionar uma expressão a uma propriedade, você Opção mais clique no Mac ou Alt mais clique no Windows neste ícone de cronômetro que é apresentado ao lado de um nome de propriedades. Então, lá vai você. É assim que se começa a escrever e a expressão. A segunda coisa que você precisa saber é que qualquer camada de texto na tela tem uma propriedade text e source text que armazena os dados que a camada de texto está segurando. Por exemplo, essa camada de texto está segurando a camada de texto de dados e esse texto é armazenado dentro da propriedade text source. Se eu mudar o valor para algo como o meu nome, Os dados são agora o meu nome, e estes são os dados que a camada de texto de origem está segurando. Certo, com isso, estamos prontos para mergulhar. 3. Variáveis: Ok, então eu acabei de animar o After Effects e vamos começar com a primeira lição desta aula. Agora, em vez disso, você está super familiarizado com esta interface ou isso é tudo território apenas desconhecido para você. Não importa quando você acende o After Effects e fecha esse diálogo que aparece, você verá dois quadrados no centro, nova composição e sua composição de filmagens. O que você quer fazer é clicar na nova composição. Você pode dar qualquer nome que você quiser no campo nome da composição aqui, ele geralmente é preenchido com calma seguido por um número para nós como um calmo e que está bem com aqueles agora. Você pode alterar a largura e a altura da composição aqui que deseja. Se você estiver tendo problemas para ajustar a largura e a altura, verifique se a proporção de bloqueio está desmarcada. Vou dar-lhe 2000. Até 2000. Vai fazer a taxa de quadros de 24 quadros por segundo e a duração de 5 segundos, ok? E eu também vou dar-lhe uma cor de fundo de preto. Tudo bem, então todas essas configurações, realmente importa quando você está fazendo algo para, digamos Instagram ou um vídeo diferente do Vimeo ou do YouTube. Mas por enquanto, eu sou essa lição e essa composição, será usada apenas para contar ou TDD algumas coisas para você. Então, todas essas configurações não importam. E, além disso, se eu clicar em OK, essas configurações não são definidas em pedra. Posso sempre pressionar Command K no Mac ou Control mais K e Windows para exibir as configurações novamente. E posso mudar as coisas conforme necessário. Ok, agora temos uma composição, agora o centro, e esta é a interface, esta é a interface do After Effects. O seu será mais ou menos parecido com este. Mas, de qualquer forma, vou explicar cada painel ou cada coisa com que interagimos. Então o nosso descanso é fácil e vamos começar. Uma outra coisa que eu queria mencionar é que isso me confundiu um pouco algumas vezes. Este botão está bem aqui? Se você não está vendo esta cor preta, se você está dizendo algo assim, você quer clicar sobre ele para alternar a transparência, ok, para este, certifique-se de que o preto é visível. Agora a primeira coisa que eu quero fazer é adicionar algum texto na tela para que eu possa selecionar a ferramenta de texto aqui clicando aqui, ou usar o atalho Comando T para abrir a ferramenta de texto, em seguida, clicar em qualquer lugar e começar a digitar. Eu só vou escrever um texto, ok, e eu posso sair do modo de edição. Vou clicar na ferramenta Seleção, e aí está você. Agora posso selecionar o texto e movê-lo. A próxima coisa que eu queria fazer é vir aqui na linha do tempo e selecionar esta camada que diz algum texto. E eu vou pressionar Enter e renomear esta camada para depurar camada, já que não vamos usar esta camada para animação, mas apenas usá-lo para mostrar como nossas expressões está funcionando. Além do nome da camada, você verá a divisa apontando para a direita ou esta seta para a direita. E você pode clicar nele novamente para desdobrar um monte de diferentes propriedades animatable. Tudo bem, mas a única coisa com que estamos preocupados nesta lição, nesta propriedade chamada texto fonte, que está aninhado dentro do texto. Agora, aqui está a parte legal. Se eu acredito que você já sabe sobre isso. Se você sabe ruim, mesmo um pouco sobre expressões aftereffect que no Mac você pode segurar Option e clicar neste ícone de cronômetro ou segurar Alt no Windows e clicar e abrir as cristas editor de expressões bem aqui. Ok? E a primeira coisa que eu quero fazer aqui antes de começarmos a escrever qualquer expressão é ir para o After Effects e depois preferências. E a partir das preferências, selecione scripts e expressões, ok? E isso é mais uma preferência pessoal, mas eu só queria colocá-lo lá fora porque por padrão o tamanho da fonte é 12 e há um tema diferente selecionado. Assim, você pode aumentar o tamanho da fonte para 14 e, em seguida, escolher efeitos secundários, alto contraste para o tema. E isso torna as expressões muito mais legíveis do que você estava digitando. Tudo bem, vamos chegar aqui. Não precisamos do que há. Vou apagar tudo, está bem? E o que eu vou fazer é apertar esta tecla para adicionar aspas e, em seguida, digitar Olá mundo vírgula e, em seguida, fechar isso com outra aspas. Agora, se eu clicar lá fora, você pode ver que este texto aparece bem aqui. Você acabou de escrever sua primeira expressão, ou espero que tenha feito. Se você está seguindo agora, algumas coisas importantes. Número um, você notará que as aspas que digitamos aqui não são visíveis no texto aqui. Então, que diabos? Vamos remover as aspas, certo? Porque não há realmente servindo qualquer propósito. Então eu vou me livrar dele, mas encontrar algum erro. Ok, vamos ver o quão ruim nós apenas removemos o mundo vírgula e apenas, vamos apenas escrever olá. Que tal isso? Ainda assim, há um erro que diz que hello não está definido. Bem, isso nos leva ao nosso primeiro conceito desta lição, que são variáveis. Agora, amplamente falando, ok, programação é sobre dados e a manipulação desses dados. E como você manipula ou brinca com isso? Você faz isso usando comandos que o computador entende. E ler comandos que o computador procura é algo chamado palavras-chave. Quais são as palavras ou frases ou a combinação única de parênteses, números, etc., que o computador pode entender e entender. Então, quando você escreve apenas Olá ou apenas vírgula Olá mundo para o computador, ele não entende o que é tipo de comando que é, e ele apenas se levanta e nos dá um erro. Então temos que dizer ao computador que, hey, hey, escute, nós não estamos dando um comando com Hello World, ok, nós estamos apenas dando alguns dados, certo? Notem uma diferença entre dados e comando, certo? Temos que dizer ao computador que estamos dando dados usando Helloworld e apenas dizer ao computador que são os dados. Temos que envolvê-lo entre aspas. Sim, foi o que fizemos com apenas escreveu “Olá com um computador”. Não entendi. Então eu vou apenas ir em frente e envolvê-lo novamente entre aspas e servi-lo como um dado. Assim, o compilador de computador de expressão de efeitos secundários, o que quer que pegue esses dados e atribua-o à propriedade de texto fonte. E isso é o que é visível na tela. E, obviamente, palavras e frases como esta são apenas um tipo de dados. Ok, então é importante entender isso como apenas, apenas um tipo de dados. Esse tipo de dados que compõe palavras e frases é chamado de tipo de dados string. Existem outros tipos de dados, é claro, por exemplo, diz-se o tipo de dados que aprenderemos mais tarde é chamado de tipo de dados numérico. As expressões do After Effects são baseadas em uma linguagem de programação chamada JavaScript. Então, se você for para Mozilla Developer Network, que é uma ótima documentação, um recurso para JavaScript. Você pode ver a definição de string, que é strings são úteis para manter dados que podem ser representados em forma de texto. E isso é tudo o que precisa saber por enquanto. Agora acontece que em um programa que os mesmos dados são necessários em vários lugares em um programa, ok? E não queremos escrever os mesmos dados de novo e de novo. Então precisamos de uma maneira de armazenar os dados em algo e dizer ao computador que, hey, se você precisar desses dados, você pode encontrá-los aqui. Ok? E este armazenamento de dados é feito usando o conceito de variáveis. Agora, a utilidade das variáveis não seria inteiramente aparente agora com o que estamos fazendo, você verá como as variáveis podem ser úteis e como isso torna expressões mais legíveis e mais fáceis de escrever e entender. Agora, a maneira como você faz uma variável na expressão pós-efeitos é assim. Seu veredicto, que é uma palavra-chave, que é novamente um comando, algo que o computador entende. Você escreve chumbo seguido do nome da variável, ok? E colocamos o nome aqui. Em seguida, escrevemos iguais e colocamos os dados que queremos ser atribuídos à variável. Então aqui eu vou apenas escrever Hello World. Então, novamente, deixe o nome da variável igual e os dados que você deseja que a variável mantenha. Mas aguente firme. Existem algumas regras que você tem seguir quando você está nomeando a variável, que são o número 1, que um nome de variável não pode começar com um número. Certo, esse é o número um. Número dois, o nome da variável não deve conter espaços. Ok, então como você escreve nomes de variáveis que, você sabe que tem várias palavras nele? Digamos, por exemplo, que eu queira nomear esta variável textos para mostrar que não posso usá-lo. Eu não posso usar este nome de variável porque isso vai correr para um erro porque nós temos espaços. Então, existem técnicas diferentes. A primeira técnica é que você pode colocar em sublinhados em vez do espaço S. E isso irá criar uma nova variável sem erros. Algo que eu gosto de fazer é usar invólucro de camelo em que você capitaliza a primeira letra de cada palavra, soou assim, e isso também cria uma variável. A outra regra é que os nomes das variáveis não devem conter caracteres especiais como estrelas, e comercial, cifrões, etc. Embora possa conter um sublinhado como acabei de te mostrar, certo? Além disso, você não pode iniciar um nome de variável com um caractere especial. Apenas começou com um caractere que é do alfabeto, ok, número para os nomes das variáveis não deve ser uma palavra-chave ou comando que o computador está procurando. Certo, por exemplo, como mostrei antes que chumbo é uma palavra-chave. Se eu nomeei esta variável, vamos novamente em que vamos correr para um erro porque desta vez usamos palavra-chave reservada, ok, Então você tem que criar seu próprio nome de variável e certifique-se de que ele é descritivo. Então textos para mostrar é um nome de variável descritiva porque este é um texto ou string que queremos mostrar no Canvas e nós colocamos em uma variável e, em seguida, deixando esta expressão como está, mas ele não vai fazer nada e mostrar em a tela porque tudo o que fizemos foi declarado uma variável. Agora lembre-se que a propriedade que você está escrevendo uma expressão para ele. Por exemplo, estou escrevendo uma expressão para o texto fonte agora. A propriedade para a qual você está escrevendo uma expressão pode aceitar vários tipos de dados diferentes. E string é o que são os tipos de dados que os textos de origem excede. Então, na janela de expressão, se eu posso chamar janela de expressão ou painel de expressão bem aqui, você pode fazer todo o cálculo que você quiser ou qualquer coisa que você quiser aqui, o que você quiser. Mas você tem que ter certeza de que no final, você deixa o painel de expressão com algo que pode ser atribuído à propriedade de texto fonte, porque agora você vê que somos apenas uma variável mais limpa. Então o que vamos fazer é novamente escrever o nome da variável para que o compilador lê, ok, Aqui está algum tipo de dados que eu posso atribuir ao texto fonte. E ele vai mostrá-lo novamente aqui na tela. E eu posso mudar os dados que o texto é mostrar buracos. Por exemplo, eu posso simplesmente escrever meu nome e novamente, ele será atualizado no Canvas. Tudo bem, e esta foi sua introdução muito gentil a expressões, programação e variáveis. E espero que entenda o conceito. Não há lição de casa para esta lição. Vamos continuar no próximo vídeo onde vamos aprender sobre como manipular uma posição de um objeto usando expressão. E vejo-te depois. 4. Posição e matrizes: Ok, então bem-vindo à segunda lição. E nesta classe, nós apenas arranhamos um pouco da superfície sobre expressões. No vídeo anterior, escrevemos algo muito, muito trivial, não muito útil em todo o esquema das coisas, mas uma boa introdução, um gentil, acho que é uma introdução muito, foi muito gentil. E lentamente, estou tentando empurrá-lo para expressões cada vez mais complexas. Ok? Agora, neste momento, você sabe como criar uma variável, certo? Você sabe como fazer isso, certo? Vamos seguido pelo nome da variável, você escreve o sinal de igual e, em seguida, você colocar alguns dados aqui que é atribuído a esta variável. Agora há certas regras que eu também falei sobre, sobre nomes de variáveis. Essas regras não são algo que você terá que se lembrar. Quero dizer, você se acostumaria com isso enquanto você vai em frente e tenta escrever mais expressões, ok? E agora você também sabe que uma string é um tipo de dados que pode conter texto. E você diz ao computador que você está usando um tipo de dados de seqüência de caracteres envolvendo os dados entre aspas. Agora, como string é um tipo de dados que pode conter textos. Há outro tipo de dados que precisamos discutir, e é muito importante um e esse tipo de dados chamado número. Então vamos entrar em nossos efeitos secundários novamente, e vamos tentar fazer algumas coisas. Então eu tenho o, praticamente a mesma configuração do vídeo anterior. Nós temos uma camada de texto e eu chamei uma camada de depuração. E como eu mencionei no vídeo anterior, você pode ir dentro desses potros, ir para a opção de texto fonte de texto, clique no Mac ou Alt, clique no Windows, e então você pode escrever algumas coisas aqui. Então vamos em frente e escrever um número aqui. Digamos que uns 23. E 23 é visível aqui sem qualquer erro porque 23 é um tipo de dados numéricos e o computador entende isso sem que precisemos dizer isso com aspas. Ok? E mais do que isso, eu também posso fazer algumas operações aritméticas simples. Você tem 23 mais 13, e será mostrado 36 aqui. E novamente, só para que você se lembre de qualquer coisa que esteja aqui, a propriedade espera algum tipo de dados que você vai atribuir a si mesma. E então é mostrado aqui em Canvas. E novamente, você pode fazer todos os tipos de diferentes operações aritméticas de símbolos matemáticos como multiplicar isso por dois e duplicar o número e coisas assim. E então o número de manipulações são realmente muito importantes e efeitos secundários porque todas essas propriedades sob transformação como posição, escala, rotação, opacidade, todos os números. A primeira aplicação do tipo de dados numéricos que vamos usar é manipular a posição de algo em Canvas. Agora qualquer coisa que esteja na tela ou nesta área preta ou na composição. Ele terá, se você desdobrá-lo, ele terá transformado, e então ele terá posição. E a posição é composta de dois números, x. O primeiro é x e o segundo é y. X basicamente significa a distância da borda esquerda da tela, Ok, daqui, esta é a distância x e y é a distância de o topo da tela, k. Esta é a distância cega e esta é a distância x. E uma coisa importante a observar aqui que cada uma dessas distâncias de x e y é medida até o ponto de ancoragem desse objeto. O que é um ponto de ancoragem? Bem, você sabe, eu espero, você sabe, eu vou lhe dar uma breve explicação embora. Tenho certeza que você sabe o que é um ponto de ancoragem. Então este é o ponto de ancoragem, certo? Isso é bem aqui, esse pequeno cabelo cruzado que você vê. E você pode alterar a posição do ponto de ancoragem clicando aqui nesta ferramenta, que é o pan atrás da ferramenta, e depois arrastá-lo ao redor. Você pode manter o comando pressionado para encaixá-lo e os cantos. Então o que o ponto de ancoragem faz é qualquer transformação que você aplicar como, por exemplo , posição, como eu disse, é medida, medida desde a classificação aqui até o ponto de ancoragem de cada uma dessas bordas da tela. Ok? Então, se eu aumentar o valor X, certo? Você pode ver que se move para a direita. E se eu aumentar o valor y, ele realmente se move, se move, que se move para baixo. Então esse ponto de ancoragem é basicamente o que está se movendo e está movendo todo o objeto e em posição não é muito aparente. Mas vamos ver se eu rodar, você verá que ele girará em torno do ponto de ancoragem. E se eu mover o ponto de âncora para aqui, você pode ver que ele girará por aqui. Então isso é o que eu queria deixar bem claro é que a posição de algo como calculado para o ponto de ancoragem desse mesmo objeto. Então, tudo em todas as posições de qualquer objeto na tela, ele também terá um ponto de ancoragem pode ser representado usando dois números, certo? Qualquer coisa na tela, a posição se ele pode ser representado usando dois números, x e y, são muitas vezes escritos assim e isso é o que há aqui e as propriedades de posição x e y. e se quisermos manipular cada um desses números individualmente, o que você pode fazer é clicar com o botão direito do mouse e clicar em dimensões separadas. Muitas vezes, é útil quando você está escrevendo expressões. Apenas efeito pai. Por que ou apenas a exposição. Mas agora, não precisamos disso. Precisaremos disso mais tarde. Então vamos entrar nisso. Eu só queria que você soubesse que você também pode dividir cada um deles e animá-los individualmente ou escrever expressões para eles individualmente. Então eu vou pressionar o Comando Z e voltar para a versão não dividida, não separada da posição. Agora, antes de começarmos a manipular a posição de algo na tela usando expressões, eu quero falar sobre um conceito importante chamado arrays. Agora, como eu disse antes, na programação, há dados e depois há manipulação desses dados. Certo, só um lembrete rápido, mantenha isso em mente. Uma matriz é algo que é chamado na estrutura de dados de programação. Há definitivamente mais estruturas de dados na programação, mas matriz é as primeiras estruturas de dados que os programadores aprendem e é o mais simples. Mas o que é uma estrutura de dados? Agora, vou dar-lhes uma definição muito animada, sem estrutura de dados. E eu tenho que fazer isso antes que eu possa entrar nos detalhes práticos e tudo caia junto e faça sentido para você. Então aqui, a atenção das pessoas. Assim, uma estrutura de dados é uma maneira de organizar dados e isso é importante em uma estrutura de dados é uma maneira de organizar dados, diz que torna mais fácil para um programador. Então mais fácil é novamente, uma palavra-chave, algo importante a ter em mente, mais fácil para um programador acessar e manipular dados. E sabemos que programar Broglie é sobre dados e manipulação desses dados. E a estrutura de dados é algo que facilita o acesso e manipulação de dados ou sensoriais. Estamos falando de matrizes. Nós podemos apenas remover a estrutura de dados para ele aqui e apenas escrever array, ok, por enquanto. Então matriz é uma maneira de organizar dados, ok, ainda se encaixa e torna mais fácil de acessar e manipular dados. Certo, esse é o livro, é a definição. Mas agora vamos começar a programação e escrever algumas expressões e aprender mais sobre isso. E vai fazer muito mais sentido do que ler algo de uma tela preta. Agora estou de volta ao After Effects e estou no painel de expressão de textos de origem de camadas de depuração. E aqui eu vou mostrar a vocês como criar um novo array. A maneira como você cria uma nova matriz é muito semelhante a como você faz com uma variável, ou, sinto muito, como você cria uma variável. Então você começa com a nossa escrita deixar, e então eu vou escolher um nome para esta matriz, e eu vou chamá-lo de matriz de teste e, em seguida, igual sinal. Agora, em vez de colocar alguns dados aqui, em vez de escrever, vamos dizer olá, que é uma cadeia de dados, ou 23, que é um número de dados. Vou escrever abrindo e fechando colchetes, certo? E agora, dentro desses colchetes, posso preenchê-lo com tantos dados diferentes que eu quiser. A única, a única condição é que cada um desses dados deve ser separado por vírgulas. Então, eis o que quero dizer. Eu posso ir em frente e colocar, digamos alguns números, 32, 1809, 96, eu posso escrever, ok, Olá, eu vou colocar algumas mensagens lá também. E vendo que cada um desses dados é separado por uma vírgula, certo, bem aqui. E a partir de agora, nada é visível na tela de novo, porque eu não dei algo para atribuir à fonte de pobreza sexual. Então vamos apenas ir em frente e escrever matriz de teste. E eu vou ir em frente e clicar lá fora. E aqui você pode ver que ele imprime a matriz como ela é. Agora, aqui está a parte legal. E se eu só quisesse acessar um dado de todo esse array? Posso fazer isso usando o conceito de índices de matriz. E aqui está o que é. Então aqui está a matriz que declaramos. Nós escrevemos deixe que ser montado o nome da matriz. E então colocamos um monte de dados dentro desses dois colchetes. Agora cada dado, cada um desses dados que está dentro da matriz tem um índice associado a ele. Os primeiros dados dentro da matriz tem o índice de 0, o segundo o índice de um, o terceiro o índice de dois, e assim por diante e assim por diante. Então, se eu quisesse acessar apenas um desses dados e índice de hábitos de IA, eu posso fazer isso fazendo isso. Vou escrever o nome da matriz. Então vou escrever um colchete aberto. Vou escrever o índice desses dados e depois fechá-lo, que basicamente significa que estou acessando os dados no índice um. A única coisa importante a lembrar aqui que muitas vezes pode deslizar sua mente é que os índices dentro de uma matriz começam com o número 0, ok, começa com 0 e não com um. Então vamos voltar ao After Effects e ver se isso funciona. Então agora eu tenho matriz de teste com apenas um teste de ciência ou revalorizar fazer tags fonte e ele mostra tudo o que está dentro desta matriz. E se eu só quisesse acessar, digamos 96. Assim, o índice de 1906 como 0, 1, 2. Então são índices também. Para que eu possa escrever. E lá vamos nós. Apenas 96 é visível. Então, se eu escrever o índice três, eu vou receber Olá visível. Se eu indexar quatro, eu deveria correr para um array, desculpe, em um erro porque não há dados lá, ok, apenas mostra nada. Isso é legal para. Então, novamente, se eu quiser acessar, eu posso colocar um índice dos dados lá. Ok, então um array é útil quando temos que ter uma coleção de dados em vez de apenas um único pedaço de dados, ok? E você sabe que a posição de um objeto é composta de dois números, x e y. e uma matriz é uma maneira perfeita de representar a posição, que é basicamente usando uma matriz de dois números. O primeiro é x e o segundo. Por quê? Ok, então vamos voltar ao After Effects e eu vou limpar tudo aqui. Eu estou no painel de escrita de expressão de texto fonte da camada de depuração e eu vou escrever um monte de código ou você está bem e você não vai entender nada disso porque o conceito de qualquer código vai ser vermelho e será explicado no próximo vídeo. Mas fique comigo por enquanto. Então eu vou escrever um monte de código. Agora, este código que eu escrevi aqui basicamente como alvo a propriedade position desta camada. Ok, e como eu vou clicar para fora, você vai ver o que é atribuído ao texto de origem e, como resultado, é exibido na tela. Então eu vou clicar fora e se algum grande número. Então deixe-me ir em frente e diminuir o tamanho da fonte um pouco, OK. E você pode ver que é basicamente como eu estou movendo-o desde o, uma vez que ele está diretamente conectado à propriedade position como a posição está mudando, então o número está atualizando. Mas o que eu quero que você note é que este é o número, certo, para um 2.840029 vírgula 1073, que é basicamente esta parte aqui é o valor x, e esta parte aqui é o valor y. Ok? E este número inteiro, este número inteiro representa a posição, ok? E fez apenas para mostrar que é um array, o que eu vou fazer é escrever um colchete de abertura e fechamento e digitar o índice 0, que significa que ele só deve mostrar os primeiros dados na matriz, que é o valor x. Então eu vou clicar fora e ele só mostra o valor-x. Agora você pode ir em frente e escrever um aqui, e ele só mostrará o valor y. E lá vai você. Isso prova que a posição de qualquer coisa na tela é armazenada em uma estrutura de dados chamada array. Ok, e isso é tudo para este vídeo. Começamos este vídeo com uma introdução a um novo tipo de dados, que é o número. Então aprendemos sobre como a posição de um objeto em Canvas é representada usando dois números chamados x e y. então aprofundamos o conceito de arrays e aprendemos como criar uma matriz usando a mesma sintaxe de estilo variável e como podemos acessar dados dentro da matriz usando índices de matriz. E uma coisa novamente, lembrar que o índice em uma matriz começa com 0 e não um. E então vimos que a posição é representada usando dois números, x e y. Então ele pode ser armazenado em uma matriz de dois números. E nós apenas vimos isso como nosso último exemplo. No próximo vídeo, vamos aprender algo muito importante, que é essa notação de ponto, que significa basicamente como direcionar uma determinada propriedade ou como direcionar uma determinada camada, como atravessar para ela. E quando eu explicar isso para você, você vai entender totalmente este pedaço de código bem aqui. Então, vejo-te no próximo vídeo. E mal posso esperar para te ver em breve. 5. Travessura usando a notação de pontos: Bem-vindos à terceira lição desta aula. E antes de prosseguirmos com esta lição, eu só queria fazer uma breve recapitulação de tudo o que sabemos até agora. Está bem? Sabemos sobre como adicionar expressões a uma propriedade, que é por opção clicando no Mac ou Alt, clicando no Windows, escrever um painel de expressão abre onde você pode escrever um par de expressões em código. Temos apenas até agora adicionar uma expressão para a propriedade text source. Estou ciente disso, mas vamos adicionar expressões a cada vez mais propriedades de forma semelhante. No devido tempo, sabemos sobre dois tipos de dados, que é string e número. Tipo de dados String é usado para armazenar texto e tipo de dados número novamente é usado para armazenar um número. Também sabemos sobre uma estrutura de dados. Também sabemos o que é uma estrutura de dados. Então nós sabemos sobre uma estrutura de dados e que é matriz. Sabemos também que uma posição de um elemento na tela, direita, ou na tela pode ser descrita por dois números, x e y. X é a distância horizontal da borda esquerda da tela, e y é a parte inferior. Como você vai abaixo da distância da borda superior da tela. E posição pode ser mostrado na expressão ou código usando uma matriz de dois números. Sabemos tudo isso até agora e isso é ótimo. Neste vídeo, nós vamos aprender sobre Travers coisa e segmentação camadas e suas propriedades usando notação de ponto, vamos aprender sobre o índice de camadas. E ambos serão muito importantes quando você estiver escrevendo expressões mais complexas e interconectadas. Portanto, preste muita atenção a esta lição. A primeira coisa que eu quero falar é a notação de pontos e mostrar-lhe uma maneira de estruturar e acessar dados na linguagem de programação JavaScript. Agora, lembre-se que a expressão aftereffects, o código que você escreve após esperar expressão é baseado na linguagem de programação JavaScript. E é por isso que estamos espiando o código para tentar dar mais sentido a ele. Agora, por favor, entenda que não usaremos esse código em qualquer lugar da expressão. Mas a idéia geral que eu vou compartilhar vai permanecer a mesma entre este código aqui em, mas se você vai escrever na expressão, e novamente, você não tem que memorizar este código ou até mesmo entendê-lo completamente. O código é só para colocar o modelo mental na sua cabeça sobre o que vamos fazer a seguir. Considere todo esse código aqui, certo? Todo este código até agora é apenas uma coleção de dados, ok? E esta linha aqui, que é console.log, é simplesmente usada para imprimir o resultado de algum código que colocamos entre parênteses aqui. Ok, agora, se você tentar ler este código aqui, agora isso até agora, só um pouco, você vai encontrar alguns termos familiares neste código, como o projeto e comunicação, que é composição. E então nós temos comp um aqui e nós temos comp 2 aqui. Então, se você ainda não sabia, você pode ter mais de uma composições em um único projeto do After Effects. E eles realmente não precisam ser chamados de competente e AECOM TO YOU PODE dar-lhes nomes descritivos dependendo do contexto, vamos criar várias composições no mesmo líder de projeto pós-efeito nesta mesma lição, certo? Agora, dentro de cada uma dessas composições, ele mostrou essas composições aqui. Esta é comp 2 e esta é compatível. Agora, dentro de cada uma dessas composições, há camadas, ok? Novamente, algo muito familiar. E então dentro das camadas nós transformamos, ok? E contém uma propriedade, neste caso, a propriedade position. Certo, então você vê certas semelhanças entre um projeto do After Effects e todos esses dados aqui. É como se todo o projeto estivesse representado no Coda, certo? Para e novamente, só queria passar mais uma vez que temos composições, temos camadas, temos transformação e posição como semelhante no After Effects, temos coisas como, você sabe, o nome do conf que é F1. Então temos transformação e sob transformação, temos posição bem aqui. E, você sabe, como eu disse, parece que todo o projeto After Effects está representado neste código aqui. Ok, agora que você tem uma espécie de uma idéia áspera do que isso tudo significa. Vamos descer para a instrução console.log. Agora, digamos que neste código, eu quero direcionar a posição desta camada, camada 1 insight de como eu vou fazer isso em código, tudo bem, Para atingir essa posição. Isso é algo que eu vou fazer agora. Primeiro, vou escrever um projeto, não em Caps Lock. Então projeto ponto, em seguida, eu vou escrever colunas, em seguida, eu vou escrever comp 2 camadas de ponto, camada 1 ponto transformar posição ponto. Está bem? E uma vez que eu tenha digitado isso, oops, eu sinto muito sobre esta posição e acho que eu estou soletrando errado posição. E uma vez que eu tenha digitado tudo isso, você pode ver que a saída do código é um 100 vírgula 200, que é o mesmo que o valor desta propriedade posição aqui. E então olhe para os pontos aqui. Você vê Project.com ponto com a ponto, olhar para os pontos aqui e o uso livre de cães, eo uso de pontos, eo uso livre de tantos pontos é por isso que ele é chamado. Esta forma de escrever código é chamado usando a notação de pontos. E usamos a notação de pontos. Neste caso, nós o usamos para atravessar para baixo esses dados em particular. Finalmente alvo a propriedade position. Agora, se isso torna mais fácil para você entender, basta imaginar que escrever um ponto após esta palavra em particular ou o nome basicamente significa abrir uma caixa. Então, Project.me basicamente abrindo a caixa do projeto, então indo para dentro e encontrando câmeras. Então aqui vem, então eu escrevo ponto de comunicação, o que significa que eu tenho acesso a tudo aqui dentro. Então eu vou chegar ao ponto, que significa que eu abro a caixa de ferramentas. Então eu vou para as camadas, insetos, camadas ponto, então eu vou para a camada uma caixa. Então vamos entrar e transformar caixa e finalmente, abrir a transformação com ponto de transformação e x é a posição. Então, sim, Então, se esta analogia torna mais fácil para você entender que a notação usada que NAT travversal no After Effects funciona de forma semelhante. Certo, então vamos dar uma olhada no código que escrevemos na lição anterior e ver se faz sentido agora. Ok, então está claro que a vista, vê que a notação de pontos aqui. Então nós temos este comp dot layer dot transform dot n dot position. Então vamos tentar ler como se fosse inglês. Primeiro de tudo, este com, que é uma palavra-chave, um comando que o compilador After Effects ou o computador entende, mas basicamente significa a composição que você está em agora. Então comp 1 com camada de ponto e escrita camada de depuração entre colchetes, estamos basicamente acessando esta camada aqui, cujo nome é camada de depuração. E então vamos nos transformar. Então, como você pode ver, debug camada Transform, e então temos ponto transformar essa posição. Então abrimos a caixa de transformação novamente e chegamos à posição. Antes de avançarmos, há algo importante que eu queria falar. Nós nos deparamos com o conceito de índice antes dele com matrizes, como no primeiro elemento da matriz tem índice 0, o segundo elemento tem índice um, o terceiro elemento tem o índice 2, e assim por diante. Agora, quando você tem camadas e efeitos após, por exemplo, esta é a camada um. Tudo bem, eu estou tentando o meu melhor para replicar essa interface de usuário da linha do tempo pós-efeito. Então, sim, então no After Effects, todas essas camadas, camada um , camada dois, camada três, elas também têm inerentemente um índice. A diferença crucial aqui é que em matrizes o índice começa com 0, mas em camadas o índice começa com 1, 2, 3. Não há nenhum índice 0 quatro camadas. Então, se eu voltar para After Effects esta camada aqui, já que está na camada de depuração superior, esta camada tem o índice de um. Se eu for em frente e criar outra camada, deixe-me apenas criar outra camada de texto. Então esta camada aqui está no topo agora, então tem o índice de um, mas se eu arrastá-la para baixo, isso terá um índice de dois. Assim, a camada superior começa com índice 1, 2, e se eu criar outra camada abaixo dela, ela terá índice 34 e assim por diante. E eu estou dizendo isso porque este pedaço de código em particular aqui, camada de depuração Lear, certo? Este pedaço de código específico que leva no nome da camada para atingir essa camada também aceita o índice da camada. Agora, uma vez que a camada de depuração tem o índice de um, eu posso escrever um aqui e ele vai mostrar, ele ainda será o mesmo e ele mostra a posição desta camada particular, a camada de depuração 684, 776, como você pode ver, agora, se eu mudar este número para dois, que significa que ele vai ter como alvo a camada no índice dois. E deve mostrar a posição da camada no índice dois, que novamente tem a posição de 1942 1190 e bem aqui, 9421190. Então, novamente, neste pedaço de código específico, você pode direcionar uma camada usando o nome da camada ou o índice dessa camada. Agora, assim como eu posso usar a camada e sua forma diferente, uma com o nome da camada e havia o índice. Eu também posso colocar outro pedaço de código aqui que não só tem como alvo como esta composição, ele pode ter como alvo outras composições. E eles também prometeram anteriormente nesta lição que vamos criar várias composições e, você sabe, tentar atravessar essa composição. Então este é um único projeto pós-efeito e já tem uma composição chamada comp one. Vou clicar aqui e criar uma nova composição. E eu vou chamar isso de calma também. E como já mencionei antes, que dependendo do contexto, você pode dar nomes mais descritivos às suas composições. E eu vou escolher uma cor diferente para esta composição. Vamos dizer vermelho, e eu vou clicar em Ok, e agora eu estou dentro da coluna 2 e eu vou ir em frente e criar uma nova camada de texto aqui. E eu vou escrever o valor que eu estou na coluna 2. Está bem? Então esta é a camada e calma também. Agora o que eu vou fazer é eu vou fazer, vou comp um. Ok, eu não preciso mais dessa camada de olá, então eu vou deletá-la. Vou entrar na propriedade de texto fonte e quero segmentar o texto desta camada. Ok, então eis como fazer isso. Novamente, realmente usar a notação de pontos. Está bem? Então, em vez de escrever esta composição, que vai ter como alvo esta composição, o que eu vou fazer é escrever com, ok, abrir colchete. E então eu posso colocar no nome da composição que eu queria atingir. E o After Effects é muito útil. Todo o caminho mostra essas opções de preenchimento automático para que você possa navegar usando as teclas de seta e pressione Enter para selecionar algo. Ok, agora, comp, tubo de comunicação vai ter como alvo esta composição, a segunda ou não, realmente a segunda, mas cujo nome chegou, então eu vou digitar a camada de ponto, ok? E eu vou para ir em frente e selecionar a camada de índice um, ok, então eu vou para a camada um e selecionar a propriedade text. E então eu vou entrar no texto e selecionar o texto fonte. Ok, então lá vai você. Eu vou ir em frente e clicar lá fora e você pode ver que ele é, ele mostra um texto que está presente na outra composição que nós criamos, o CO2. Então, de novo, vamos repassar mais uma vez. Alvo comp, tubo comp. Ok, então eu tenho como alvo esta camada cujo índice é um. Então, novamente, sabemos que a primeira camada tem o índice de um. Em seguida, entramos em dot txt, o que significa dot txt. Então abra esta caixa, então nós temos dentro de texto, texto fonte. Então eu seleciono essa propriedade aqui, e o texto fonte armazena o valor real que está em uma camada de texto. E quero dizer, se você ainda não sabia disso, então é isso que nós acessamos usando este pequeno pedaço de código de notação de pontos em particular. E agora você sabe como atravessar e efeitos secundários usando expressões. Você sabe como chegar a uma determinada camada e uma propriedade dentro dessa camada. E como faço para chegar a uma composição diferente no mesmo projeto e escolher uma camada de lá e uma propriedade de camada de todos eles estão usando a sintaxe de notação de pontos. E isso é muito legal e isso vai ser muito útil e útil no próximo vídeo onde estaremos fazendo algumas animações, certo? E eu estou muito ciente de que até agora não temos animado nada, mas isso muda no próximo vídeo, como eu disse, lembre-se que vamos aprender alguns novos conceitos e também criar uma animação usando expressões. E você verá que sem expressão, seria muito difícil. Teria sido muito difícil criar a mesma animação manualmente usando apenas suas mãos e quadros-chave. Então, sim, eu vou te ver no próximo vídeo e tomar cuidado em seguida, eu acho. 6. Valor e valor valueAtTime: Muito bem, bem-vindos ao quinto capítulo, a quinta lição desta turma. Depois de tudo o que aprendemos até agora sobre expressões, não vimos nada legal aconteceu na tela ainda. Então, nesta lição, eu quero demonstrar por que expressões podem ser super úteis. E também aprenderemos sobre algumas coisas novas. Então vamos começar. Vou criar, clique em nova composição. E eu vou chamá-lo de Comp 1 2000. Em 2000, vou escolher a cor de fundo ou preto. E vamos escolher três segundos para a duração da animação, vou clicar em Ok, e agora aqui estamos. Ok, então a primeira coisa que eu quero fazer é pegar a ferramenta de retângulo daqui, e eu vou escolher um preenchimento para ela. Vamos com algo assim, esta cor, a cor realmente não importa. Sabe, pode ser o que você quiser. E então eu vou ir em frente e arrastar quadrado na tela e ter certeza que esse é o quadrado que eu vou segurar Shift para restringir suas dimensões. E depois vou largar. E você sabe o que, lá, lá está. Ali está o nosso pequeno quadrado. E agora, se você estiver olhando para a linha do tempo, você pode ver que este retângulo está selecionado, mas o que realmente queremos é que esta forma seja selecionada. E você pode ver que o ponto de ancoragem é aqui. Não queremos que o ponto de ancoragem da forma esteja aqui. Gostaríamos que estivesse no centro. Então eu vou clicar na panela atrás da ferramenta. E então eu vou ir em frente e arrastá-lo para o centro. E eu mantenho o comando para que ele se encaixe no centro. E também eu só, quer saber, eu só gostaria de torná-lo um pouco menor. Então eu vou segurar Shift e arrastá-lo assim. Ok? Vou colocar esta raiz quadrada aqui e vou para o painel Camadas. E eu vou ir em frente e renomear esta camada para líder de linha de litro e será claro em um pouco. Agora vou falar sobre algo que pode ser um pouco confuso. Foi um pouco confuso para mim inicialmente. Então preste muita atenção. Está bem. Agora há uma palavra-chave em expressões. Quando você escreve expressões, há uma palavra-chave chamada valor, que simplesmente significa o valor da propriedade correspondente. Por exemplo, acabei de abrir o menu suspenso Transformar ou o aninhamento ou o que você quiser chamá-lo, da camada líder. E eu vou, eu vou ir em frente em rotação, e eu vou ir em frente e opção clique na propriedade de rotação para que eu possa escrever uma expressão para ele. Agora, a palavra-chave que eu estava falando é valor. Então, se eu escrever valor aqui e clicar para fora, nada realmente acontece porque todo o valor é, é, é essencialmente uma referência ao valor da propriedade para a qual você está escrevendo a expressão. Uma vez que este valor aqui faz referência a esta propriedade, eu posso escrever algo como valor igual a 45, e eu vou clicar fora e você vê que a rotação agora tem o valor de 45 graus, porque o valor é igual a 45 basicamente significa o valor de 45 foi atribuído à propriedade de rotação. E este valor de escrita é igual a 45 é simplesmente um método longo de apenas escrever 45. Então, se eu escrever 45, 45 é atribuído ao valor de rotação e ele gira. E se eu escrever valor igual a 45, ele faz exatamente a mesma coisa. Eu falei sobre valor aqui porque há algo chamado o valor no momento que eu vou falar mais tarde. E quando eu fizer isso, eu queria ter certeza de que você entenda o que valor realmente significa. Outra palavra-chave sobre a qual eu queria falar agora é o tempo, que significa simplesmente o valor do tempo na linha do tempo. Como você pode ver aqui, o texto em azul representa o tempo com isso. Então, se eu arrastar esta cabeça jogo ao redor e vamos dizer que se eu ir para 1 segundo, isso significa que os valores uma vez eu acho que então foi o tempo. Tempo significa, ok, então deixe-me mostrar a vocês, eu vou recolher o lead ou camada e eu vou ir em frente e digitar uma nova camada de depuração. Muitas vezes fazemos isso quando estamos lidando com expressões e 12, certifique-se, você sabe, os valores estão bem ou não. E como uma camada de texto está obtendo sua propriedade, o texto que ela está segurando da propriedade text source. Eu posso ir em frente e opção clique aqui e simplesmente escrever tempo. Ou eu posso escrever valor igual a tempo, significaria a mesma coisa, certo? Então, se eu me esfregar, você pode ver que o tempo está aumentando em um tempo muda lá. E novamente, reiterar sobre qual valor é valor é igual ao tempo basicamente significa que o valor do texto de origem é igual ao tempo. E se eu remover isso por padrão, ainda é a mesma coisa. Ok, então agora você sabe qual é o valor e o tempo. E você pode combinar valor e tempo. Eu posso, para a propriedade de rotação novamente, Eu posso escrever valor igual a tempo. Então, se eu clicar para fora, você pode ver que à medida que o tempo aumenta, enquanto eu estou arrastando o indicador de reprodução, você pode ver que ele está girando um pouco. Você vê isso? Isso é legal, certo? E se eu quiser fazer a rotação um pouco mais íngreme, eu posso multiplicar o tempo por, digamos um 100 e eu estou usando o símbolo asterisco, esse é o símbolo de multiplicação. E programando, estou usando o símbolo asterisco para multiplicar o tempo por 100. E agora, se eu for em frente e esfregar a cabeça do jogo, você pode ver que ele está girando muito, certo? E lembre-se, neste momento, eu posso remover valores iguais e isso ainda significaria a mesma coisa. Já disse isso tantas vezes. Eu só quero ter certeza de que eu tenho martelado o ponto para casa e que você entende apenas escrever um valor significa que você atribuí-lo a isso. Eu sempre acho que, você sabe, escrever valor igual realmente torna a expressão mais legível. Então, é preferência pessoal se você quiser fazer isso. Está bem, deixa-me limpar tudo. Eu não quero nenhuma expressão em tudo, e nós vamos, em um segundo começo com nossa animação. Ok, então aqui está, aqui está a configuração. Temos uma camada de líder ali. E se você está acompanhando, certifique-se de que tem isso e vamos começar. A primeira coisa que vou fazer é duplicar a camada de líder. Portanto, certifique-se de que ele está selecionado e pressione Command D no Mac ou Control D no Windows para criar uma cópia diferente. E eu vou arrastar isso para baixo abaixo da camada líder. Então, um líder também, mas o líder para camada selecionado, basta arrastá-lo para que você possa ver a diferença. Eu vou ir em frente e renomear esta camada para seguidor. Tudo bem? E então eu vou selecionar a camada novamente e mudar seu preenchimento para algo como um amarelo sutil. E agora eu vou para o, desculpe, e eu vou para a propriedade transform position da camada follower e começar a escrever algumas expressões. Então opção clique na posição, cronômetro, e vamos começar a escrever. Precisamos nos livrar dele. Ok, ótimo. Vou puxar este painel um pouco para baixo para abrir mais espaço e vamos começar. O que você quer fazer é que fazer o seguidor ter a mesma posição que uma camada de líder. Então, para isso, a primeira coisa que eu vou fazer é criar uma nova variável co-líder, e segmentar a camada de líder nesta composição e você sabe como fazer isso usando a notação de pontos. Então esta camada de ponto com, eu posso escrever camada e index1 aqui, e ele ainda vai segmentar a camada líder. Mas, por enquanto, eu quero colocar no nome das camadas. Então este completador, e agora temos uma referência à camada de líder nesta composição que a segunda coisa que queremos fazer é obter a posição de líder que eu possa criar uma nova variável chamada posição de líder. E agora eu vou simplesmente montar líder ponto transformar posição. E assim, agora tenho a posição de líder. E você pode ver que eu estou quebrando toda a notação de pontos em diferentes variáveis. E desta forma torna a expressão muito mais legível, algo que está um pouco mais perto do inglês. E quando é escrito líder ponto transformar posição que After Effects, motor de expressão já olha para o líder e diz, Oh, há um litro, que é esta camada. Então ainda significa a mesma coisa. A próxima coisa que vou fazer é simplesmente escrever valor igual a litro. Este é o Shin. E acabei de te ensinar sobre valor. O valor é simplesmente o valor desta propriedade e o valor é igual à sua posição. Como eu vou clicar fora, você vê que aquele litro seguidor, desculpe, a camada seguidor é amplia a posição da camada líder. Ele agora está empilhado atrás dele. E novamente, apenas um lembrete de que você não tem que escrever valor igual a igual, eu posso me livrar dele e ele ainda vai fazer a mesma coisa. Mas, novamente, para tornar o código um pouco mais legível, eu gosto de escrever valor igual a. Agora, com isso fora do caminho, vou derrubar a camada de seguidores. Eu vou para a camada líder em posição de transformação e eu vou criar um novo quadro-chave. Vou colocar a camada de líder, basta adicionar este canto e eu vou criar um novo quadro-chave para a posição. Então eu vou avançar para 1 segundo e eu vou mover a camada líder para o canto inferior direito. E então quando eu pressionar play, o que acontece é muito esperado. A camada de líder anima suas animações até a posição final, e a camada de seguidor fica atrás dela o tempo todo. Idealmente, para uma animação interessante, a camada de seguidor deve ficar um pouco, certo? Não deveria estar atrasada no tempo em relação à camada líder porque isso é bastante branda. Nada está realmente acontecendo. Agora vamos em frente à expressão na posição dos seguidores e fazer algumas pequenas mudanças. Vou criar uma nova variável. Então eu vou apenas clicar, desculpe, eu vou pressionar Enter para criar uma nova linha e eu vou vincular este valor vai pagar. Vou nomear esta variável líder posição defasada. Então vou soletrar direito. Posição de defasagem do líder. E eu vou dar-lhe o valor da posição de líder que eu tenho, você sabe, já declarou aqui, valor de ponto no momento e dentro dos colchetes eu vou apenas escrever tempo. E então, em vez de atribuir posição de líder para o valor, eu vou atribuir posição de atraso litro. Ok, esta variável bem aqui que acabamos de criar, eu vou clicar fora e de novo, eu vou passar e nada realmente aconteceu e vamos passar por isso por que nada aconteceu? Mas eu quero que você, por agora preste muita atenção ao valor no momento, porque isso é algo novo. Agora, você já sabe que hora é certa? Onde a palavra-chave time faz. E então se eu ir em frente e subtrair um pequeno número do tempo, do tempo que é passado para o valor no momento, bem entre esses colchetes, se eu ir em frente e subtrair um pequeno valor dele, Vamos ver o que acontece. Vamos subtrair menos. Então sinais de subtração menos, e vamos escolher um número pequeno, digamos 0,1. E se eu clicar fora, e se eu ir em frente e reproduzir essa animação novamente, você pode ver que o seguidor fica um pouco atrás na animação. Agora, como é que isso funcionou? Bem, o poder do valor no momento é que ele pode lhe dar o valor da propriedade que você está pedindo em qualquer ponto do tempo na linha do tempo, certo? Então, basicamente, o que estamos dizendo usando essa linha de código particular e a expressão é que me dão o valor da posição do líder, mas em um momento que está ligeiramente atrás do tempo real. Então tempo é tempo real, certo? Quando temos o tempo real, ele retorna a mesma posição e a mesma posição é atribuída ao seguidor. É por isso que se você não está vendo nenhum atraso, mas aqui quando dizemos negativo e 0,1, o que significa voltar no tempo 0,1 segundos e me dar esse valor. E esse valor é então atribuído à camada de seguidor, e é por isso que ele segue o líder. Agora, bem aqui, eu acabei de subtrair 0.1, que é um pequeno número que eu acho que poderia ter sido qualquer número em tudo. E você sabe, isso depende do tipo de animação, da sensação de animação que você está tentando alcançar. Mas eu só queria introduzir um novo conceito em expressões. E eu pensei que seria um grande ponto, certo? Então não estamos apenas supondo que números pequenos significam que temos alguma matemática real por trás disso. Então isso nos leva ao nosso, outra palavra-chave especial que um entende, que é duração do quadro. Duração do quadro simplesmente significa quantos segundos, certo? E lembre-se que é segundos a partir de quantos segundos dura um quadro? Agora, para repetir algo que você já deve saber é que uma animação é simplesmente, você sabe, são quadros diferentes, certo? Uh, muitos, muitos, muitos quadros diferentes. Basta lâmina a uma velocidade muito rápida para que você possa ver algo animado. Então, quando uma composição, quando uma composição no After Effects, é atribuída taxa de quadros. Isso é o que significa, significa quando eu atribui, quando eu vou para este com e eu vou olhar para a taxa de quadros pressionando Command K ou controle K para abrir as configurações. Você pode ver que é a taxa de quadros é de 24 quadros por segundo, que basicamente significa que em 1 segundo, 24 quadros são mostrados e que é o pão frito fora de uma composição. Agora isso significa, isso significa novamente, eu vou escrever uma pequena equação aqui. Em 1 segundo. 24 quadros são mostrados, certo? Então, por quanto tempo dura um quadro? E essa matemática sai para ser uma por 24 segundos. E isso é em torno, eu acho que o seu ponto, 0, 4, 1, 66 alguma coisa. Então vamos voltar ao After Effects e verificar qual é a duração do quadro para esta composição específica. Novamente, eu vou ir em frente e criar um novo disco, uma camada de depuração de camada de texto aqui. Então eu vou ir em frente e ir em texto fonte opção clique e simplesmente escrever esta composição tem duração do quadro. E lembre-se de que você não pode apenas escrever duração do quadro porque a duração do quadro é uma propriedade de uma composição. Então você tem que prefixar este comp ou calma e entre parênteses o que você está direcionando. Então eu vou clicar fora e você pode ver o valor sai para ser 0.0416666, que é basicamente um dividido por 24. Ok, ótimo. E agora eu vou apenas excluir essa camada e ir para a camada seguidora. E em vez de enquadrar menos 0.1, vou simplesmente escrever esta duração de quadro de ponto comp. E se eu clicar lá fora, agora acontece, agora só para tornar a expressão mais legível como extrair isso, certo? Então, vou pressionar o Comando X para cortá-la. Como criar um novo, vou criar uma nova variável e chamá-lo de tempo de atraso, certo? Então eu vou chamá-lo da última vez e eu vou escrever, apenas pressione este quadro de ponto, esta duração de quadro de conduta, certo? E eu posso simplesmente ir em frente e subtrair como tempo de atraso daqui. Então eu só extraio isso. Foi tudo o que fiz. E eu estou clique fora e ele ainda vai funcionar da mesma forma. Agora você sabe o que é mais legal, não um, mas muitos seguidores. Ok, então eu vou em frente agora, apenas um seguidor. Vou apenas selecionar o seguidor e criar várias cópias dele. E eu vou voltar novamente e pressionar Espaço para pré-visualizar. Bem, você sabe, ainda é a mesma coisa. Sabe, muitos seguidores significam que muitos seguidores deveriam ter mostrado, mas ainda há um seguidor. Bem, isso é porque cada seguidor está apenas empilhado atrás do mesmo seguidor. Eu digo-te porquê. Então eu vou pressionar o Comando Z algumas vezes e só tenho um seguidor aqui porque todos eles têm o mesmo tempo de atraso. E queremos que seja um pouco diferente para cada um dos seguidores empilhados no painel de camadas. E aqui está a propriedade de índice vem em muito, muito útil. Então você sabe que a primeira camada tem índice de um, o índice secundário de dois, e assim por diante e assim por diante. Se eu quiser aumentar o tempo de atraso para cada seguidor, basta multiplicá-lo pelo índice desta camada e eu vou clicar fora. Ok, e eu vou continuar e criar mais cópias disso. E então quando eu tocar no play, você pode ver isso. Você pode ver que o seguidor está apenas seguindo o líder assim. E parece um pouco barba agora, não muito bonito. Então eu vou para a posição da camada de Líder. Eu vou selecionar os dois, e então eu vou ir em frente e ir para o assistente quadro-chave. E vamos escolher Easy, Easy, ok, então eu adicionei um pouco de flexibilização e agora vamos olhar para ele e isso parece um pouco melhor, não é? Certo? Isso parece um pouco melhor. E você sabe qual é a melhor coisa que eu gosto de fazer depois de fazer isso como clicar com o botão direito do mouse aqui, ir para o Keyframe Velocity e apenas fazer isso um 100. Então, agora que os atos um pouco, um pequeno detalhe agradável. Então, olhando para isso, certo? Então isso parece muito fenomenal designações. E o que eu também posso fazer é lembrar que eu só estou brincando com a camada líder. Não vou tocar em nenhum dos seguidores. Há apenas sendo, você sabe, posição animada usando a expressão para que eu possa mudar o caminho do, da camada líder como este. E os seguidores seguirão esse caminho, certo? Olha como isso é legal. E você pode imaginar usando isso em diferentes cenários, dando seguidores diferentes, diferentes tipos de cores e tudo sem expressões fazendo essa animação, você sabe, uma animação tão versátil seria realmente difícil fazer isso com diferentes quadros-chave e matéria com o posicionamento e alterar o tempo de atraso e alterar a flexibilização de cada um dos seguintes alimentos designados para fazê-lo. Agora uma coisa que eu realmente queria falar antes de deixar vocês com este vídeo é que eu vou apenas me livrar de todos os seguidores novamente e entrar na expressão bem aqui. Então o que eu queria falar é que essa expressão tem variáveis e pode parecer um pouco diferente de outras expressões que você tem, pode ter encontrado na Internet ou, você sabe, copiado para sua biblioteca e tudo mais. A razão é que a forma como escrevi a expressão, é muito detalhada. Eu posso mudar essa expressão para parecer muito mais complicado do que isso. Então deixe-me, deixe-me ir em frente e tentar fazer isso bem na sua frente. Eu vou em frente. Então eu vou apenas pressionar o Comando C para manter uma cópia disso. Então tudo o que posso fazer por este em particular, você sabe, para fazer a mesma coisa acontecer e conhecimento. Escrever uma expressão tão detalhada é que eu posso fazer algo como este comp. - Nada. Obrigado. Está bem. Não para ferimentos. Você pode fazer isso. Então eu posso ir em frente e me livrar de tudo isso. E eu vou clicar fora e não haverá erros e a animação ainda funcionaria como funciona. Vou criar mais cópias de seguidores. Assim como. E se eu pressionar Play, você pode ver que a mesma animação ainda funciona. Então meu objetivo geral aqui é que, se você quiser, porque a maioria das variáveis que eles vão, desculpe o mais são as expressões que você vai encontrar na Internet, mas eles não terão uma versão tão detalhada da expressão escrita assim. Eles simplesmente terão uma única linha e, você sabe, nomes de variáveis desviados como uma única letra, como L ou algo assim. Só queria que soubesse que pode fazer isso. Mas se você estiver escrevendo expressões, sempre faz mais sentido tornar o código mais legível, não apenas para os outros lerem, mas também para você quando você o revisitar no futuro. Ótimo, espero que tenha aprendido muito neste vídeo. Acho que vamos tocar nos 20 minutos, Mark, e não quero fazer isso. Então eu vou terminar este vídeo aqui. E no próximo vídeo, vamos colocar tudo o que aprendemos juntos nesta classe até agora e criar um modelo de animação baseada em texto. Vai ser muito fixe, e vejo-te depois. 7. Juntando tudo no lado - um: Muito bem, bem-vindos à sexta lição desta turma. E chegamos até agora. Fizemos isso juntos até agora. Isso é realmente ótimo. E neste capítulo vamos usar tudo o que aprendemos até agora para criar algo realmente legal, algo que é prático. E você pode compartilhá-lo on-line ou você pode postá-lo como um projeto aqui, certo? E ao longo do caminho, como vamos fazer isso, eu também vou ensinar-lhe uma ou duas novas técnicas pós-efeitos, mas nada importante quando se trata de expressões. Tudo bem, então vamos começar com esta lição. Estou dentro de um novo projeto do After Effects, então, você sabe, um novo projeto. Esta janela inteira vai aparecer. E dentro deste projeto, eu quero fazer duas composições, ok? A primeira composição, eu vou fazer o meu clique aqui e eu vou dar-lhe o nome do modelo TMP LIATE, e eu vou dar-lhe uma dimensão de novamente 2000 por 2000 pixels. Ok, ótimo. Vou dar-lhe uma taxa de quadros de 24 quadros por segundo, e vou dar-lhe uma duração de três ou cinco segundos, não importa. 3 é fino e uma cor de fundo de preto. E eu vou clicar, Ok, eu vou criar outra composição. Então eu posso fazer isso clicando aqui. E vou dar a esta composição o nome de animação, tudo. Todas as configurações permanecerão iguais a um modelo 1, por isso é preenchido automaticamente. A única diferença é que eu quero que esta coluna dure apenas um segundo. Então eu vou clicar em Ok, e agora você pode ver que eu tenho duas composições, animação e um modelo. Agora dentro, e isso é importante que você esteja dentro do template com, apenas certifique-se de que esta aba está selecionada assim. Ele diz modelo, eu vou criar uma nova camada de texto. Então eu apenas cliquei na ferramenta de texto, clique na tela, e então eu vou apenas digitar o texto ou o conteúdo dele não importa muito. A próxima coisa que eu vou fazer, o que é importante, é esvaziar esta camada aqui e nomeá-la camadas principais. Então eu vou selecionar a camada, pressione Enter e chamá-lo de camada principal. Vou pressionar Enter. E em uma cama, ficará claro por que esta camada tem um nome de camada principal. E é, sua posição pode estar em qualquer lugar que você quiser. Ok, isso não importa. Agora vou para a coluna Animação, certo? Se ele não estiver aberto em uma guia como esta, basta clicar duas vezes aqui para abri-los e tab, e eu quero criar outra camada de texto aqui. Então eu vou clicar na ferramenta Texto, clique aqui, e eu posso preenchê-lo com qualquer texto que eu quiser. O conteúdo realmente não importa, mas eu vou escrever texto capturado aqui, ok? E eu vou sair, está bem? E há duas coisas que queremos ter certeza aqui com esta camada em particular. A primeira coisa é que o ponto de ancoragem está no canto inferior esquerdo. E se você não sabe como mover o ponto de ancoragem dele em outro lugar, basta agarrá-lo com esta ferramenta. Já mencionei isso antes, mas enfureça essa ferramenta, segure o Comando e encaixe-a. Certo, não vou contar de novo. Portanto, certifique-se de que o ponto de ancoragem está no canto inferior esquerdo. E a outra coisa que eu quero fazer que nós queremos ter certeza é que ele está preso na coordenada superior esquerda, direita. Então, para isso, eu vou para a propriedade posição. Aqui está um atalho para você. Se você estiver selecionando a camada e pressionando P no teclado, poderá ver diretamente a propriedade position. E porque eu quero que ele fique preso à borda esquerda, eu quero que a distância x seja 0. E a distância y terá que globo ocular deve ser como apenas arrastá-lo para aqui, mas deve ser a altura desta camada de texto. Então eu estou apenas olhando para ele e cutucando usando meu teclado, teclas de seta. Então, sim, vamos deixar isso aí. E assim, temos outra camada de texto dentro da composição de animação. O próximo objetivo é obter quaisquer dados de texto que estão nesta camada, a camada principal no modelo vêm para esta camada de texto particular que acabamos de criar. E você já sabe como fazer isso. Quero dizer, se você pode descobrir isso em sua cabeça e escrever a expressão para isso, vá em frente e faça isso. Mas eis o que vou fazer. Como a propriedade text de qualquer camada de texto é tratada pela propriedade text source, o textContent de qualquer camada. Vou em frente e clique na opção e começar a digitar. Então, a primeira coisa que eu quero fazer é chegar às colunas do modelo. Então eu vou escrever modelo com, então eu posso escrever camada eo nome da camada, que é camada principal e ver como lindamente efeitos pós-sugere os nomes da camada. E então queremos obter a propriedade de texto. E então dentro disso eu quero ir para o texto fonte e eu posso clicar para fora novamente e você pode ver que o texto é capturado. Então, novamente, entramos no modelo de composição, essa camada principal de modelo, esse evento no texto e capturamos essa propriedade de texto fonte. Se eu mudar o valor do texto aqui, fazer algo como Olá mundo. Você vê que esse valor será refletido aqui na camada de textos capturados. Agora, como eu disse antes, você pode escrever as expressões dessa maneira compacta de busca ou pode dividi-las em alguma, algo assim. Então eu vou criar uma nova variável chamada de camada de texto, que irá pegar o, o, a camada de texto principal que está presente no modelo com. Então foi assim que você agarrou a camada. Em seguida, você pode criar uma nova variável que armazena os dados de texto principais, que serão novamente homens, principais textos camada ponto, ponto de texto fonte. E então Alice atribuirá esse valor. Para o texto, a propriedade text source desta camada específica. Então eu posso fazer isso. Agora todo esse código significa a mesma coisa que o anterior único forro que reescreveu. É a mesma expressão, só um pouco mais legível. Mas você fez a escolha aqui se transformar uma expressão de uma linha em algo assim vale a pena para você ou não. Então eu vou deixar o verboso, enquanto aqui, e eu vou clicar para fora, e agora temos o link para o texto aqui. Portanto, quaisquer alterações que eu fiz neste texto serão refletidas neste texto aqui. Ótima. Agora eu queria criar duplicatas deste Wrangler de texto, este aqui e organizá-los verticalmente para que eu possa pressionar o Comando D e eu vou arrastar isso para baixo, e eu vou arrastar isso aqui. Então pressionarei o Comando D novamente e arrastarei isso aqui. Não, só estou brincando. Quem quer fazer todo o trabalho manual? Talvez você possa escrever expressões para isso, certo? Então, segure. Vou apagar os copiados agora antes escrever qualquer expressão para organizá-los verticalmente corretamente, eu queria explicar como todos os cálculos serão feitos e como tudo vai funcionar. Então, siga-me. Mas espera, espera, espera, espera. Só um pouco de configuração. Antes de entrarmos nessa explicação, entrarei na posição de propriedade desses fatos para que eu possa derrubar isso. Há a propriedade position e eu vou clicar com o botão direito do mouse e clicar na dimensão separada. Isto dará duas propriedades diferentes para a posição x e y. assim x posição e posição y. Lembre-se que para esta tendência no seu todo é uma matriz de dois números, mas cada um deles é apenas um tipo de dados número, por isso é mais fácil de acessar um deles estavam em apenas trabalhar com ele, porque estaremos apenas animando a posição y para esta animação. Ok, agora eu vou apenas ir em frente e mudar o valor de Hello World para apenas texto. Está bem? Só porque é leve e Helloworld é um pouco demais. Não foi por isso que fiz isso, mas só quero ter uma mensagem aqui. Ok, então uma vez que eu tenho isso aqui, o que eu vou fazer é selecionar esta camada e pressionar Command D e criar uma cópia de arrastar esta cópia para baixo o texto capturadot2. E com a textura de captura selecionada, eu só vou arrastá-la para cá por enquanto, ok? E agora podemos ver como tudo vai funcionar. Então, novamente, temos essas duas camadas aqui, texto capturado e tanques capturados. Para. A primeira coisa é que o tipo de lista que estamos tentando fazer de textos, o valor x de cada um desses pontos âncora diretamente no valor x. Então ponto de ancoragem ou todo o objeto tem, é representado por um valor x e y. Todos esses textos têm o mesmo valor x, apenas o valor y ou vertical está mudando, certo? Então o que podemos fazer é eu posso voltar para o After Effects e eu posso ir em frente e conectar os valores x dessas duas camadas. Para fazer isso, eu vou para o texto de captura 2 e você sabe o que, enquanto VR nele, o que eu vou fazer é eu vou nomear esta camada de líder, ok? E você sabe onde eu estou indo com isso, e eu vou nomear este seguidor de camada, ok, e agora eu vou ir em frente e conectar o valor x de follower ao valor x de leader. E para fazer isso, eu vou para a opção Transformar, indo para a exposição. Clique e escreva este com, ok, este comp. E eu não preciso colocar colchetes camada ponto e eu vou escrever litro ok ponto transformar, ok ponto ponto exposição. E algo que eu gostaria de mencionar é o erro ou a coisa que eu sempre fiz. E correu em erro é porque eu não escrevi transformação, eu iria em frente e escrever ponto x posição e, você sabe, esquecer a transformação e as coisas não vão funcionar. Portanto, não se esqueça sobre a transformação porque a posição é aninhada sob transporte. E agora se eu clicar os valores x conectados, então se eu movê-lo assim, ele se move mesmo na direção horizontal. E isso é muito legal. E novamente, outra coisa que eu gostaria de mencionar aqui é que escrever esta expressão aqui é equivalente a fazer isso. Eu posso ir em frente e apagar isso. E então eu posso ir em frente e selecionar a exposição, pegar o chicote daqui e conectá-lo com a explicação disso. E, novamente, essa expressão exatamente a mesma que ela escreve. Mas eu não te disse isso até agora. Então agora você sabe como os mips de pico eram muito grandes. E a coisa legal sobre tudo isso é que se eu criar várias cópias de seguidores, certo? Por exemplo, este é um seguidor, este é um, deixe-me apenas arrastá-los para fora para que eles estão todos sobrepostos agora, mas eu vou apenas arrastá-los para fora. E o legal é que, uma vez que conectamos a posição dos seguidores, a posição x com o líder, e então fizemos cópias dos seguidores. Todos eles terão a mesma posição x, certo? E eles vão segui-lo. Então isso é algo que eu acho que ele já sabia, mas eu só queria mostrar a vocês que com este vídeo, estamos tocando a marca de 10 minutos. E eu não quero estender isso. Temos esta boa configuração. E no próximo vídeo, vamos ver como estamos fazendo a matemática para calcular a posição x, desculpe, as posições y do resto dos seguidores. E então vamos animá-los e adicionar certos efeitos legais. Então, sim, eu espero que você esteja acompanhando e eu espero que você tenha essa configuração até agora, essa animação em particular, e eu vou vê-lo no próximo vídeo. 8. Juntando tudo no lado - 2: Ok, bem-vindo a este vídeo. Onde quer que estejamos dando continuidade ao projeto de animação que começamos no último vídeo. Então estamos tentando fazer uma lista de texto como este que podemos animar mais tarde. E nós estávamos tentando não fazer isso, para não fazer uma lista como esta manualmente, mas ao redor eles estão usando expressões. E até agora temos um líder e um seguidor. E a posição x seguidores está conectada aos líderes. Legal. E como eu expliquei, o que importa é a posição y dos seguidores. Isso é algo que precisa ser calculado porque a posição x requer apenas uma conexão simples. Mas a posição y precisa ser calculada. Então vamos nos concentrar na posição y das camadas seguidoras aqui. Então agora no Canvas temos essas duas camadas, um líder e um seguidor. E, claro, teremos mais seguidores depois disso. Agora o valor y da camada de seguidor é, naturalmente calculado usando o valor y da camada acima, certo? Assim, o valor y da camada de seguidor será o valor y da camada acima dela, que agora é apenas a camada de líder, ok? O valor y do líder acima dele, mais esse espaçamento, esse espaçamento entre eles, mais a altura da camada. Então eu posso escrevê-lo como uma equação como o valor y desta camada particular é igual ao valor y da camada acima. Então o valor y da camada acima, Eu acho que a minha caligrafia melhorou um pouco. Mais este espaçamento, vamos chamá-lo de espaçamento. Esta é a diferença entre estes dois, você sabe, um bloco de texto, desculpe, eu blog, um blog de certa altura. A altura desta camada era a altura da camada de texto. Certo, minha caligrafia voltou a ser ruim de novo. Então esta é a equação. E se não estava claro, o espaçamento basicamente significa o pequeno espaço vazio entre quando fazemos uma lista como esta. Então vou fazer outra cópia. Então um som para pressionar o Comando D e fazer uma cópia. Vou arrastar isto. Então, quando você faz uma lista este espaçamento que deve ser consistente, em seguida, ser espaço entre cada texto subseqüente é o que eu estou chamando espaçamento. Então vou apagar isso e voltar para a nossa posição inicial. Agora, há uma coisa importante que precisamos entender em relação ao cálculo. Agora, considere esta lista de exemplo fora de um líder e como 1, 2, 3, 4, 5 seguidores. Ok, e vamos olhar, digamos seguidor e número quatro no ponto de ancoragem ou seguidor número quatro. E então uma coisa importante a notar é que nesta equação que fizemos não estão diretamente confiando e enfatizando diretamente escrever diretamente contando a posição y do líder para calcular a posição y de um determinado seguidor. E você só está confiando, por exemplo, no outono, somos quatro na camada acima. Então, para ele, será seguidor três, certo? valor y da camada acima abençoa o espaçamento mais a altura desta camada específica para calcular o valor de y. certo? E isso, por sua vez, por uma cadeia está ligada ao líder, o valor y do líder, mas não diretamente. Tudo bem, agora eu espero que você tenha entendido tudo o que fizemos até agora. Mas ainda assim, se houver alguma confusão, ficará claro quando começarmos a escrever algumas expressões. Então vamos chegar a isso. Agora queremos escrever expressão que tem como alvo a posição y da camada de seguidor. E lembre-se que eu já conectei o texto fonte para o texto aqui no caso de você ter esquecido, Faz muito tempo desde que eu estive assistindo este vídeo ou você fez uma longa pausa. E, em seguida, a nossa continuação e também irá dividir a posição em x e y posição, certo? Então queríamos escrever expressões para a posição y. Então, eu clique na opção. A primeira coisa que eu vou fazer é criar uma nova variável e chamá-la camada acima. Ok, isso é apenas um nome que eu dou. Você deu a esta variável de valor particular. E eu vou atribuí-lo a esta camada de ponto com. E novamente, se eu quisesse segmentar a camada acima, esta camada será o índice da lista, esta camada menos1. Certo, isso faz sentido. Ótima. A coisa número 2 que eu queria fazer é obter a posição y da camada acima. Então preste muita atenção aqui porque não escrevemos exatamente essa coisa antes. Então eu vou escrever camada de deixar acima da posição y. Está bem? Então eu estou usando nomes de variáveis muito detalhados e muito explicativos aqui. Geralmente uma boa idéia, e esta variável será atribuída a camada acima, ok, dot transform. Agora, em vez de escrever posição, eu vou escrever sua posição, certo? Isto é o que os efeitos secundários sugerem. E agora nós temos a posição y, então eu vou ir em frente e obter a altura desta camada particular. Tudo bem, lembre-se, nós precisamos, nós precisamos, a posição y era este espaçamento mais a altura. Então eu vou escrever deixar a altura da camada é igual a, agora todas as camadas, todos os textos são exatamente os mesmos. Então você pode direcionar essa camada específica e digitando neste índice de camada com ponto. Ou também podemos usar apenas usar camada acima do intervalo. Então, porque todas as camadas que são iguais manterão o mesmo texto, elas também terão a mesma altura. Agora estou sem fôlego lá. Então preste muita atenção, eu vou te mostrar algo novo. Então eu gastei para bater camada acima da fonte, rect no tempo, tudo bem, altura do ponto. E é assim que você obtém uma altura de algo em uma tela usando expressões. Fonte rect no momento é algo que fará por você. Muito bom lembrar porque muitas vezes acontece que você tem que saber a dimensão de um objeto. Você pode fazê-los usando fonte rect no momento, escrevendo esta altura de ponto, ou você pode escrever largura pontilhada para obter a largura do objeto em particular, mas precisamos de uma altura aqui, certo? E agora eu vou seguir em frente e criar uma nova camada e chamá-la de espaçamento. Então vamos espaçamento e estou bem. Eu só estou bem. Agora, espaçamento, espaçamento de linha e eu vou dar-lhe o valor de 50, ok, apenas um número aleatório. Você pode conseguir cem, quinhentos, seja lá o que for. Definitivamente é apenas o espaçamento entre estas etiquetas. E eu dei para ser o valor de 50. E agora é hora de usar a equação que escrevemos. Lembre-se, o valor que vamos atribuir à posição y será simplesmente camada acima da posição Y mais espaçamento mais altura da camada. Tudo bem, eu vou clicar e eu vou clicar para fora e você vê que ele se ajusta sozinho. E agora veja se eu criar mais cópias da camada de seguidor, eis o que acontece. Então, se eu criar mais cópias pressionando Comando D, Eles serão automaticamente posicionados corretamente, que é grau. Imagine fazer isso manualmente, tanto trabalho duro, mas agora eu posso criar qualquer número de cópias e o será posicionado corretamente. E o que mais eu posso fazer é se eu quisesse atualizar o texto como já que todos os textos na animação estão ligados a este aqui, eu posso escrever, hey, eu vou rever esta aula, certo? E então todo o texto aqui será atualizado. Ou eu sinto muito, eu só vou dar um nome. Eu definitivamente vou dar a esta classe cinco estrelas. Se esse é o sistema de leitura quando ele vai aqui, é estrelas ou é ele, eu não me lembro, mas basta rever a classe e dar-lhe uma boa classificação. Vai significar muito para mim, cada vez que lerem as críticas que vocês deixarem na minha aula, isso é tão bom. Então você pode ver que tudo está ligado e quão lindamente isso, tudo funciona em conjunto. E é aqui que expressões podem ser tão úteis. Não precisávamos medir a posição, criar duplicatas e arrastar por aí. E se mais tarde quisermos mudar a posição, não precisaremos ajustar cada uma dessas camadas individualmente. Eu posso mover isso e tudo se move com ele. E se eu quisesse mudar o tamanho da fonte, eu posso selecionar tudo. Eu posso entrar em meus painéis de caracteres para que eu possa aumentar o tamanho da fonte e o espaçamento entre eles ainda será 50. E isso é ótimo. Agora eu não quero esse tamanho de fonte grande, então eu vou pressionar Command Z. Agora, e se eu quisesse mudar o espaçamento entre eles, como se fosse 50 agora, se eu quisesse mudar esse espaçamento? O que eu vou ter que fazer é, ok, o que eu vou ter que fazer é excluir todas as camadas ou as camadas seguidoras exceto uma, e então entrar na expressão. E digamos que eu queira mudar para 100 e posso mudá-lo para 100. Tudo bem, então você pode ver que ele está deslocado para baixo e então eu posso ir em frente e criar várias cópias dele e o espaçamento será 100. Mas isso é apenas relaxar. Não queremos fazer isso de novo e de novo. Você sabe, para escrever este espaçamento, um excluir tudo e atualizar o espaçamento, e, novamente, criar cópias. Não queremos fazer isso. Então aqui está uma técnica. Você não precisa, você não terá que fazer todo o procedimento para mudar o espaçamento. Vamos voltar para a nossa camada de template e eu vou deslizar a camada aqui, que é a camada principal. Então eu vou entrar no painel de efeitos e predefinições. Novamente, ele estará sob a janela se não forem efeitos visíveis e predefinições. E eu vou procurar por controle deslizante. E eu vou deslizar isso, desculpe, eu vou arrastar isso sobre a camada principal, exatamente assim. E isso irá adicionar um pouco este pequeno controle deslizante em Controles de efeitos. Então eu posso ir em frente e renomear isso. Vou mudar o nome para espaçamento. E agora você já sabe o que estamos fazendo. Queremos que o espaçamento entre as tags com DAPI irá criar para mudar com o valor do controle deslizante. Certo, mas como conectamos o controle deslizante à variável de espaçamento que está aqui? Às vezes precisamos de um pouco de ajuda para escrever certas expressões como, por exemplo, esta. E para fazer isso, o que temos que fazer é algo assim, ok, então eu vou selecionar qualquer valor aleatório para o qual eu possa escrever uma expressão, e que tem um grande chicote por trás disso. Então, por exemplo, vamos selecionar Opacidade, certo? Então eu vou apenas ir em frente e arrastar isso, escolher o chicote e arrastá-lo sobre o controle deslizante. E como eu mostrei a vocês em uma instância antes, que, como os grupos funcionam é que eles apenas conectam a propriedade escrevendo uma expressão. Então, aqui você pode ver a expressão é deslizantes de espaçamento perfeito. Isso é algo que precisamos conectar a este controle deslizante particular. Ok, então eu vou em frente e Comando X, parar com isso, e deixar tudo como está. Eu vou para o Animation com, mas em vez de escrever espaçamento, eu vou pressionar, eu vou apenas colar o valor ou a expressão que eu copiei e eu vou clicar fora. Então, é claro, há um problema com essa linha de código em particular. Você pode vê-lo? Vou apenas clicar lá fora e vamos encontrar um erro. E o erro diz que se eu agir está faltando ou não existe, este, este erro existe ou está aparecendo porque apenas o efeito não vai funcionar. Lembre-se de que o efeito é aplicado na camada principal, que está na composição de modelo. Você terá que escrever aqui usando a notação de pontos e fazer a conexão correta. Então ele vai ser modelo comp, certo? Camada de ponto e o nome da camada é camada principal. E só estou pressionando Enter efeitos secundários sugerindo o nome correto. É por isso que não tenho de escrever a coisa toda. E então eu vou escrever ponto. E se eu clicar no lado de fora, você pode ver que ele está conectado agora. E como nos certificamos de que está conectado? Vou em frente e criar várias cópias, está bem? E então eu vou para o modelo comp. E se eu aumentar esse controle deslizante, você verá que o, ele se ajusta. Mas você sabe o que é melhor para ver isso em tempo real. Então o que eu posso fazer é ir para o painel de projetos e arrastar uma instância da composição de animação para aqui. Está bem? Agora, se eu ir em frente e selecionar a camada principal e entrar em controles de afeição e ajustar o controle deslizante. Você pode ver que eu posso ajustar o espaçamento entre os textos dinamicamente. E isso é uma espécie de aparelhagem e animação agora você pode fazer o que quiser, e tudo irá fluir e seguir corretamente sem que você tenha que animar várias coisas individualmente por conta própria. Então eu realmente não preciso da camada de animação aqui. Então eu vou em frente e deletá-lo. Então esta é a camada principal dentro do modelo. Esta é a animação. E agora eu posso ir em frente e começar a animar tudo o que está dentro desta composição em particular. A primeira coisa que vou fazer é mudar este texto daqui porque é muito estúpido. Então eu vou para a composição de modelo, ir para a camada principal e renomear isso para apenas um monte de Olá, Olá, Olá. Você pode digitar o que quiser. Acabei de assinar e vou bater “Ok”. Vou clicar lá fora e o texto deveria ter sido atualizado aqui. Então o erro foi porque seu cap lock, se seu Caps Lock está em um After Effects mostrará, hey, você não pode atualizar se você é um código de catálogo, então eu esqueço esse tipo de erro, apenas Turner caps lock off. Além disso, observe que apenas conectando os dados de texto de cada camada de texto aqui a essa camada principal específica. E não estamos conectando o estilo da fonte, por exemplo, a fase de tipo deste usando a ciência da fonte, etc. Assim, todos eles podem ser ajustados aqui de forma independente. E a propósito, estou usando o tipo de letra, enorme gótico para todos esses textos aqui. Provavelmente é de graça. Eu não tenho certeza, mas você pode usar qualquer tipo de letra. Sinta-se como realmente, a próxima coisa que eu vou fazer é selecionar tudo e aumentar o tamanho da fonte suficiente para que tinha se encaixa a largura da tela corretamente. Então, sim, isso parece legal. E a próxima coisa que eu vou fazer é criar cópias suficientes do tamanho de seguidores que transborda um nível. Então o Comando D, o Comando D, e você sabe, havia mais alguns seguidores aqui. Certo, e ficará claro em um segundo por quê. E agora podemos apenas animar a camada de líder e tudo o resto irá segui-lo. Então, uma coisa importante aqui, apenas, você sabe, apenas uma pequena técnica de fluxo de trabalho é que para todos os seguidores, olhem para este escondido em particular, este ícone parece um cara pegando atrás de uma parede. Então eu tenho todos esses desligados para que possamos selecionar e então os sindicatos Calais podem alternar. Então, para todos os seguidores, mantenha-o escondido para que quando você clicar fora e clicar aqui, eu só possa ver a camada de líder. Isto é para se você quiser se concentrar exclusivamente em uma camada, você faz isso. E agora, eu só quero focar exclusivamente na camada de líder para que eu possa animar todo esse comunicador para parecer que é um rastejo infinito de textos. Ok, então é assim que vamos fazer isso. Então eu vou selecionar o líder pressionando P, e nós não vamos animar a exposição, mas a posição y. Então, com o seu indicador de reprodução no início da linha do tempo, clique e adicione um pequeno quadro de teclas. Em seguida, ele irá para o final e adicionar outro quadro-chave. E vamos ver se consigo arrastá-lo para o Andy. Sim, lá vai você. 1 segundo marca porque este comp, se lembrar, é um segundo longo, ok, Agora aqui, o que nós só queremos fazer agora é que queremos que o líder siga em frente e se mova para cima de tal forma que seja quase a mesma coisa. Então, eis o que quero dizer. Ok, então eu não posso arrastar meu indicador de reprodução para o extremo, mas você sabe o que, eu apenas vou mover este quadro-chave aqui e, em seguida, animar e, em seguida, mover o quadro-chave para o fim mais tarde. Por isso, agora vou em frente, segurar o Shift e usar a minha flecha para cima. Não empurrou tudo um pouco e só queremos que seja o mesmo de antes. Então parece um loop infinito. Então eu vou acertar o espaço e deve parecer um loop infinito. Sim, aí está. Nós apenas avançamos para que este seguidor assumisse a posição de líder. E é por isso que, você sabe, parece um pergaminho infinito se você deixá-lo tocar assim. Então, sim, isso é muito legal, não é? E se a animação não estiver em loop na visualização, tudo o que você quer ter certeza é que você tem a visualização da janela ativada. E este ícone em particular. Não é meio aberto, mas totalmente fechado. E então ele vai jogar assim. Ok, ótimo. E eu também arrastei esse quadro de chave até o final novamente depois de ajustar a posição. Então, isso é bom. E agora o que quero fazer é criar uma nova composição. Vamos chamá-lo de Teste 1 porque podemos apenas criar versões diferentes da animação agora. E eu vou escolher uma espécie de azul brilhante para o fundo. Então eu vou apertar Ok, e eu vou bater Ok novamente, e esta nova composição em particular é adicionado e eu vou arrastar uma instância da composição de animação aqui assim. E se eu tocar no jogo, ele vai olhar novamente o mesmo. Isso é bom. E agora eu posso adicionar efeitos sobre esta instância de animação com. Então, eu vou para efeitos e predefinições por enquanto. Vou arrastá-lo para cima e descobrir as coordenadas polares. Ok, então eu vou apenas ir em frente e arrastá-lo sobre esta composição em particular aqui. Então eu vou mudá-lo de vermelho para polar e ajustá-lo para 100. E olha para isto, olha para isto, certo? E parece que tudo está sendo sugado. Mas se você quiser fazer com que pareça um alto-falante, o que eu posso fazer é clicar com o botão direito do mouse nesta composição, ir para o tempo e ir para a camada reversa do tempo. E se eu tocar no play, você pode ver que vai parecer que tudo está apenas emanando de lá. Então este é um pequeno efeito agradável que você pode ter. E então nós também podemos fazer algo como, vamos pressionar R e ir para a opção de propriedade de rotação. Clique na rotação e vamos digitar no tempo e FAD e olhar, olhar, olhar, olhar como isso parece. Então isso é de novo, você diz isso de novo, algum legal que você pode ter, certo? E você sabe, só para fazer parecer um pouco melhor, eu vou clicar em Adicionar animação, esta compressa pediu para dar a escala e apenas diminuir a escala um pouco. E eu só vou pressionar Espaço para pré-visualizar e sim, olhe para isso. E parece legal, não é? E a melhor parte sobre esta melhor parte sobre todos estes que são realmente como imaginar que você está fazendo algo assim para um cliente ou para o seu projeto. E você sabe, uma mudança acontece que você tem que acomodar, por exemplo, a mudança de texto. Se alguém disser, Oh não, que todos os cumprimentos da Jeanette devem ser minúsculas. Então, sim, então eu só tenho que fazer mudanças em um lugar e essa mudança será propagada para este particular, a animação final, o que você fizer através da composição de animação. E isso foi ótimo. Vou pressionar o Comando Z algumas vezes para voltar à animação original. Ok, então o ponto era dizer que expressões e as formas normais de trabalhar como quadros-chave, etc Ambos funcionam muito bem juntos em companheirismo, não é que você tem que usar expressões exclusivamente ou o maneira normal de animar exclusivamente. Eu acho que isso é muito óbvio e isso nem exige que eu te diga. Mas agora você sabe que com sua maneira regular de animar onde você adiciona quadros-chave, etc. Há também expressões que podem automatizar algum trabalho grunhido como mudar texto em cinco lugares diferentes ou, você sabe, o ajuste, espaçamento e tudo isso. Então, eles trabalham muito bem juntos. E isso foi tudo para este vídeo, eu acho que estão muito perto da marca de 20 minutos. Peço desculpas se você não gosta de vídeos mais longos, mas eu tenho que mostrar essa animação e eu tive que fazer um ponto de vista. Então, de qualquer maneira, eu vou vê-lo no próximo vídeo onde vamos falar mais sobre expressões e concluir esta classe. Esperemos. 9. Conclusão e que o próximo momento: Ok, então estamos na última lição desta aula e neste momento há algumas coisas que eu estou esperando. Espero que as expressões não sejam mais apenas hieróglifos para você. Eu estou esperando que expressões agora não é algo que você iria encontrar na Internet e só queria copiá-lo, colá-lo após o lugar necessário e ser feito com ele. Eu estou esperando que se você olhar para uma expressão agora você deve ser capaz de escolher partes de uma variável de lag e a notação de ponto para atravessar para uma determinada camada é para uma propriedade de uma determinada camada. Então você pode escolher essas partes. E se necessário, você também pode fazer alterações nessa expressão para fazê-la se comportar e da maneira que você quer em vez de eu usá-la apenas para o que foi escrito. Espero que tomar esta aula tenha sido uma espécie de empurrão suave em uma porta, na porta que se abre para o maravilhoso mundo das expressões. E agora que você empurrou a porta um pouco, você pode espreitar dentro do mundo das expressões e também não ter medo de realmente entrar mais nesta classe, vou lhe dizer mais algumas coisas. Expressões vinculadas compartilham recursos que estou usando para aprender mais sobre expressões. E no final, mas você Pharrell. Então, sem muito delongas, vamos voltar ao After Effects. Agora estou dentro do After Effects com um quadrado amarelo e a tela. Agora, se eu entrar em quadrados, transformar e posicionar, e eu opção clique na posição como se eu estivesse prestes a escrever e expressão. Você verá este pequeno botão Play aqui dentro. Este é o menu preenchido com ajudantes de expressão. Vamos dar uma olhada. Há coisas muito avançadas no topo ou mesmo em como geralmente espalhadas ao longo deste minuto há algumas coisas muito avançadas. Então, se você decidir mais tarde aprofundar, você pode usar este menu para adicioná-los automaticamente. Vamos ver como podemos usar este menu. E vamos olhar para uma das expressões legais incorporadas que você pode adicionar a partir daqui. Se você descer aqui para a propriedade e você verá um par de coisas familiares como valor, valor no tempo, coisas que você já sabe, mas você também vai encontrar algo chamado wiggle. E se você clicar em vagal, verá que ele é automaticamente adicionado ao painel de expressão. E aqui está um monte de mais códigos para indicar o que precisa ser preenchido. Não precisamos nos preocupar com esses três últimos de Octavius até o tempo. Nós não precisamos nos preocupar com o então deixe-me selecioná-los e pressione backspace para se livrar dele. E vamos em frente e preencher dez onde aberração ou frequência é escrita e 50 onde amplitude é escrita. Vou explicar daqui a pouco o que esses números significam. Então eu vou clicar lá fora. E se eu clicar, desculpe, não clique no espaço de imprensa bunda, você vai ver que o quadrado vai absolutamente bizarro em vagal e em outras funções como wiggle, você tem que fornecê-lo com certos parâmetros. Essas coisas que vão dentro do suporte, essas aqui, são chamadas de parâmetros para contorcer, os parâmetros são frequência, então o primeiro número é frequência e amplitude. Frequência é quantas vezes por segundo o valor da propriedade deve aumentar ou diminuir. E amplitude significa até que ponto. Então, se eu definir frequência ou FREQ ou Frank, se você vai lembrá-lo para algo baixo, gostaria de escrever, você vai ver que o quadrado vai se mover com menos frequência, então ele se move com menos frequência. E se eu aumentar a amplitude, quero dizer até que ponto o quadrado pode se mover para a luz solar, 300, você verá que ele vai se mover mais longe de sua própria posição, certo? Você vê isso? Você pode ajustá-lo de acordo com o que funciona para você. Vamos com algo como 80 e 300. Vamos ver como isso parece completamente Masaryk, 80 ou frequência. Então está acontecendo mais vezes por segundo, mas sim, o resto daqui cabe a você explorar. E agora deixe-me apresentá-los a alguns recursos que estou usando para aprofundar a expressão e como você pode usá-los. Então vamos em frente e verificar os recursos. E claro que vou deixar os links para todos esses recursos nesta classe tem recursos. Então, sim, o primeiro é motion script.com. É um recurso antigo e dourado que existe há tanto tempo. E eu acho que muitas expressões veteranos realmente usaram o site específico da mesa para aprender. E se você entrar neste link particular chamado Mastering expressões, você será capaz de aprender muito, muito mais exatamente de um-para-um para todas essas coisas extras como se mais condicionais, eu já apenas algo que eu já disse você, então você pode se preocupar com seno e cosseno e tudo mais. Então, basta clicar em qualquer um destes ou apenas seguir ao longo do topo. Estes são artigos muito curtos e você pode passar por eles em uma quantidade muito menor de tempo e também aprender muito, certo? Então eu vou clicar fora deste recurso, mas lembre-se da próxima coisa. Se você queria aprender uma expressão, deveria ser se mais condicionais, estes, estes serão muito legais. Certo, vamos ao Google Doc em particular. Eu copiei este link para este documento do Google do vídeo de Ben Marriott, que também é mencionado aqui. E ele, aqui, você vai encontrar algumas expressões bacanas do After Effects, certo? Que você também pode assistir a partir deste vídeo em particular que está aqui. Ok, agora eu abro este ponto só para mostrar como as expressões são normalmente escritas, certo? Então vamos olhar para estas expressões que tem mantido escala quando os pais tiveram. Então vou copiar o código e colá-lo em algum lugar. Esse pouco torná-lo mais legível, então eu vou colá-lo aqui. Ok, agora primeiro de tudo, você vai ver que esta linha em particular, esta é uma variável que cria uma matriz vazia, certo? Você deve ser capaz de notar que agora duas coisas ou várias coisas importantes é que não há deixar na frente do nome da variável, que é S agora, certo? Assim, a forma como o JavaScript funciona é que, em certas condições, você pode omitir Let e JavaScript ainda criará uma variável para você. Então omitindo deixar aqui funciona por causa das condições que são atendidas dentro do painel de expressões. Mas eu vou sugerir que é sempre uma boa idéia prefixá-lo com o lead. E outra coisa importante a olhar aqui é que a variável chamada escrita aqui, como eu avisei antes nesta classe, é simplesmente como uma não-descritiva. E lembre-se dos nomes de variáveis que usamos, camada acima, camada acima da posição e todo o código detalhado que escrevemos. Então você sabe, ter apenas um nome de variável que é S ou P, S. Ótimo, não ótimo. Tente escrever a coisa toda. Então a coisa é que mesmo agora se você encontrar uma expressão como esta, nós seremos capazes de entender, certo? E então há S e P, S, e este S é então atribuído ao valor, certo? Terei que ler onde isso vai. Esta expressão definitivamente não vai aqui. Isso é quando há um erro. Então vou apagar e voltar. Você pode assistir ao vídeo e aprender mais sobre isso aqui. Então a coisa a tirar deste recurso é a omissão do lead que é permitido e não, não crie nomes de variáveis que são S e P como apenas ser um mais descritivo, ser mais descritivo, nem tudo mais. O que aconteceu com a minha gramática, e a outra coisa importante que quero falar é o ponto e vírgula. Então, em JavaScript, você também pode omitir o ponto-e-vírgula. O ponto-e-vírgula tem um opcional. Então não se preocupe com isso. Ok? E daqui também, como no último recurso que eu lhe disse para aprender se mais condicionais avançando, a próxima coisa que você deve aprender ao seguir em frente a partir daqui é quatro e loops. Então, se você está observando em algum lugar, anotado. E o último recurso que eu quero adicionar que eu vou compartilhar com você. Eu realmente não me lembro de onde eu tirei isso. Definitivamente eu não escrevi isso. Talvez eu tenha pego do Reddit ou de algum vídeo do YouTube, eu não tenho certeza. Então, o crédito a quem criou isto. Então você pode passar por tudo isso. Há um monte de atalhos e há um monte de expressões e o que eles fazem para que você possa passar por eles e aprender mais. E, claro, como eu disse antes, você encontrará o link para todos os seus recursos na seção de recursos desta classe. Deixe-me saber se você gosta desta aula. Se você quiser, você pode deixar um comentário para, ou se você está preso em algum lugar, você pode aparecer nas discussões e eu vou ter certeza de ajudá-lo lá fora. Ou se quiser falar sobre algo geral, me ligue no Twitter. Aqui está o endereço. Deve estar na tela. E se você quiser que eu faça uma parte dois desta classe com expressões mais avançadas, me avise também. E vejo-te em breve numa turma diferente. Adeus.