Domine animações virais de UI no Adobe After Effects | Vladislav Sateev | Skillshare

Velocidade de reprodução


1.0x


  • 0.5x
  • 0.75x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Domine animações virais de UI no Adobe After Effects

teacher avatar Vladislav Sateev, Video Editor

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Aulas neste curso

    • 1.

      Boas-vindas!Comece aqui

      1:35

    • 2.

      Baixe todos os recursos do curso, kits de UI e arquivos de prática

      0:17

    • 3.

      Onde encontrar designs de UI gratuitos para projetos de animação.

      0:59

    • 4.

      Fluxo de trabalho 1: anime capturas de tela usando máscaras no After Effects

      6:42

    • 5.

      Fluxo de trabalho 2: recrie UIs a partir de capturas de tela diretamente no After Effects com

      8:56

    • 6.

      Fluxo de trabalho 3: anime os designs do Figma com o Illustrator + AE

      9:02

    • 7.

      Fluxo de trabalho 4: importar arquivos de UI em PDF para o Illustrator e After Effects

      4:45

    • 8.

      Crie modelos de UI reutilizáveis para projetos de movimento futuros

      1:57

    • 9.

      Como usar o Animation Composer para UI Motion Design

      7:01

    • 10.

      com esse plugin essencial do After Effects?

      10:36

    • 11.

      Acelere suas animações de texto com o TextEvo

      5:10

    • 12.

      Parabéns!

      0:31

    • 13.

      Use o ChatGPT para fazer um brainstorming de ideias de animação de UI Viral.

      3:19

    • 14.

      Prepare os recursos e layouts de UI para animação

      4:00

    • 15.

      Anime o design da UI no After Effects (Parte 1)

      18:39

    • 16.

      Continue a animar e adicione efeitos de interação (parte 2)

      15:26

    • 17.

      Adicione música, efeitos sonoros e acabamento final do áudio

      13:31

    • 18.

      Como exportar sua animação de UI do After Effects para as redes sociais

      1:42

    • 19.

      Último passo!

      0:45

  • --
  • Nível iniciante
  • Nível intermediário
  • Nível avançado
  • Todos os níveis

Gerado pela comunidade

O nível é determinado pela opinião da maioria dos estudantes que avaliaram este curso. Mostramos a recomendação do professor até que sejam coletadas as respostas de pelo menos 5 estudantes.

169

Estudantes

2

Projetos

Sobre este curso

Você vai aprender a animar designs de interface do usuário (UI) usando o Adobe After Effects, mesmo que nunca tenha usado o software antes.

Este curso para iniciantes orienta você pelo processo completo de criação de motion graphics para sites, aplicativos e conteúdo de vídeo. Você vai explorar fluxos de trabalho do mundo real, instalar plugins úteis e concluir um projeto completo de animação de UI do início ao fim.

Você vai começar reunindo recursos gratuitos de UI e preparando seus arquivos. Em seguida, você vai aprender quatro fluxos de trabalho diferentes para animar UIs a partir de capturas de tela, PDFs, Figma ou Illustrator. guache guache ou a técnica Ao longo do caminho, você vai usar ferramentas como o ChatGPT para brainstorming e finalizar adicionando som e exportando sua animação.

As técnicas de animação de UI que você vai aprender são perfeitas para criar conteúdo que param a rolagem para o TikTok, Reels do Instagram e Shorts do YouTube—quer você esteja criando para clientes ou para sua própria marca.

Ao final do curso, você terá um projeto de UI animado e polido para compartilhar em seu portfólio, nas redes sociais ou com clientes em potencial, além da confiança para criar mais por conta própria.

o que você vai ser capaz de fazer

  • COMECE A ANIMAR RAPIDAMENTE — Pegue UIs gratuitas, baixe arquivos e prepare seu primeiro projeto em minutos.
  • 4 FLUXOS DE TRABALHO PROFISSIONAIS — aprenda 4 maneiras de dar vida a UIs estáticas com técnicas de animação do mundo real

  • MODELOS DE UI REUTILIZÁVEIS — economize tempo com modelos que você pode usar repetidamente em todos os projetos
  • CRIE A PARTIR DE QUALQUER TIPO DE ARQUIVO — Anime UIs a partir de capturas de tela, PDFs, Figma ou Illustrator com facilidade.

  • INSTALAÇÃO DE PLUGINS IMPRESCINDÍVEIS — Configure as melhores ferramentas gratuitas para designers de movimento em segundos

  • USE IA PARA FAZER UM BRAINSTORM — Aprenda como o ChatGPT pode ajudar a gerar ideias inteligentes e surpreendentes

  • PROJETO COMPLETO DE ANIMAÇÃO DE UI — Crie um vídeo de movimento usando os recursos de UI do início ao fim

  • ADICIONE SOM PARA IMPACTO — aprenda a combinar movimento com som para resultados surpreendentes

  • EXPORTE PARA QUALQUER PLATAFORMA — Compartilhe animações em qualquer lugar: redes sociais, web, aplicativos, reels e muito mais

  • NÃO É NECESSÁRIO UM GRAU DE DESIGN — Aulas passo a passo para iniciantes que qualquer pessoa pode seguir.

Com mais de 10 anos de experiência em edição de vídeos para YouTube, Instagram e TikTok, sei o que é preciso para criar conteúdo com desempenho. Gerenciei dois dos maiores canais do YouTube em seus nichos, e os vídeos que editei geraram milhões de visualizações em todas as plataformas.

O fluxo de trabalho ensinado neste curso não é teoria — é o mesmo sistema que uso todos os dias no Adobe After Effects para criar conteúdo de alto desempenho para clientes e criadores. Você receberá as mesmas ferramentas e estrutura que uso para editar com confiança — seja para criar seu próprio canal ou para outras pessoas.

Estou animada para ver o que você vai criar.

Conheça seu professor

Teacher Profile Image

Vladislav Sateev

Video Editor

Top Teacher

Hi there! Welcome to my profile. I'm so glad you're here.

My name is Vlad, and I specialize in helping YouTubers elevate their content through professional video editing.

On Skillshare, I share detailed, step-by-step classes that break down my editing process into easy-to-follow techniques designed for creators of all levels.

If you're looking to create engaging, viral videos that keep your audience hooked, check out the classes below.

I'm excited to help you level up your skills and achieve your goals. Let's create something amazing together!

oVlad

Visualizar o perfil completo

Level: All Levels

Nota do curso

As expectativas foram atingidas?
    Superou!
  • 0%
  • Sim
  • 0%
  • Um pouco
  • 0%
  • Não
  • 0%

Por que fazer parte da Skillshare?

Faça cursos premiados Skillshare Original

Cada curso possui aulas curtas e projetos práticos

Sua assinatura apoia os professores da Skillshare

Aprenda em qualquer lugar

Faça cursos em qualquer lugar com o aplicativo da Skillshare. Assista no avião, no metrô ou em qualquer lugar que funcione melhor para você, por streaming ou download.

Transcrições

1. Boas-vindas!Comece aqui: Bem-vindo ao UI Animation After Effects, onde você aprenderá a dar vida a designs estáticos com gráficos em movimento nítidos e de parar de rolar. O After Effects é uma das ferramentas de movimento mais poderosas do planeta. Mas sejamos honestos, posso me sentir totalmente opressora. Você abre o software e congela. Muitos painéis, muitas ferramentas, nenhum ponto de partida claro, você fica preso. Perca a motivação e nunca termine seu projeto. O Class é feito para designers, criadores qualquer pessoa curiosa sobre animação de interface de usuário, especialmente se o After Effects parecer opressor ou muito complexo para começar Passei mais de uma década editando vídeos, gerenciando dois dos maiores canais em seus nichos e criando sistemas criativos que geram resultados Eu criei sistemas de edição que geram milhões de visualizações. Nesta aula, estou mostrando exatamente como trazer o mesmo nível de habilidade e aprimoramento às suas próprias animações Juntos, abordaremos três áreas principais configurar seus designs de interface de usuário, animar com fluxos de trabalho profissionais e efeitos posteriores, finalizar uma peça com design de som e criar um projeto sofisticado de animação de interface de usuário pronto para curtas-metragens de Tik Tok, Instagram Incluí interfaces de usuário, modelos e arquivos de prática para download gratuito para ajudá-lo ao longo do caminho Eu recomendo assistir vídeos em Adi porque cada aula se baseia na anterior Você pode controlar a velocidade de reprodução e o volume de cada vídeo para aprender no seu próprio ritmo Se você precisar de ajuda, não se esqueça de deixar suas perguntas na seção de perguntas e respostas abaixo Apenas certifique-se de verificar primeiro as perguntas existentes, pois há uma boa chance de que a pergunta a ser feita já tenha sido respondida em detalhes. Em algum momento, você será solicitado a deixar um comentário. Por favor, espere até que você tenha a chance de realmente experimentar o material. Seu feedback me ajuda a melhorar o curso e a atender melhor seu aluno. Obrigado novamente por participar desta aula. Estou realmente entusiasmado em ajudá-lo a criar belas animações profissionais de interface e, para dar a você a confiança usá-las em projetos reais em que o pessoal ou os clientes estão o pessoal ou os clientes Vamos começar a primeira lição. 2. Baixe todos os recursos do curso, kits de UI e arquivos de prática: Agora, em algum lugar ao redor deste reprodutor de vídeo abaixo ou ao lado dele, você encontrará recursos para download Esses recursos ajudarão você a aprender melhor. Além disso, você receberá alguns dos meus modelos que poderá usar no futuro. Então, eu realmente recomendo que você vá lá, faça isso rapidamente, e então vamos pular para o próximo vídeo e falar sobre sua animação. 3. Onde encontrar designs de UI gratuitos para projetos de animação: Fale sobre como obter designs de interface de usuário gratuitamente. Há uma grande variedade de maneiras de fazer isso, mas nos próximos vídeos, quero mostrar a vocês as maneiras mais fáceis e convenientes de fazer isso. Teremos duas abordagens com o After e duas abordagens com o Illustrator Portanto, se você não tiver o Illustrator, poderá usar as abordagens com o After Effects Mas se você tiver acesso ao Illustrator, ou tiver acesso ao Illustrator, comprá-lo ou ter uma assinatura melhorará drasticamente toda a melhorará Então, eu realmente recomendo isso para você. Agora, a parte mais difícil dos designs de interface de usuário não é, na verdade, a animação É a preparação do design da interface em si. As animações são bem simples. exemplo, mesmo que tenhamos que animar 100 posições e camadas diferentes, isso não é um problema porque existem algumas ferramentas Vou te mostrar como usá-los, e podemos colocá-los em três D. É super, super fácil, mas a parte de preparação é, na verdade, a que leva mais tempo. Dos próximos quatro vídeos, podemos falar sobre isso e vamos passar para os próximos quatro vídeos. Veja. 4. Fluxo de trabalho 1: anime capturas de tela usando máscaras no After Effects: A abordagem mais fácil, mas demorada, que podemos usar, e esta é a primeira que será uma captura de tela e efeitos posteriores Por exemplo, fiz uma captura de tela da página Massagm e, se quisermos animá-la , tudo o que precisamos fazer é dividi-la dividi-la Você pode fazer sua própria captura de tela ou usar esta. Isso não importa em nada. Vou apenas colocar a captura de tela no After Effects e vou criar uma composição do tamanho que eu quero Vou clicar em 1920 por 1080, e funciona absolutamente da mesma forma para falar sobre o vídeo horizontal, então será 1080 por 920, mas E em termos de comprimento, realmente não importa. Mas, neste caso , são 8 segundos. Vou pressionar OK. E então vou colocar a captura de tela aqui e vou para a área de trabalho horizontal Agora, vou selecionar nossa captura de tela. Vou pressionar Shift Option Command ou Control H. E a captura de tela caberá basicamente na lateral, de modo que o lado da captura de tela toque esse lado da composição e o lado da captura de tela toque esse lado Você pode pressionar o comando G da opção Shift, e ele se encaixará na parte superior e inferior, mas estamos fazendo o lado. Vou pressionar S, deslocar P para abrir a posição e a escala. E, na verdade, eu adoraria movê-lo um pouco, para que não tenhamos o lado à esquerda e, potencialmente , aumentemos um pouco o zoom. Temos a mesma quantidade de espaço à esquerda e à direita. E então, na parte inferior, podemos aplicar um efeito de corte. Então, vou pesquisar efeitos. Isso é chamado de console FX e você pode pesquisá-lo online. É apenas um pop-up que nos permite pesquisar efeitos em vez de eu ter ir ao painel Efeitos e predefinições Ok, então eu vou apenas procurar uma safra. Efeito de bordas recortadas. E você pode ver que temos a safra. Então, se eu aumentar ou diminuir, isso acontece nos quatro lados. E porque temos essa parte do tópico, isso significa que temos uma expressão aqui. E se eu clicar em Option ou Alton PC, vou desativá-lo Agora poderei fazer isso LO de forma independente. Então, na verdade, vou clicar em cada um deles e clicar em Redefinir, redefinir e redefinir Leo. E então vou aumentá-lo de baixo para cima e podemos ampliar para garantir que esteja perfeito. Então, vamos tentar 28. 29 29 é realmente perfeito. Talvez 29 vírgulas e uma. Sim. Acho que isso vai ser ainda melhor. Então você pode ver que cortamos com precisão. Vou pressionar a barra Shift para voltar à tela cheia E agora, na verdade, podemos abaixá-lo um pouco, para que fique do mesmo tamanho na parte superior. Aqui, temos espaço suficiente na parte superior e na parte inferior. E outra coisa que podemos fazer é pressionar Comando Y para criar um sólido. Podemos adicionar um sólido branco e colocá-lo no fundo para que você esteja pronto. Temos nossa interface de usuário. Agora, para dividir isso em vários pedaços pequenos, temos que usar máscaras. E antes de fazermos isso, é melhor renomear nossas camadas Nesse caso, será regenole. Agora vou duplicá-lo e desabilitar o original, e teremos o original também. Agora, temos que selecionar nossa ferramenta de forma ou podemos simplesmente pressionar Q e ela também a selecionará. E agora só precisamos cortar a era em partes. Então, por exemplo, vamos selecionar nossa camada original e vamos fazer uma seleção. Então aí está. Temos uma seleção. Agora, vou duplicá-la pressionando Command D ou Control G. Pressione M para selecionar a máscara, exclua a máscara e pressione Q novamente. E vamos selecionar esse ícone de engrenagem. Então, mais uma vez, Comando D, M, exclua. E vamos selecionar um apartamento no grau D. Agora, mais uma vez, comande D M, delete e vamos fazer essa parte. D M, exclua. Essa parte. D, exclua. Amplie e selecione esta parte. E agora precisamos examinar cada coisa que temos na tela e recortá-la, criar uma máscara, basicamente. Depois disso, teremos cerca de 50 camadas diferentes, talvez mais, talvez menos, e então poderemos animá-las facilmente Então, vamos fazer mais algumas coisas aqui. Só para economizar um pouco de tempo. Não vou fazer uma seleção muito boa, mas vou acelerar um pouco. Então, por exemplo, vou selecionar dois em vez de cada um separadamente. D, exclua. Vamos selecionar essa parte também. Vá lá, D, M, apague. Vamos selecionar essa parte na parte inferior. Tipo, mais ou menos ótimo. Então, se eu desativar, sim, vamos lá. Uma coisa que eu recomendo que você faça é renomeá-lo corretamente Isso vai ser o identificador do IG, por exemplo. Isso vai ser, tipo, um ícone de engrenagem. Esse vai ser o nome. E para o texto, em vez de apenas dizer o nome, por exemplo, podemos colocar meu nome real, que é Vlocity, que é o que temos no Instagram Não há certo ou errado. É o que funciona melhor para você e é mais fácil de entender. Então, nesta parte, são postagens. São seguidores seguindo a imagem, os botões e os destaques do Avatar Avatar , e essas serão postagens. Isso o torna muito melhor. Outra coisa que podemos fazer é, por exemplo, selecionar tudo isso e definir uma cor específica, como, por exemplo, laranja, para que saibamos que tudo o que temos com a laranja ficará como aqui no topo. E então, por exemplo, para os botões, podemos definir outra cor para os botões. E digamos que tivéssemos, tipo, alguns botões diferentes, então seria rosa ou, na verdade, vamos colocar fucha, seria um pouco mais contrastante Para os destaques e as postagens, essa pode ser outra. Ou, por exemplo, se tivéssemos dez destaques diferentes, teríamos dez camadas diferentes e colocaríamos cores diferentes. Então é assim que você faz. Se você tiver alguma dúvida, me avise. E muito mais para você no próximo vídeo. 5. Fluxo de trabalho 2: recrie UIs a partir de telas diretamente no After Effects: Para a segunda abordagem de criar designs de interface do usuário, também precisamos usar o After Effects, mas, nesse caso, precisamos recriar o design da interface do usuário Vamos usar exatamente a mesma captura de tela do vídeo anterior Vou criar outra composição, que será horizontal e vou colocar nossa captura de tela aqui ou, na verdade, podemos simplesmente copiar nosso original mais o sólido branco do anterior, clique aqui E habilite a captura de tela. E você pode estar se perguntando: qual é o motivo dessa recreação E há uma razão muito boa porque, se entrarmos na composição anterior, vou criar um nulo pressionando Shift Option Command Y e, em seguida, selecionarei tudo, clicarei no nulo pressionando Command ou Control, e vou colocar tudo no nulo, pressionar S, aumentar a escala e vamos fazer como P vou criar um nulo pressionando Shift Option Command Y e, em seguida, selecionarei tudo, clicarei no nulo pressionando Command ou Control, e vou colocar tudo no nulo, pressionar S, aumentar a escala e vamos fazer como E podemos ver que, quando aumentamos o zoom, temos uma qualidade ruim. Isso não é de boa qualidade. Mas se nós mesmos o recriarmos, poderemos estirizar camadas E eu vou te mostrar o que isso significa. Vamos recuar um pouco. Vamos escrever essa palavra caramelo, que é o nome do cachorro Não Tafo, mas caramelo. OK. E vamos torná-lo um pouco menor, só para ter certeza de que cabe em P e eu vou colocá-lo aqui. E você pode ver que a camada de texto tem esse botão aqui, rasterizar Eu nem consigo desativá-lo. Na verdade, vou colocá-lo um pouco à esquerda para que tenhamos uma boa comparação. E eu também vou transformar esse caramelo em zero, e vou aumentar o tamanho de tudo . Você pode ver a diferença. Isso tem uma qualidade incrível. Isso tem uma qualidade terrível porque é uma capa tela e é uma camada de texto rasterizado Então essa é a razão pela qual temos que fazer isso. Assim. Quero dizer, você não precisa fazer isso, mas é uma ótima maneira de manter a qualidade. E, por exemplo, se você realmente quiser ampliar alguns dos textos ou algumas das camadas, é assim que você faz. E também mostrarei mais tarde como você pode salvar tudo como um modelo para que você não precise recriar todas as vezes Vamos compor o número dois, selecionar a ferramenta de retângulo redondo e ampliar Então, aqui, teríamos que escolher algo assim. A propósito, não precisa ser, tipo, super perfeito. Vou abrir o caminho do retângulo e diminuir um pouco o arredondamento para que fique perfeito Tudo o que estou fazendo aqui é apenas dizer, se encaixa nessa linha ou não? E quando isso acontecer, é bom ir. Ótimo. Isso vai ficar mais bonito. E para a cor, vou selecionar essa cor. Depois, podemos duplicá-lo, pressionar P, movê-lo para a direita e podemos ampliar para garantir que esteja perfeito Hmm, mais ou menos assim. Mais uma vez, não precisa ser perfeito. Quando as pessoas veem essas linhas de animações de Yo, elas nem percebem que não se registram, coisas assim porque é assim que nosso cérebro funciona Então, precisaríamos chamar esse botão para a esquerda. Isso vai ser o botão direito. E vamos desativar isso. Veja o que temos em termos de texto. Edite o perfil e veja o arquivo. OK. Então, vamos colocar nosso texto. Vou desativar esses botões por enquanto. Edite o perfil e eu vou ampliar. Sim, aí está. Este é o encaixe perfeito. E agora, se eu ativar o botão esquerdo, coloque-o aqui e selecione esses dois. Então, se eu desabilitar ou habilitar, não podemos nem mesmo dizer a diferença, antes e depois, antes e depois. Claro, há uma pequena diferença, mas uma diferença tão pequena as pessoas nunca percebem. Então, vou duplicar o perfil de edição, pressionar P e alterar o texto para ver o arquivo, pressionar P novamente e movê-lo para a esquerda Aí está. E agora vou colocar o arquivo de visualização no botão direito e editar o perfil no botão esquerdo. E eu também vou habilitar, assim. Como o criamos, eu uso se eu mover o botão esquerdo, você pode ver que o texto se move com o botão, que é muito conveniente, e é assim que deveria ser Para este texto, é muito fácil de replicar. É exatamente a mesma coisa. criar uma camada de texto e colocá-la, para garantir que ela se encaixe perfeitamente. As fotos, é um pouco mais difícil. Os longos são curtos, nunca conseguiremos rasterizar imagens, a menos que seja IA ou algo parecido As fotos sempre perderão qualidade. Portanto, se você tiver uma imagem de alta qualidade , sim, você pode fazer isso. Então você faria assim. Você criaria um círculo. Ok, digamos que vai ser assim. E então tudo o que você precisa fazer é rastrear a foto de si mesmo até essa camada de forma e ela será esse recorte, certo? Mas sempre que aumentarmos de tamanho , a qualidade da imagem ainda diminuirá. Se você quiser se dar ao trabalho de fazer isso para cada foto, você pode. Mas com fotos, não há problema em criar máscaras. Tudo o que tem fotos, vamos manter como está. E apenas para o texto e para os botões da interface do usuário, precisamos recriá-lo E se estamos falando sobre esses botões aqui, podemos recriá-los usando a camada de forma Então, teríamos que criar, na verdade, vamos selecionar o retângulo arredondado que possamos fazer assim E pressionando shift, vou me certificar de que é retângulo quadrado, caminho retangular, diminuir um pouco o arredondamento para que Em vez da cor sólida, vamos usar um traçado sólido e vamos torná-lo dessa cor, diminuindo a largura do traçado, por exemplo. Dentro dessa camada de forma, vamos criar outra forma daqui até aqui e eu vou pressionar a tecla shift. Isso criará a camada de forma. E eu vou desenhar, vou selecionar a camada da forma, desenhar uma linha daqui até aqui e daqui até aqui. E então, no meio, precisamos criar o triângulo que podemos fazer com o startol Então, tudo o que precisamos fazer é criar o startol e, com o mouse, diminuir o número de ângulos para criar o Você só precisa torná-lo muito menor em tamanho. Tipo, quão grande é esse? Mais ou menos assim. E então, para esse polystr precisamos apenas abrir suas propriedades, e quero dizer, podemos movê-lo assim, ou podemos abrir as propriedades de transformação dele e depois movê-lo para a direita e E agora, se eu mover toda essa camada de forma, que será esse botão. Aí está. Acabamos de recriar esse botão nós mesmos. E se estivéssemos na posição anterior em que estava, você nem perceberia a diferença. Talvez possamos diminuir um pouco o traçado selecionando todas as camadas e depois a largura do traçado, vamos colocá-lo em dois, torná-lo um pouco menor. E então, para o S, podemos diminuir, na verdade, precisamos colocar o ponto de ancoragem no centro Para isso, preciso selecionar sua camada e pressionar o comando e clicar duas vezes aqui, ela centralizará o ponto de ancoragem aqui Agora, se diminuirmos a escala, isso é o que vai acontecer. Vou abrir o conteúdo da camada de forma PolyStarf, a polistia em si, a cor do traçado, vamos usar a cor de preenchimento sólido e precisamos torná-la dessa cor, E, ok, podemos aumentar um pouco a escala dessa coisa. Aí está. Então é assim que você pode recriar cada botão Esse é muito mais fácil. Esse é um pouco mais difícil, mas é exatamente a mesma coisa. É exatamente o mesmo processo de simplesmente recriá-lo. Depois de ter todas essas camadas, prontas para serem animadas, nos próximos dois vídeos, mostrarei como usar o Illustrator Portanto, se você não usa o Illustrator, pode pular esses vídeos Mas se você quiser saber como levar isso para o próximo nível, eu realmente recomendo que você assista ao próximo vídeo. Então, se você tiver alguma dúvida, me avise, adicione isso no próximo vídeo. 6. Fluxo de trabalho 3: anime os designs do Figma com o Illustrator + AE: Bem-vindo. Neste vídeo, exploraremos como usar o Illustrator com o FIGMA FGMA é um aplicativo onde você pode obter todos os tipos de designs interessantes e é totalmente gratuito Você não precisa pagar por isso nem nada. Então, basta instalar o Figma, faça o login. E depois de fazer login, se você baixar um aplicativo ou usar o navegador, é muito semelhante, então você precisa entrar na comunidade. E aqui precisamos pesquisar todos os tipos de interfaces de usuário. Então, por exemplo, podemos pesquisar interface do usuário MAC. Ela abrirá muitas coisas aqui. Mas, na verdade, eu gosto muito desse. Então, se eu clicar duas vezes nele e depois clicar em Abrir Infigma, vai levar algum tempo para carregar Temos muitos designs de interface de usuário diferentes aqui. E se eu aumentar o zoom pressionando o comando ou controle e usando a roda de rolagem do mouse, posso realmente ampliar e ver a qualidade continua muito boa. Certo? Eu posso ampliar absolutamente tudo. A qualidade é insana porque estamos usando arquivos S SVG. E esses são os arquivos que basicamente iguais aos do texto e do After Effects, que eles podem estilizar É por isso que temos essa qualidade muito boa, mesmo que realmente ampliemos o zoom. Então, temos muitas coisas. E precisamos selecionar um dos designs que gostamos. Vamos selecionar esse primeiro. Podemos selecionar o preto ou o branco. A maneira como você seleciona Figma é que você precisa clicar duas vezes e mover as coisas ao redor do que você selecionou Mas selecionamos os dois, e podemos ir aqui e selecioná-los assim. Agora, selecionamos o preto. Ou digamos que eu simplesmente dissecei tudo, posso clicar duas vezes para selecionar os dois novamente, e posso dobrar aqui novamente, e agora ele selecionará o da direita Portanto, você pode clicar aqui à esquerda até selecionar exatamente o que precisa ou simplesmente clicar na tela. E digamos que eu queira selecionar músicas semelhantes. Eu tenho que clicar, clicar duas vezes, clicar duas vezes até selecionar a música Mas não precisamos ir tão longe, então vou diminuir um pouco o zoom selecionar. Esse é o que eu preciso. E vou clicar com o botão direito do mouse em copiar e colar, pois os SVJs são muito importantes Agora, precisamos abrir o Illustrator e clicar em você. Web Large, 1920 por 1080. Se você quiser quatro K, você sempre pode fazer isso, mas 1920 por 1080 vai ser muito, muito bom A propósito, quanto maior a resolução, mais difícil será o seu computador , pois isso consumirá bastante energia para o seu computador, especialmente no After Effects. Então, isso é ótimo. 1920 por 1080. E como copiamos o SVJ, vou pressionar Command V, e isso vai levar algum tempo Aí está. Você pode ver que o tamanho é um pouco diferente e precisamos procurar obras de arte adequadas aos limites Então, precisamos entrar em objetos, pranchetas, ajustar os limites da prancheta, e isso se encaixará automaticamente na tela, o que torna as coisas muito mais fáceis Agora, a forma como funciona no Illustrator é que você tem camadas. No momento, tudo isso é uma camada. Mas se eu abrir e abrir e abrir, teremos mais algumas camadas. O problema é que quando temos uma camada, essa camada controla tudo. E se quisermos separá-las em camadas diferentes, precisamos selecionar todas elas. Então, precisamos abri-lo até que, basicamente, tenhamos várias camadas pequenas diferentes e, em seguida, precisamos rastreá-las até a camada número um. E agora, selecionando a camada número um, precisamos clicar nos três pontos aqui e clicar em liberar a sequência de duas camadas Agora, precisamos selecioná-los novamente, selecionar tudo e depois arrastá-los para fora dessa camada. E agora você verá que temos essa parte separada. Temos essa parte separada, essa parte separada, você sabe, esse botão separado, o fundo separado. Antes, tínhamos tudo em uma única camada. E digamos que eu queira que eles também sejam separados. Então, precisamos selecioná-la, e será a camada número 19. Vamos abrir, abrir, abrir, abrir. Lá vamos nós. E agora temos muitas coisas. Então, vou selecionar isso, tudo o que está embaixo disso. Selecione tudo. A máscara de recorte não é algo que precisamos selecionar É só uma máscara , era uma máscara que escondia essas partes na parte inferior Agora que a arrastamos para a camada não feita, basta selecionar novamente nossa camada, clicar aqui mais uma vez e soltar para a sequência de camadas E agora, mais uma vez, selecione tudo isso, 181 camadas e arraste-as para fora dessa camada E agora cada peça será separada. Agora eu posso mover a música, essa parte, esse fundo, esse fundo, cada botão, mover cada coisa. Agora, para essas partes na parte inferior, porque elas são um pouco estranhas neste momento, podemos selecioná-las e excluí-las Assim e essa parte também. Ou podemos fazer isso mais tarde no After Effects. Mas neste momento, o que vamos fazer pressionar o Comando zero para caber na tela. E agora eu preciso pressionar o Comando S para salvar isso como um arquivo. Vou salvá-lo no desktop. Como arquivo do Illustrator, sim, salve e pressione OK. Agora, quando chegarmos ao After Effects, vou simplesmente arrastar nosso arquivo aqui. E aqui está uma parte muito importante. Você tem uma filmagem e uma composição no tipo de importação, e precisamos importá-la como composição, super importante nesta etapa Agora, nas dimensões da gravação, precisamos fazer o tamanho da camada A diferença entre a camada e o tamanho do documento é que quando temos o tamanho da camada, isso significa que cada camada será limitada ao tamanho original. Basicamente, o mouse será do tamanho do mouse. E se eu tentar tocá-lo, será do tamanho do mouse. Mas então, se tivermos o tamanho da camada como o tamanho do documento, imagine que o mouse que vemos é tão pequeno , mas quando eu tento tocá-lo, vou mover toda a sala ao meu redor porque será do tamanho do documento. Basicamente, tudo aqui será do tamanho do documento, e não queremos que isso aconteça. Queremos ser o tamanho da camada. Então, vou pressionar Ok e levará algum tempo para carregar. Isso geralmente não leva muito tempo, talvez alguns segundos, às vezes 20, 30 segundos, às vezes até um minuto, dependendo de quantas camadas você tem , porque é preciso passar por cada camada para importá-las. Aí está. E agora, se eu clicar duas vezes em nosso Sem título, nós o teremos aqui Só preciso carregar um pouco porque temos uma grande quantidade de camadas. E agora, você verá que temos cada coisa como uma camada separada. Mas se eu pressionar o Comando K, você verá que a largura é 14 40 por altura, 900. Portanto, o tamanho é bem pequeno e, se eu ampliar , podemos ver que a qualidade não é muito boa. Mas, honestamente, isso não importa porque podemos aumentar o tamanho para 1920 em 1080, pressionando K, p person shift slash para que caiba Então, lembre-se de que, quando o importamos, era mais ou menos assim no Illustrator Não era um encaixe perfeito. A prancheta, o fundo, era um pouco maior E agora, o que podemos fazer aqui, algo super interessante é que podemos criar um comando nulo, com a opção de deslocamento Y, comando nulo, com a opção de deslocamento Y, selecionar tudo pressionando o Comando A e, em seguida, mantendo pressionado o comando ou controle, selecionar o nulo para desmarcá-lo E depois cuidar de tudo até o fim. Vai levar algum tempo. Na verdade, vamos selecionar tudo e clicar nesse botão para rasterizar Mais uma vez, levará algum tempo para carregá-lo. Mas quando aumentarmos o tamanho de tudo no After Effects, vamos aumentar. Aí está. Você pode ver que a qualidade permanece absolutamente a mesma em tudo. A qualidade é muito, muito boa. É quase impossível obter esse tipo de, quero dizer, é impossível obter esse tipo de qualidade a partir da captura de tela Agora que temos todas essas camadas, podemos aumentar ou diminuir a escala de cada camada. Digamos que eu selecione essa pessoa P, posso mover cada peça. Então é assim que você cria seus designs de I no Illustrator. Vamos pular para o próximo vídeo. Também é outra forma de criar designs de IA no Illustrator. E logo depois disso, começaremos a animar tudo Então, se você tiver alguma dúvida, me avise, e isso para você no próximo vídeo. 7. Fluxo de trabalho 4: importe arquivos PDF de UI para o Illustrator e o After Effects: Ok, vamos falar sobre a última maneira de criar designs de interface do usuário. Imagine fazer uma captura de tela e depois ter que cortar cada palavra, cada ícone aqui, vai levar um bom tempo E podemos acelerar esse processo significativamente. Vou mostrar duas maneiras, uma no Mac e outra no Windows. Se formos para o Safari, podemos realmente entrar em Arquivo e depois exportar como PDF Vá para Desktop, Google, vamos chamá-lo de Mac aqui. E a mesma coisa, se entrarmos no Chrome, teremos que entrar em Arquivo. Imprima, salve como PDF e vamos salvá-lo como PDF. E vamos ao desktop e chamá-lo de Windows. Agora, descobri que funciona muito melhor no MAC por meio do Safi devido à forma como o Safi cria um PDF Basicamente, o que fazemos é criar o PDF da página sobre tudo o que estamos usando. E isso é, se eu pré-visualizar, é assim que a página se parece. Mas se eu entrar no Windows, é assim que a página se parece. Um pouco diferente. Então isso é do Chrome e isso é do Safari Agora, o que eu tenho que fazer é, então esse é o Mac. Este é o Safari, clique com o botão direito do mouse em abrir com o Illustrator. Alguns dos objetos PDF foram reinterpretados porque nem sempre são perfeitos, basta pressionar Substitua as fontes, está tudo bem. Basta clicar em Reino Unido. Você pode selecionar a fonte pela qual deseja substituí-la. E aí está. Essa é a página inteira. É simples assim. Agora, obviamente, podemos selecionar tudo. Na verdade, selecionamos a camada, clicamos na camada de liberação para sequenciar. Selecione tudo e retire-o. E então podemos mover cada coisa. Cada coisa tem sua própria camada agora, o que é muito, muito conveniente, certo? Exatamente a mesma coisa. Basta salvá-lo como um arquivo do ilustrador colocá-lo no After Effects Pronto para arquivar, salve-nos. Illustrator, Adobe Illustrator e, sim, salve-o. Ótimo. No entanto, se eu fizer a mesma coisa com o Windows , será exatamente o mesmo processo. Então, abra com o Ado Illustrator, pressionando ok. Esta é a nossa página, que você definitivamente pode ver que parece um pouco diferente, mas ainda é boa o suficiente para animação. E temos que fazer exatamente a mesma coisa, liberar camada em sequência, selecionar todas as camadas e arrastá-las para fora. E, mais uma vez, cada coisa se torna algo próprio para animar. Então, vamos fazer exatamente isso, nos salvar. Illustrator, e nós o salvarmos no desktop, haverá janelas E agora, se selecionarmos nosso MAC, por exemplo, e o colocarmos novamente, tamanho da camada de composição, muito importante, pressione N k. Vai levar algum tempo para carregar, e então teremos que fazer exatamente a mesma coisa com o Windows. Agora, se eu clicar duas vezes nesta, uma coisa muito parecida com a que tínhamos antes, teremos, mais uma vez, centenas e centenas de camadas. Cada camada é móvel, e aí está Só precisamos selecionar o correto. Perfeito. E então podemos mover cada texto aqui apenas para mostrar que temos exatamente a mesma coisa para o Windows. Aqui, tamanho da camada de composição, clique em OK, clique duas vezes nela. Aí está. Essa é uma cor um pouco interessante, então vou adicionar um sólido. Vamos torná-lo branco, e eu vou colocá-lo no fundo, e aí está. E mais uma vez, podemos mover todas as partes aqui. Então, a única diferença entre o safari e o Chrome é a formatação A formatação do safari é melhor, mas podemos fazer isso em sites diferentes Alguns sites não funcionam muito bem porque, se eu, por exemplo, vou ao YouTube, faço a mesma coisa com o YouTube. Exportar SPDF. Sim, vamos fazer isso na tela inicial. E então isso é o YouTube. Vou abri-lo com o Illustrator, pessoa k. Você pode ver que, na verdade, todo o texto parece estranho É por causa da formatação diferente que eles usam. Se fôssemos fazer isso, tudo o que precisamos fazer é, por exemplo, selecionar nosso texto, algo assim, como Smartphone Awards 2025, entrar no Illustrator, ampliar No cheat, como o texto, coloque e pronto É exatamente a mesma coisa. É só que temos que trabalhar um pouco nisso, mas economiza um pouco de tempo. Portanto, toda abordagem é muito boa, mas toda abordagem tem suas vantagens, desvantagens e é assim que funciona. Se você tiver alguma dúvida, me avise. Além disso, nos vemos no próximo vídeo. 8. Crie modelos de UI reutilizáveis para projetos de movimento futuros: Neste vídeo, deixe-me mostrar como criar modelos reutilizáveis Sempre que temos uma captura de tela, apenas criamos máscaras no After Effects ou recriamos uma captura de tela no After Effects ou usamos um Illustrator A forma como podemos reutilizar isso no futuro é salvar o arquivo do After Effect Com isso, tudo o que preciso fazer é pressionar Command S e ele solicitará que eu salve o arquivo. Vou apenas salvá-lo em um desktop, pressionar e salvar e vou fechar este projeto. Se eu criar outro projeto, será, por exemplo, com essa nova composição, tudo o que preciso fazer é selecionar nosso projeto Aftereffects Isso vai ser um modelo, e eu vou arrastá-lo e soltá-lo aqui, e ele terá nossas diferentes composições Então, tudo o que precisamos fazer é arrastar nossas composições até aqui e tudo funcionará Sempre que fazemos mudanças aqui, por exemplo, temos as diferentes camadas. Aumentamos algumas das camadas. Talvez possamos selecionar mais alguns. Pessoa S, aumente algumas partes. Quero dizer, você pode ver que fizemos algumas diferenças aqui, certo? E eu vou pessoalmente e, como diz este projeto, haverá um projeto de vídeo, e eu vou fechar esse projeto, e vou abrir nosso modelo. E nosso modelo, nada mudou, mas tudo o que mudou só mudou neste projeto do After Effects. Então é assim que eu posso criar um modelo. Obviamente, salve os arquivos do ilustrador. É particularmente útil se você estiver usando o screentot porque, se estiver usando os arquivos do Illustrator, obviamente, você pode simplesmente arrastá-los e soltá-los no projeto e criar uma composição Você não precisa necessariamente salvar um projeto do After Effects com ele, mas ainda assim adicionará um pouco mais de conveniência para você , pois não precisará importá-lo na próxima vez. E, por exemplo, se você mudou algumas coisas , ainda será muito útil. Então é assim que você faz. Se você tiver alguma dúvida, me avise que nos vemos no próximo vídeo. 9. Como usar o Animation Composer para UI Motion Design: Bem-vindo. Neste vídeo, gostaria de apresentar o Animation Composer, uma ferramenta gratuita incrível que nos ajudará a Portanto, este é um site do Mr. Horse, misterhors.com, e aqui temos o compositor de animação, que você pode obter acessando as marcas de produtos do After Effects, e teremos Agora, o link estará na seção de recursos, para que você possa acessá-lo facilmente lá. Esta é uma versão gratuita, mas existe a opção de obter uma versão paga, que terá muito mais. Mas, honestamente, a versão gratuita é incrivelmente boa e eu uso a A propósito, também está para estreia, então pode ser muito, muito bom De qualquer forma, você pode dar uma olhada no que isso consiste, mas vou mostrar como vamos animar nossos designs de interface com ele Então, quando você entra no After EFFxS depois de instalá-lo, a instalação é bem simples Siga as instruções, acessando o compositor de janelas e animações aqui na parte superior e, em seguida, você verá essa janela aparecer Eu só coloquei aqui à direita porque é conveniente para mim estar aqui. E na vertical, eu o tenho aqui. Digamos que eu vou importar este vídeo aqui: composição, tamanho da camada e pessoa K, e vou abri-lo. Então, temos 100 camadas diferentes, e digamos que queremos que todas essas camadas apareçam na tela uma após a outra, para que tenhamos esse efeito muito interessante, uma por uma, quase como uma metralhadora. Para fazer isso, só precisamos encontrar a camada com a qual ela começa e, nesse caso, isso precisaria encontrar talvez isso. Vamos verificar. Então, camada dez. E então, se eu selecionar isso, ok, ótimo. Ótimo. Ótimo, ótimo, ótimo. Ok, então até aqui. E eu vou marcá-lo com outra cor. Vamos comer laranja. Vamos verificar se sempre que selecionarmos camadas T, será outra coisa. Ok, então vamos animar tudo o que começa, como tudo que está abaixo desse ponto e acima desse ponto, basicamente tudo o que temos aqui Basicamente, assim. Vamos animar tudo assim. E para fazer isso, selecionamos todos eles. Marque-os com outra cor para que seja fácil identificá-los. E agora precisamos selecionar tudo novamente, acessar o compositor de animação e procurar predefinições de movimento Basicamente, é a forma como uma determinada camada vai aparecer na tela, e você tem muitas opções diferentes. O momento do compositor de animação geralmente vem do ponto de ancoragem, e podemos ver que o ponto nc está aqui para, deixe-me realmente mostrar Então, para essa camada, está aqui. Para essa camada, o ponto de ancoragem está bem no meio Para essa camada, ela está no meio. Mas às vezes nem sempre é perfeito. O ponto de ancoragem pode estar um pouco errado. Então, digamos que, para palavras específicas, o ponto de ancoragem pode ser que possamos mudar o ponto de ancoragem pressionando aqui e eu possa mover o ponto de ancoragem um pouco para a esquerda E o que vai acontecer é, deixe-me pressionar S. Se eu diminuir ou aumentar o tamanho dessa camada, ela diminuirá ou aumentará com base no ponto de ancha, que é o que não queremos que aconteça Quero ter certeza de que o ponto de ancoragem está no meio E a razão pela qual estou dizendo isso é porque, digamos que o ponto de ancoragem esteja um pouco para o lado e pressionemos algum tipo de animação Ok, vamos nessa. Sim. Então você pode ver que vai aparecer um pouco de lado, o que é algo que não queremos que aconteça. Então, para evitar isso, se nosso ponto de ancoragem estiver um pouco para o lado, tudo o que precisamos fazer é clicar no banquinho e mover o ponto de ancoragem para o Ou, se estiver um pouco lateral, podemos pressionar Command ou Control e clicar duas vezes aqui, e ficará bem no meio dessa camada. Agora que resolvemos isso, vamos selecionar todas as nossas camadas, navegar e fazer essa superação. E vamos clicar em I. Vou caber na tela. E aí está. Todas essas camadas aparecem na tela ao mesmo tempo. Agora, se eu quiser que cada camada apareça uma por uma, uma após a outra, precisamos selecionar todas essas camadas. E então, se entrarmos na guia de edição no compositor de animação, você verá que temos uma seleção de camadas Aqui, precisamos mover isso um pouco, digamos , como um quadro. Então, vou adicionar aqui um no final e pressionar Enter. E você verá que ele moverá cada camada, um pouco para o lado, para que tenhamos essa animação muito suave. Agora, vamos jogar e ver como fica. Ótimo. E aqui podemos realmente personalizar qual deles gostamos. Então, podemos fazer isso aleatoriamente. Podemos fazer isso em uma ordem de seleção ou podemos fazer isso ascendente, descendente Então, se eu quisesse que isso acontecesse de outra forma, faríamos exatamente a mesma coisa, e eu colocaria a maravilha no final, a pessoa entraria. Então, em vez de ser de baixo, seria de cima. Deixe-me desmarcar. Você pode desmarcar tudo na pessoa Shift Command A. Então, se você tiver, tipo, muitas seleções, você pode pressionar Shift Command A e desmarcar Sim, aí está. Muito, muito bom, muito suave. Com o compositor de animação, quero dizer, há muito mais. Existem todos os tipos de animações de texto, mas falaremos sobre texto em alguns vídeos em que também usaremos o texto Evo em uma ferramenta gratuita inacreditável Depois, temos títulos, transições, componentes gráficos e também sons muito bons Então você pode definitivamente explorar. É que eu realmente queria mostrar que você pode animar em massa e algo que economizará uma quantidade incrível Também podemos ir e fazer aleatoriamente. Veja a diferença. Então, agora, como você pode ver, é um pouco aleatório. Mas a diferença não é significativa. Então, podemos seguir em frente e fazer aleatoriamente, mas um pouco mais. Vamos por, tipo, 14. Aí está. Parece muito, muito bom. Imagine fazer isso manualmente com cada camada , levaria muito tempo. Então, uma economia muito, muito grande. Agora, você pode estar se perguntando, ok, como colocamos isso no vídeo? E então, em alguns vídeos, mais uma vez, mostrarei como eu realmente crio um vídeo completo a partir disso usando o compositor de animação e todas as camadas e, tipo, todos os métodos que usamos Então, abordaremos os próximos vídeos. Além disso, se você tiver alguma dúvida, me avise. Adicione isso, nos vemos no próximo vídeo. 10. Adicione profundidade 3D com este plugin essencial do After Effects: Neste vídeo, falaremos sobre como levar nossas animações Yo para o próximo nível Se você tiver animações de interface de usuário de palavras on-line , verá que às vezes essas animações se tornam três D. E a questão é: como podemos torná-las três Existe uma maneira muito fácil de fazer isso no After Effects. Na verdade, é com o plugin chamado depth. Mais uma vez, é totalmente gratuito. Vá em frente e o venda. Então, deixe-me mostrar como isso é feito. Ao acessar este site, clique no preço zero e, em seguida, clique em comprar esta capa novamente, porque eu já a comprei antes. Vá em frente e pegue. Você precisa colocá-lo na pasta Adobe After Effects em scripts. Crie um script para seus painéis e basta arrastá-los e soltá-los aqui para ver a profundidade. Eu o tenho aqui. E então, quando você acessar o After Effects, basta entrar no Window, e precisamos que ele habilite a profundidade aqui. Então eu o coloquei ao lado do compositor de animação aqui, e mais uma vez, precisamos identificar quais camadas estão onde exatamente e identificar quais camadas queremos fazer três D, quais camadas queremos separar em três D. Nesse caso, eu quero separar tudo o que vai estar aqui no meio, como dentro do localizador, dentro desta Quero ter certeza de que acho que tudo está bem, então temos algo aqui. Então, temos essa mensagem, ok? Podemos marcar isso com laranja. Basicamente, só precisamos encontrar tudo o que é para ir de cima para baixo. Ok, até aqui. A maneira como estou fazendo isso é apenas tentando encontrar a camada que não está no meio. E eu começo com a camada que está onde está com essa camada, que é a primeira camada dentro desse quadro, dentro da pasta porque essa é, tipo, é outra coisa, certo? Não tenho certeza do que é exatamente, mas é definitivamente algo diferente. De qualquer forma, precisamos marcá-los com cores. Vamos selecionar tudo, pressione laranja. Ok. Então, agora temos tudo em laranja. Ótimo. Então, sempre que transformamos algo em três D e After Effect, criamos espaço entre três camadas D. Se movermos a camada um pouco mais longe ou mais perto da câmera, a camada ficará um pouco maior ou um pouco menor. E esse plugin nos permite basicamente manter o mesmo tamanho sempre que o movemos um pouco mais longe ou mais perto da câmera. Deixe-me criar outra composição para mostrar isso. Digamos que temos algo assim. E digamos que transformamos esses três D clicando neste botão aqui. A propósito, se você não tem os três D, você pode simplesmente mudar clicando neste botão aqui para Toggle Switch, e você pode torná-los três D. Mova-o um pouco para a esquerda, e eu vou adicionar um segundo E esse espectador será do topo. E para tornar as coisas um pouco mais simples, vamos ao Advanced three D, o renderizador, e vamos adicionar um pouco da profundidade de extrusão para que possamos ver as coisas um Esse é o nosso círculo e esse é o nosso retângulo. E se eu clicar em R, posso mostrar para você assim, certo? Então você pode ver que essa é a vista de cima. Essa é a vista logo de frente. Vamos a pessoa P. Digamos que eu queira criar algum espaço entre esses dois, então eu movo nosso círculo um pouco mais longe da câmera Ou, nesse caso, ainda não temos a câmera, mas isso realmente não importa. Nós o movemos ainda mais, e você pode ver aqui, que ele se torna um pouco menor. Então, quando a pessoa comanda isso, fica um pouco maior. Este ficou um pouco menor e você também pode ver que ele se move na tela. E se digamos que eu queira mover este um pouco mais perto da tela ou da câmera. Então, agora temos algum espaço entre eles. Você pode ver que este ficou muito maior e também mudou de posição. Agora, podemos realmente evitar isso com o plug-in de profundidade. Vamos desligar os três D. Digamos que é do jeito que deveria ser desde o início, certo? E eu clico em dispersar. Ok. Então, atualmente, eles estão na mesma posição, mas se eu clicar em dispersar novamente, você verá que ele se moveu um pouco Então, este agora está mais longe. Esse está mais perto. Mas mesmo que eles tenham mudado a posição, você sabe, na tela, eles permanecem os mesmos, certo? Então, antes e depois antes, depois, antes e depois. E se dermos uma olhada no que está acontecendo, a escala muda e a posição também. Para este, a posição é zero porque é onde está o zero. Mas para este, para o quadrado, está um pouco mais longe. Está em 1.000, e é exatamente isso que temos aqui. O espaçamento entre camadas é 1.000. E se quisermos que as camadas sejam afastadas, mais próximas e à mesma distância, tudo o que precisamos fazer é criá-las. Então, impressione e comande, e vamos criar uma camada de forma Aliás, outra parte importante é que vai começar do topo. Então, qualquer camada na parte superior que fique mais próxima da câmera e qualquer camada que esteja mais abaixo aqui, ela ficará mais longe da câmera. Então, eu apenas o dupliquei. Lim press e P, movidos um pouco para o lado, agora temos dois deles. E vou apenas criar, digamos, da camada um até a camada três. Basicamente, um quadrado com o outro. Deixa eu te contar a câmera. Vou selecionar todos eles e clicar em dispersar o mesmo problema. Clique em dispersar. E você pode ver que, como tivemos esses pais, eles agora estão mais distantes na mesma posição aqui no topo Então, algumas coisas que podemos fazer. Temos essa parte que podemos manter aqui na frente e, portanto, vamos transformar tudo isso na camada número um. Então, selecionamos todas as camadas de parental para a camada número um. Assim. Então, quando formos até o fundo, também espalharemos a camada número um. Só precisamos subir um pouco. Bem, não a camada número um, mas a camada número sete, certo? Então, temos tudo em camadas colocado na camada número sete, ótimo E agora podemos colocar basicamente todas as camadas de laranja. Vamos passar até a primeira camada de laranja. Aí está. Agora, quando os selecionamos e clicamos em dispersar, devemos fazer exatamente a mesma coisa acontecer Então, se eu entrar no segundo Viewer, ele ficou perfeito, mas na verdade precisávamos que todos esses botões estivessem na frente em vez de atrás. Então, para isso, o que eu faria seria selecionar essa camada 52 e colocá-la acima da camada número um. E então eu mais uma vez selecionava tudo e clicava em dispersar. Perfeito. Agora temos o fundo mais distante, como você pode ver na tela aqui, e temos basicamente toda a parte laranja aqui na frente. E se selecionarmos nossa câmera para abrir a opção de profundidade de campo da câmera, se a habilitarmos e aumentarmos a abertura, deixe-me mostrá-la com um visualizador Você verá que, como temos todas as camadas de laranja muito na frente, podemos isolá-las com o fundo Outro aspecto importante por que estamos fazendo isso é por causa da coisa chamada paralaxe paralaxe é basicamente quando você dirige com um carro, você verá que as montanhas permanecem em uma posição e quase nunca mudam porque estão muito distantes Mas, por exemplo, como uma casa que vai ficar em frente às montanhas e você vai se mover um pouco mais rápido porque você está dirigindo. Mas coisas que estão muito perto de você, como flores na beira da estrada se moverão ainda mais rápido. Isso é chamado de paralaxe. Deixe-me mostrar rapidamente para você. Então, as nuvens que estão muito distantes se movem muito pouco em comparação com algo que está na frente e algo que está entre as nuvens muito distantes e a frente, ela se move em algum lugar no meio. E podemos realmente conseguir exatamente a mesma coisa, exatamente o mesmo efeito. Então, temos nossa câmera e nossa câmera está conectada ao controlador da câmera. Nesse caso, é um nulo. Se eu clicar em P e movê-lo um pouco para o lado, você verá que temos exatamente esse efeito. Se nos movermos para cima ou para baixo, o plano de fundo não muda tanto quanto o primeiro plano E as camadas alaranjadas estão em primeiro plano. E por causa disso, temos esse movimento um pouco diferente, que nos diz que há um pouco de espaço e esses três D, o que torna muito mais o que torna muito mais caro quando se trata desse tipo de vídeo. Então, esse é o plugin de profundidade. Agora, imagine colocar isso junto com compositor de animação com predefinições de movimento, vamos usar este, e então podemos ir em frente e fazer algo assim de forma aleatória Então, temos todas essas coisas aparecendo na tela. Oh, eu vejo o que aconteceu agora. Não funcionou porque todas essas camadas são vinculadas à camada número um, então precisamos comandar Z, selecionar todas as camadas, todas as camadas laranja e clicar em não Então, não será associado a ninguém, mas agora, quando o selecionamos, digamos que vamos navegar e fazemos exatamente a mesma coisa, editamos, empilhamos aleatoriamente, adicionamos um pouco dessa aleatoriedade e desmarcamos digamos que vamos navegar e fazemos exatamente a mesma coisa, editamos, empilhamos aleatoriamente, adicionamos um pouco dessa aleatoriedade e desmarcamos tudo. Ótimo. E agora, digamos que também animamos a câmera para ir, digamos que, na verdade, podemos ir de um pouco mais baixo para um pouco mais alto Então, estou apenas adicionando quadros-chave e fazendo com que apareçam na tela Também podemos pressionar seletivamente N F nove para torná-lo um pouco mais suave, personalizar o gráfico para que o gráfico também fique um pouco mais suave, assim E você verá que temos esse interessante movimento de três D e um pop-up. Parece muito, muito caro. Obviamente, teríamos que brincar um pouco com o plano de fundo. Mova-o um pouco para uma posição ligeiramente diferente para que pareça um pouco melhor. De qualquer forma, se você tiver alguma dúvida, me avise. Então nos vemos no próximo vídeo. 11. Acelere suas animações de texto com o TextEvo: A última ferramenta super útil que vai nos ajudar a acelerar as animações e tornar nossa vida muito mais fácil é o text Evo Ao acessar este site, você verá que custa $30, mas se você colocar um zero aqui, poderá obtê-lo por $0 Então, basta citar seu próprio preço. Quero dizer, obviamente, se você é uma empresa , precisa ler a descrição , mas se for um indivíduo, basta adicionar um cartão e usá-lo. Depois de instalá-lo, mais uma vez , é algo muito parecido. Tudo o que você precisa fazer é colocá-lo nos painéis de interface do usuário do script e soltá-lo aqui para que você possa dizer que tenho o texto E dois aqui. E então, quando você acessa o After Effects, Window e digite Ear na parte inferior, e então você pode simplesmente soltá-lo. Eu o tenho aqui, no espaço de trabalho horizontal, e no espaço de trabalho vertical, eu o tenho Por que usamos isso? É porque, para animar no texto e no After Effects, é claro, você pode aplicar algum tipo de efeito no texto, por exemplo, como um efeito de máquina de escrever, o que vai ser ótimo Mas se você quiser ter uma personalização muito interessante no texto, seja uma animação, o textiv será muito útil Vamos colocar um texto na tela, torná-lo muito maior, torná-lo branco. Ótimo. E vamos colocá-lo bem no meio. Então, podemos pesquisar efeitos como, mais uma vez, efeito de máquina de escrever, certo, e ele vai digitar o texto, que é um efeito interessante, ou outra coisa que podemos fazer é animar o Assim, podemos adicionar um deslocamento de caracteres. Temos o seletor de intervalo, então podemos animar o final e o início e depois podemos personalizá-lo. Meio útil. Mas então enviar uma mensagem de texto para Evo torna as coisas muito mais fáceis. Então, para usar o texto Evo, tudo o que precisamos fazer é clicar em Mais. Quando selecionamos nosso texto, precisamos clicar em Mais e isso adicionará o efeito Evo de texto. Se não tivermos nada selecionado, você apenas adicionará uma camada de texto. E então podemos seguir em frente e personalizar isso exatamente da mesma forma. Podemos clicar em Mais e, quando abrimos, temos dois quadros-chave Um é o quadro-chave inicial e o outro é o quadro-chave final. O que podemos fazer é mudar o movimento, a opacidade, o desfoque, qualquer coisa do primeiro quadro-chave qualquer coisa do Sempre que chegarmos ao segundo quadro-chave, ele passará desse conjunto para esse estado original A propósito, nem precisamos estar no quadro-chave Então, por exemplo, se eu mudar a posição, e vamos mudar a , digamos Y, certo? Está indo de baixo para cima. Aí está. Super simples e já animado. Algumas coisas que podemos fazer. Uma das melhores coisas que eu gosto é ter a opacidade em zero. Então, isso vai acontecer assim. Já parece legal. Depois, podemos fazer o desfoque, para que possamos personalizar o desfoque Vamos colocar em 101.000 aqui também. Então, ele aparecerá para que você possa personalizar o atraso ou a direção que podemos personalizar se entrarmos aqui e se entrarmos no texto, se abrirmos um pop-up ou um painel no qual precisaremos alterar. Podemos fazer isso com cartas. São letras sem palavras, linhas ou cancelamentos. Então, se você quiser que isso aconteça por palavras, basta clicar nas palavras e precisamos que você as selecione, certo? Sim, este, digamos palavras. E em vez de ser por caracteres, agora é por palavras, então agora a palavra inteira aparece. E se tivermos algumas palavras, texto é animado. Ok, o que aconteceu? Animação de texto, selecione o texto, torne-o um pouco menor. Aí está. Animação de texto. Perfeito. Tão simples quanto isso. Há muitas coisas que você pode personalizar aqui. Então, eu apenas encorajaria você a prosseguir e explorar, ver o que você gosta, ver o que você gostaria de usar. Na maioria das vezes, eu uso apenas o tipo de animação de personagem ou palavra e algo tão simples quanto aparecer na tela E, a propósito, você também pode salvar predefinições aqui. Assim, você pode selecionar o texto e clicar na predefinição e adicionar uma predefinição de qualquer animação que tenha na tela, e ela aparecerá aqui Ou você pode aplicar uma animação que você salvou antes. Você pode remover. Digamos que clique neste e eu o remova, mas não vou fazer isso, ou você pode atualizar se precisar de uma pequena atualização Você também pode copiar o efeito, por exemplo, se eu selecionar essa camada, então vou duplicar, clicar nela, excluir o texto Evo, pressionar P, movê-lo um pouco mais alto Selecione a animação de texto, para que eu possa copiar essa animação, e então eu posso colá-la aqui e teremos as coisas exatamente iguais. E, a propósito, posso pressionar você para revelar os quadros-chave e depois movê-los Então, eu posso selecionar assim e simplesmente aparecer a partir deste ponto. Então é assim que você faz. Quando recriarmos o texto será muito útil ter outra camada de animação de texto animado para torná-lo muito melhor, e essa ferramenta nos poupará muito tempo Então, se você tiver alguma dúvida, me avise e nos vemos no próximo vídeo. 12. Parabéns! : Parabéns. Se você está assistindo isso, significa que você chegou na metade do conteúdo do curso, muitas vezes sem capas, então parabéns por fazer essa E haverá muito mais conteúdo valioso em breve, mas antes de chegarmos ao próximo vídeo, quero simplesmente perguntar se você encontrou valor neste programa até agora Reserve 60 segundos para deixar uma avaliação honesta. Obviamente, agradecerei imensamente isso, e o feedback ajudará enormemente os futuros alunos a decidir o melhor programa Então, deixe seu feedback agora e, claro, se houver algo em que eu possa ajudá-lo, informe-me na seção de perguntas e respostas abaixo Você está indo muito bem. Continue. Sem ser dito. Vamos para o próximo vídeo. 13. Use o ChatGPT para fazer um brainstorming de ideias de animação de UI Viral: Bem-vindo. Neste vídeo, exploraremos o uso HGPT para criar IDs e debater IDs Então, se você estiver usando o JTPT para trabalhar com seus clientes ou criar vídeos para si mesmo, será muito útil. Vamos começar. A primeira coisa que vou fazer é falar com JGPT, explicar o que eu quero fazer e depois veremos o que o JGPT Ei, JTPT, estou criando um vídeo sobre designs de interface do usuário. Na verdade, não se trata necessariamente de designs de interface do usuário, mas do uso de designs de interface do usuário. Então, serão painéis de interface de usuário, sites , interfaces, todo tipo de coisa. Especificamente, quero criar um vídeo sobre Steve Jobs, a pessoa que criou e quero criar um vídeo de curta-metragem, que terá, digamos, 30 segundos de duração, e precisamos usar painéis de interface de usuário, e precisamos contar uma história interessante sobre ele que ainda não foi contada, que provavelmente aconteceu, mas pelo menos não é tão popular, mas é muito interessante e, tipo, um empecilho Primeiro de tudo, preciso que você me dê ideias interessantes sobre o que podemos conversar. Potencialmente, se não houver ideias, podemos falar sobre seu patrimônio líquido, sobre quanto dinheiro ele ganhou, coisas assim. Ter algum tipo de fato interessante sobre ele seria ótimo. Então, vá em frente e, primeiro de tudo, conte-me os fatos interessantes sobre ele e, depois disso, decidiremos o que fazer a seguir. Então, quanto mais contexto eu der ao JDPT, melhor, porque ele vai entender o que eu estou procurando e obter resultados realmente excelentes Sim, isso é realmente verdade. Ele foi demitido. Isso é verdade, assim como se esses fatos não fossem verdadeiros. Gosto do fato de o salário dele ser de $1, então acho que podemos nos concentrar nisso e usar diferentes interfaces de usuário. Isso está correto. Então, vamos criar o roteiro para o 32º vídeo, começando com um gancho muito forte, depois a parte do valor, depois o muito bom, o final satisfatório Vamos criar o roteiro e lhe darei um feedback. Você pode ver que ele meio que escreveu para mim todo tipo de coisa, e eu estou apenas devolvendo feedback à ATPT Hmm. Na verdade, agora que estou vendo, não gosto da forma como a história está se desenvolvendo. Ok, vamos criar um vídeo sobre seu patrimônio líquido. Vamos falar sobre seu patrimônio líquido quando ele morreu. Não vamos falar sobre, tipo, o fato de ele ter morrido, mas vamos falar sobre, você sabe, que ele valia, não me lembro o que era, mas mais de dez bilhões de dólares. E o fato interessante é que ele realmente fez muito disso na Pixar Ok, vamos primeiro falar apenas sobre a narração, sobre o roteiro em si. E então, em termos de DOI, descobriremos isso mais tarde Eu acho que essa parte é boa. Então eu acho que podemos usar essa parte. Eu não gosto da parte final. Todo mundo presume que Steve Jobs fez fortuna com a Apple, mas isso não é verdade Mas isso é, na verdade, o que eu estou certo? Mas isso está realmente errado. Quando ele morreu, seu patrimônio líquido era de pouco mais de $10 bilhões, mas a maioria era Eu acho que isso vai ser, esse vai ser um roteiro muito bom. Então, usaremos esse script. Essa é uma ideia muito, muito boa, e só precisamos fazer isso acontecer. Então, se você tiver alguma dúvida, me avise, além disso, nos vemos no próximo vídeo. 14. Prepare recursos de UI e layouts para animação: Bem-vindo. Neste vídeo, precisamos criar nossos designs de interface usando nosso script. Também pediremos à ITPT que nos ajude um pouco com isso. E definitivamente podemos usar nossa própria criatividade, e tenho algumas ideias sobre como podemos fazer isso. Mas também gostaria de ver se há algo que IDPT sugira que potencialmente o tornaremos ainda melhor HITPT. Então, vamos usar isso como um script. Acho que isso vai ser muito, muito bom. Então, estamos basicamente nos livrando do final. E para isso, preciso que você sugira que tipo de design de interface de usuário podemos usar. Então, para cada linha ou para cada mudança no design da interface do usuário, preciso que você me diga o que exatamente precisa ser usado. Ok, não vamos adicionar tantos textos. Vamos reduzir sua resposta em 75%. O que eu preciso que você faça é, ao lado da linha, depois de um traço, escrever que tipo de interface de usuário devemos usar porque o que você está fazendo é um pouco demais Você pode dar um exemplo de cartão? Você está falando sobre algum tipo de cartão financeiro mostrando apologo e depois está falando sobre um cartão Então, você pode explicar o que isso significa ou mostrar visualmente , como encontrar visualmente uma imagem on-line para mostrá-la como exemplo? Ok, isso é muito interessante. De qualquer forma, vamos fazer isso sozinhos. Então, nesta parte, vou realmente usar o logotipo da Apple, ah em mente, onde aparece step jobs. Então, essa será uma sobreposição inicial do design da conta bancária Não precisa ser exatamente assim porque podemos mudar algumas coisas um pouco mais tarde. Veio da Pixar. Logotipo animado da Pixar na tela. Aqui precisamos de artigos da Internet e outros artigos. E aqui, ótima pergunta. O que podemos usar? Vamos pensar sobre isso. Potencialmente, podemos usar um iPhone oralmente ou algo parecido. Vamos ver. Vamos ver. Então, logotipo da Apple. Vou até um pouco mais longe e procurarei o logotipo da Apple É melhor tê-lo Bing gi. Isso é ótimo. Vou baixá-lo. Design de conta bancária, na verdade, isso é algo que eu já tenho em um dos designs de interface do usuário. Então essa é a conta bancária que eu tenho. Vou apenas copiá-lo e colocá-lo para baixar. Então, vamos pesquisar o logotipo animado da Pixar. Ok, ótimo. Então, vou apenas copiar o link. Acesse um site, que é tdwn dot TO e baixe este vídeo Não importa qual ferramenta você usa, é apenas algum tipo de download. Você pode pesquisá-lo no Google e poderá baixá-lo facilmente. Vai levar algum tempo. Ótimo. Acabei de baixá-lo. Perfeito. E o que mais temos aqui? Artigos. Então, para isso, vou apenas pesquisar um artigo. Ok, isso é realmente muito bom. Vou apenas fazer uma captura aqui e vou colocar downloads que temos a captura Perfeito. E agora precisamos ter outro artigo, e eu vou fazer uma captura de tela aqui também, e ela será colocada aqui também, certo? Portanto, temos duas capturas de tela. Perfeito. Agora só precisamos gravar um áudio e estaremos prontos para editar este vídeo. Se você tiver alguma dúvida, me avise. Fora isso, nos vemos no próximo vídeo. 15. Anime o design da interface do usuário no After Effects (parte 1): Vídeo, vamos criar as animações. Então, o que eu fiz foi gravar o áudio, cortá-lo no Premiere Pro e, ao selecionar, clicar com o botão direito do mouse, substituí-lo pela composição do After effect, eu o coloquei no After Effects Apenas partes importantes: sempre que você fizer isso, precisará adicionar algum tipo de gráfico. Caso contrário, você não poderá importar apenas o áudio. Depois de colocar isso no After , acabei de excluir o gráfico e agora temos nossa composição, que é de 1080 por 1920, 30 quadros por segundo, e é exatamente do mesmo tamanho do nosso áudio em segundo plano Vamos selecionar todo o áudio e pressionar Shift Command C ou Shift Control C para pré-compor Isso vai ser áudio, então vou chamá-lo de áudio apenas para ter certeza de que está organizado em menos camadas. Vou entrar na vertical e também vou entrar no UI Designs, que é o pagamento do nosso logotipo da Apple, as capturas de tela e o vídeo G selecione tudo, coloque aqui e, na verdade, vou colocá-lo em uma pasta, e vamos chamá-lo de designs de interface do usuário. E agora, tudo o que precisamos fazer é apenas editar o vídeo, temos nosso texto aqui, nossa transcrição Todo mundo presume que Steve Jobs fez fortuna com a Apple, mas isso está realmente errado A propósito, esqueci completamente de encontrar uma foto de Steve Jobs PNG Vamos ver o que temos aqui. Por que não usamos esse? Mesmo sendo de qualidade um pouco pior , ainda é muito bom. Vou colocá-lo aqui e colocá-lo em designs de interface do usuário, embora não seja um design de interface do usuário. Em primeiro lugar, vou pressionar o Comando Y para criar uma camada sólida, que será um sólido branco. E então eu preciso colocar um PNG de trabalhos íngremes aqui e o logotipo da Apple Então, vou diminuir o logotipo da Apple e esse será o começo. Na verdade, o que podemos fazer é copiá-los, colá-los aqui e depois colocar marcadores. Não me lembro de como colocar marcadores, então vou abrir os atalhos do teclado Você pode simplesmente abri-los pesquisando atalhos de teclado, e esse será um atalho para você abrir os Então, vamos procurar o marcador, e será Controle oito no meu caso, Controle oito Para que eu saiba onde temos camadas e notas. Então, agora temos aqui, aqui, aqui, aqui. Então, temos cada novo discurso acontecendo no marcador, o que é ótimo Então, logo no início, temos esse discurso em que todos presumem que Steve Jobs fez fortuna com a Ok, na verdade, vou começar com o segundo com o design da interface do usuário com o pagamento. A propósito, ele não o importou corretamente, então vou excluir o pagamento e arrastá-lo e soltá-lo dessa forma. Quando você o coloca com outras camadas ou com outros arquivos, não o importa da maneira que importamos antes. Então esse será o nosso pagamento, e eu vou mudar 1080 até 1920, então é assim criar um nulo pressionando Shift Option Command Y, selecionar tudo pressionando comando A e segurando o comando, pressionarei null para que possamos desmarcá-lo e vou criar tudo para esse nulo Então, agora, sempre que eu aumentar ou diminuir a escala, tudo vai diminuir ou aumentar. Agora, precisamos encontrar esse texto e colocar outros números aqui porque temos colocar outros números aqui porque temos 134.000 e o patrimônio líquido de Steve Jobs era um pouco maior Então, temos essa linha aqui. Quando ele morreu, seu patrimônio líquido era pouco mais de $10 bilhões, 10 bilhões É esse número aqui. Isso é bastante. E o que vou fazer é criar um texto onde vou colocar um, na verdade, e vou procurar uma predefinição que você pode encontrar na seção de recursos para download Você pode simplesmente aplicar essa predefinição e, basicamente, uma predefinição que nos permite controlar os números e animá-los Este precisa estar em zero porque faz isso em círculos. Basicamente, um círculo tem 360 graus. E quando vou para o próximo círculo, você pode ver que ele adiciona um pouco mais e eu posso simplesmente torná-lo maior ou menor, se eu quiser. Para colocar um número específico, precisamos colocar esse número em zero e colocar aqui cerca de 10 bilhões. Se vai funcionar, é claro, talvez seja um pouco demais para o sistema. Talvez precisemos nos livrar das vírgulas. Aí está. Aí está nosso bilhão. Agora só precisamos tornar o texto um pouco menor. E, obviamente, não queremos seja exatamente isso. Podemos torná-lo um pouco maior ou talvez significativamente maior, algo assim. Vou pressionar P, movê-lo um pouco e diminuir seu tamanho. Mova-o um pouco para cima. Um pouco para a direita e um pouco para baixo. Vamos ver como era o texto antes e agora. Ok, então, mova-o um pouco para a direita. E, a propósito, agora também precisamos associar esse número um ao nulo Podemos colocá-lo no topo. Isso não é um problema. Para que saibamos que temos nossos números ao lado do nulo Então, nosso texto aqui é que quando ele morreu, seu patrimônio líquido era de pouco mais de $10 bilhões Ótimo. Então, podemos simplesmente animar isso Podemos pressionar você para ter o controle do ângulo. Então, colocamos o controle de ângulo. Eu sei, vamos colocá-lo aqui. Mas este, precisamos torná-lo um pouco menor e vai funcionar assim. Então, teremos números crescentes. Agora, para o Sam Smith, precisamos desativar algumas partes que podemos acessar no texto. Sum Smith. Esse é o texto. Quando eu seleciono a camada, se eu criar uma camada de texto, ela estará logo acima dessa camada. Mas se eu não tiver nenhuma camada selecionada e começar a digitar, isso criará uma camada que será a número um Mas queremos garantir que tudo esteja bem unido. Então, será selecionada a camada 71, depois apresentará T e apresentará T aqui. Então, aqui escrevemos Steve Jobs, P e S, e eu vou colocá-lo lá. Vá para desativar Steve Jobs. Isso é bom. Também precisamos fazer com que Steve Jobs seja nulo. E agora, quando aumentamos o tamanho do nulo, tudo vai escalar Podemos excluir essa parte e essa parte, então será assim. A propósito, para Steve Jobs, que também podemos colocar no topo, pressione o comando shift e colchete direito se tornará a camada superior Para garantir que esteja no topo, não é fácil encontrar, podemos adicionar o texto Evo. Vou apenas aplicar uma das predefinições, que será como aumentar a opacidade mais caracteres, então será algo Em seguida, vou para a posição de transformação e apenas altero para que não seja um movimento tão grande no início. Sim, isso parece bom. Basicamente, podemos animar cada parte aqui. Por que não usamos o compositor de animação para criar algum tipo de movimento Vamos pressionar e selecionar tudo um pouco aleatoriamente , ok? Então, oh, interessante. Ele habilitou todas as camadas, toda a visibilidade de todas as camadas. Então, deixe-me desativar alguns Smet. E isso seleciona todas as camadas. Mova-o um pouco para a direita para que não apareçam camadas logo no início. Ok, isso é muito bom. Agora também precisamos animar a opacidade desse texto aqui para garantir que, no início, ele seja visível imediatamente Então, podemos fazer algumas coisas assim. Como você pode ver, temos muitas partes da interface animadas ao mesmo tempo. Tipo, não demoramos muito para fazer isso, mas parece muito bom. Talvez um pouco caótico neste momento, mas veremos que podemos mudar isso Não é um problema, de jeito nenhum. Ok, então, nesta parte, é realmente muito bom. Então é essa parte. E vamos ver o que temos assim. Você vai selecionar essa parte e movê-la para a frente, e acabamos de desativar o Bgon. Sim, assim. Então, vamos abrir nosso vídeo sobre Steve Jobs, Steve Jobs e colocar nosso pagamento aqui , ou seja, vou cortar essa parte pelo colchete direito da opção de preço, então vou cortá-la até o cursor E eu vou colocá-lo aqui. Quando ele morreu, seu patrimônio líquido era de mais de $10 bilhões. A propósito, precisa ser dez e não 1 bilhão. É para ser como esse número, sim. Então, precisamos copiar esse número e não 1 bilhão. Agora, vamos para o nosso texto, que vai ser um, coloque isso em zero, coloque isso em 10 bilhões. Mamãe. E precisamos excluir vírgulas. Assim. Perfeito. Exclua o quadro-chave, pressione Shift P para revelar os quadros-chave de posição, mova-os um pouco para a direita Tipo, muito bom. Agora, vamos fazer com que não seja exatamente, tipo, 1 bilhão, mas um pouco mais do que isso. Vou selecionar isso. Chegue ao primeiro quadro-chave, coloque este em zero e este em esse número, mas também exclua as vírgulas. Aí está. Isso é o que temos. Parece muito bom. Então, quando ele morreu, seu patrimônio líquido é de pouco mais de $10 bilhões Ótimo. Só vou mover esse quadro-chave um pouco mais longe Pelo menos um dos designs de interface do usuário é bom. Mas a maior parte disso não veio de iPhones, Max ou ações da Apple Então, vamos pesquisar ações da Apple. São dois, cinco anos. Um ano, cinco anos, talvez possamos encontrar Sim, algo como esse gráfico seria ótimo. Esse é um ótimo design de interface do usuário. E aqui podemos fazer todos os anos, fazendo uma captura de tela disso Então, também precisamos de iPhones e Max, porque é disso que estamos falando E para isso, podemos usar Mmm. Também podemos usar capturas de tela, iPhone 17, porque esta é a versão mais recente 17 PNGs tornarão nossa vida um pouco mais fácil se a tivermos em Se não o fizermos, sempre podemos sim, isso é bom. Então, eu vou baixá-lo. Mac, PNG. Essa é boa. Nós podemos usá-lo. Então, agora só precisamos selecionar tudo isso, colocá-lo em nosso projeto e depois arrastá-lo e soltá-lo aqui. S para diminuir a escala. E agora vamos criar uma máscara aqui. E eu vou criar uma máscara. Assim. Ótimo. Então, temos o estoque da Apple, depois temos os iPhones e temos a marca Great Então, vou colocá-lo aqui e depois pensaremos em como animá-lo um pouco mais tarde Veio da Pixar, então esse será o logotipo animado da Pixar Vamos encontrar esse vídeo da Pixar. Foi esse? Sim. Mude a opção Command G H para ajustá-la à tela. Eu gostaria de cortá-lo até este ponto. Aqui está, veio da Pixar, e agora teremos empregos comprados em pixels em algum tipo de data e hora Então, vou colocá-lo aqui para diminuir um pouco a escala. Agora podemos usar o efeito de corte. Vamos colocar isso em zero. Agora eu gostei. OK. Agora isso é ótimo. Então, agora podemos cortá-lo de cima ou de baixo sem perder nada. Ok, então corte de cima ou de baixo. Ok, então parece que é o contrário , mas não é um problema. E depois à esquerda e à direita. Isso parece bom. Podemos cortar essa parte. E agora temos outra captura de tela, cerca de 20 anos depois E nós podemos, na verdade, eu acredito. Você pode tirar a captura de tela anterior, copiar tudo isso e colar aqui Agora só precisamos ajustar um pouco as colheitas, só um pouco a partir da parte inferior, um pouco mais à direita, assim. E do topo ou vamos encontrar a parada. Assim. Então, vamos ver o que temos. No começo, isso é o que temos, depois temos essa animação. Então temos isso, e então temos isso, isso, que é, a propósito, provavelmente podemos nos mover um pouco para a direita e aumentá-lo um pouco para que sejam parecidos um com o outro. E então, no final das contas, não temos nada porque ainda não decidimos o que vamos fazer com este. Na verdade, para este, porque estamos usando o para a primeira linha, porque estamos usando o estilo Apple, podemos ser simplistas, como a Apple faz Podemos mantê-lo minimalista. E podemos ter texto aparecendo na tela. Todos presumem que Steve Jos fez fortuna com a Apple Vamos copiar esse texto, abrir a ferramenta de texto, colá-lo aqui, torná-lo preto, colocá-lo no meio, selecionar tudo, torná-lo um pouco maior. Podemos ter algumas maneiras interessantes de fazer isso. Então, vamos cortar isso um pouco, colocar assim. Ótimo. Então, vamos criar uma animação para o texto. Na verdade, vou aplicar a predefinição imediatamente, então vou aplicar por palavras Na verdade, eu gosto de torná-lo um pouco maior porque é um pouco pequeno demais. Ótimo. E agora podemos fazer com que trabalhos difíceis apareçam na tela Portanto, esse é o logotipo da Apple que podemos desativar por enquanto. Podemos ver que os trabalhos rígidos na verdade, se destacam um pouco da parte inferior e queremos que sejam lisos Então, primeiro de tudo, vou torná-lo um pouco maior e colocá-lo acima do texto. E eu vou criar o Comando Y, criar um sólido branco, que podemos marcar como branco. E eu vou abaixá-lo um pouco. Corte, coloque e eu vou diminuir a escala. Também vou aplicar o desfoque rápido de caixa nele. Vou aumentar o desfoque e clicar em pixels de borda repetidos para que isso não se repita. Vamos aumentá-lo de tamanho, pressionar P e abaixá-lo um pouco Então é isso que vamos ter. E podemos animar Steve Jobs para que apareça na tela. Aqui é Steve Jobs. Na verdade, podemos renomear Steve Jobs Podemos simplesmente renomear a captura de tela para ficar rígida esse sólido branco para Então, vamos cuidar dele. Então, agora, sempre que mudarmos Steve Jobs, isso é o que vai acontecer. Vou pressionar P para criar um quadro-chave. Este será o quadro-chave final, mova-o um pouco mais longe Mas no primeiro quadro-chave, ele estará fora do quadro Para selecionar isso, pressione N F nove. Vou abrir o editor gráfico e criá-lo de uma forma interessante. No final, queremos que seja suave, então vamos suavizá-lo. Mas logo no começo, queremos ser o oposto, queremos ser o mais abruptos possível. E, na verdade, eu gostaria de reduzir um pouco as quedas porque vou mudar um pouco o ponto de renda. E então, para o logotipo da Apple, vamos pensar em onde podemos colocá-lo e o que devemos fazer com ele. Pode colocá-lo um pouco mais alto, torná-lo um pouco menor, colocar assim. Na verdade, há um efeito muito interessante, eu me lembro como é chamado. Depois de um pouco de escavação, eu o encontrei. É chamado de lenço irlandês com tinta, sim, toalhete irlandês com tinta Aí está. Então, ao pressionar você para ter os quadros-chave, essa será a transição. Steve Jobs fez fortuna com a Apple. Na verdade, gosto que, quando temos essa cobertura total, possamos simplesmente esconder tudo por trás e depois desativá-la para que possamos manter o fundo branco, mas então tudo o que temos na tela vai desaparecer, e então podemos nos livrar desse círculo porque não é bom. Então, podemos clicar aqui e desativar o círculo. Ótimo. Acho que, neste momento, é uma boa ideia descansar um pouco para reiniciar o cérebro e depois voltar com um novo olhar e ver se alguma coisa vai melhorar ou não. Então, se você tiver alguma dúvida, me avise e nos vemos no próximo vídeo. 16. Continue a animar e adicione efeitos de interação (parte 2): Vamos continuar editando o vídeo. Vamos ver o que temos até agora. Todo mundo presume que Steve Jobs fez fortuna com a Apple, mas isso está realmente errado. Então é aqui que precisamos dizer que isso está realmente errado. Então temos essa animação aparecendo na tela, o que é bom. A propósito, podemos colocar a foto de Steve Jobs aqui no topo. E então podemos potencialmente fazer o zoom aqui. Mas a maior parte disso não veio das ações da Max, da Apple ou da Apple. Então é aqui que precisa estar. Veio da Pixar. Jobs comprou a Pixar em 1986 por 5 milhões de dólares. E então, e então dizemos aquele único acordo, OK, ótimo. Então, tenho algumas ideias sobre o que exatamente podemos fazer aqui. Então, antes de tudo, gostaria de destacar o fato de que ele foi comprado por uma determinada quantia de dinheiro. Então, aqui está o que eu vou fazer. Vou criar uma camada de forma, que vou destacar com a camada de forma, essa coisa. Basicamente, estou apenas criando uma forma em cima disso. E então, para a cor, vamos torná-la amarela. Vamos fazer com que pareça assim. E então, para o modo, vamos usar a multiplicação para que possamos ver através dela. Agora, vou aplicar um efeito chamado limpeza linear E então, se fizermos isso, podemos ver como o texto é destacado. Vou mudar o ângulo para menos 90s para que isso aconteça da esquerda para a direita em vez da direita para a E agora podemos criar um quadro-chave, pressionar em U. Então esse será o quadro-chave final Se nos movermos um pouco para a frente, podemos fazer isso da maneira oposta, então selecione isso, pressione F nove para torná-lo suave, e também podemos fazer da mesma forma para torná-lo ainda mais suave Perfeito. E então eu vou duplicá-lo, pressionar P, movê-lo um pouco para baixo e movê-lo um pouco para a esquerda Assim. Há algumas coisas que podemos fazer. Nós podemos diminuir a forma em si. Então, siga o caminho do retângulo, diminua o tamanho, o tamanho horizontal , pressione P e mova-o para a esquerda, assim, e depois diminua ainda mais o tamanho Agora, como os toalhetes lineares estão em posições diferentes e animamos em posições diferentes, vemos o efeito em que este é destacado, mesmo que este não E isso é exatamente correto. Portanto, precisamos alterar um pouco esses números para que funcionem. Muito bom. Embora eu realmente precomponha isso, porque se aumentarmos a escala, você pode ver isso porque temos esse efeito de limpeza linear, que basicamente vou mostrar rapidamente para Se eu aplicar, tipo, um cinza, sim, aí está. Se eu aplicar um pano cinza, apenas sólido, e depois aplicar um pano linear, você pode ver que tipo de efeito é esse. Então, estamos basicamente animando para partir daqui, que você pode ver nosso destaque aqui Mas sempre que aumentamos a escala, deixe-me dar um exemplo rápido. O destaque permanece na mesma posição. O texto muda sua posição em relação à limpeza linear. É por isso que obtemos esse efeito estranho e, na verdade, seria um pouco melhor apenas pré-compô-lo pouco melhor apenas pré-compô-lo E agora, se aumentarmos qualquer escala, ela permanece exatamente a mesma, que é exatamente o que precisávamos. E então vamos chamá-lo de Artigo 1, e vamos cortá-lo daqui para aqui. A forma de cortar é com o Shift Command D, que cria um corte na camada. Então, a propósito, para esse pixer, também podemos aplicar um efeito de chave de cor e seguida, selecionar a borda fina preta uma, aumentar a tolerância Mas então o que também faremos é criar uma máscara. Então, vou selecionar a camada, clicar aqui na nossa camada de forma. Crie uma máscara. Em seguida, vamos para a chave de cores dos efeitos nas opções de composição Clique em mais, crie uma máscara e, em seguida, precisamos inverter a máscara para não recortar nenhum preto daqui Então agora está perfeito. 20 anos depois, a Disney a comprou por 7 bilhões, então podemos destacar essa linha aqui. Na verdade, podemos simplesmente copiar essa camada de forma, colada aqui, assim Então, este é o nosso destaque, que vamos colocar logo no início. Vamos aumentar o tamanho do retângulo, deslocar P horizontal e verticalmente para revelar a posição e movê-la E só precisamos mudar essa parte. E precisamos mudar isso também um pouco, e isso deve ser bom. Definitivamente fazendo algum progresso aqui. Todo mundo presume que Steve Jobs fez fortuna com a Apple, mas isso está realmente errado. Então, para isso, na verdade, acho que podemos ampliar aqui. E para isso, vou criar um objeto Shift Option Command Y. Vou recortá-lo e alinhá-lo nesta parte aqui Vou conectar tudo isso além de, sim, precisamos de tudo isso para então P e S, e começaremos a partir daqui. E sempre que vejo em segundo plano, mas isso está realmente errado, ampliamos essa parte para enfatizá-la mais ou menos dessa forma, e então podemos pressionar FNF nove A propósito, se você tiver essa opção, o plugin de fluxo também é muito bom porque eu posso simplesmente selecioná-lo. Em vez de fazer isso manualmente, posso simplesmente selecionar um dos gráficos, por exemplo, como este, para torná-lo mais suave. Assim. E mais uma coisa que eu gostaria de fazer aqui no final é criar outra transição aqui para que façamos transição dessa visualização para nosso vídeo de interface do usuário, e também podemos fazer isso com o animation Composer, para que possamos procurar transições Aqui, podemos fazer algo como um zoom out. Acho que o Zoom in vai funcionar muito bem e precisamos colocá-lo no topo. Então, faremos algo como: temos esse tipo de salto aqui dessa cor para muito preto. Só precisamos adicionar algum tipo de transição. E para isso, vou pressionar um pouco de T para essa transição. Vai passar desse superpreto para pouco visível para muito visível. Vai continuar, talvez possamos fazer isso assim, apenas tentando criar uma transição suave que nos permita criar um movimento suave. Sim, isso é realmente muito bom. Primeiro de tudo, podemos vir aqui e encontrar essa parte. Onde está esse. Camada 76, e podemos usar uma foto dele que usamos antes. Ok, vou copiar esse Steve e pagá-lo aqui. Não preciso de nenhum quadro-chave de posição. Podemos simplesmente colocá-lo lá, pressionar S, diminuir um pouco sua escala e depois rastreá-la até a camada 76. E, eu entendo. Portanto, não é a camada 76. É a camada 78 porque a camada 76 é o destaque azul ao redor dela. Então, precisamos rastreá-lo até a camada 78 e habilitá-lo. Eventualmente, torne-o um pouco menor, mova-o um pouco para o lado para que caiba lá. Então, vamos lá. Temos nossas quedas íngremes e, na verdade, eu gostaria de fazer essa camada criar formas a partir da camada vetorial E eu gostaria de tornar essa camada branca para que possamos preenchê-la pessoalmente e depois preenchê-la com branco para que haja um pouco mais de contraste. Podemos ver Steve cair um pouco melhor. Ok, então temos esse zoom muito bom pouco mais de $10 bilhões Então, aqui, eu gostaria de ampliar neste momento. Então, vou criar um nulo. Vamos ver se não é nada animado, não tem nenhuma variedade de presentes, porque se eu pressionar U, nada aparecerá. Então eu posso pressionar P e S, e então eu posso ampliar um pouco esses números. Então, como você pode ver, nosso trabalho de escalada permanecerá na mesma posição. Então, o que temos que fazer é encontrá-lo, Steve Jobs, e precisamos transformá-lo em nulo número um Antes de começar a se mover, agora ele permanece na mesma posição, ótimo. Vou selecioná-lo, agora vou pressionar o fluxo em vez de fazer isso manualmente, para economizar um pouco de tempo e criar um pouco mais de espaço. Então, vamos ver o que temos. E vou mover os quadros-chave um pouco mais rápido para começar um pouco mais rápido. Para este último quadro, podemos movê-lo para fora do quadro, assim. Então, vai daqui para fora do quadro. E para esses, eu também vou clicar para torná-lo um pouco mais suave Vou abrir o gráfico e, logo no começo, quero ser suave, mas no final, queremos que seja rápido para que aconteça assim. Então, ele sai do quadro rapidamente. Vamos ver o que temos aqui. Ok, e aqui estou dizendo que a maior parte disso não veio do iPhone Max ou do Apple Stock, vou colocá-lo na parte inferior e encurtá-los um pouco Os iPhones vão diminuir um pouco o tamanho de tudo Mas a maior parte disso não veio de onde a temos aqui? E aqui, podemos realmente usar algo como um efeito de máquina de escrever Acho que vai ser uma boa mudança na situação porque tínhamos algumas animações diferentes aqui no início Nesta parte, podemos usar algo um pouco mais diferente Máquina de escrever, e então podemos começar a partir daqui. E vou acelerar um pouco porque posso realmente ouvir minha voz nos meus fones de ouvido. Você não pode ouvir isso, mas por uma questão de tempo, vou fazer isso rapidamente aqui. Pressione P, mova-o um pouco mais alto e, potencialmente, diminua um pouco o tamanho. As ações da Apple são pouco visíveis. Precisamos fazer algo para potencialmente aumentá-lo em tamanho, assim, porque o gráfico é muito pequeno. E então, se vamos fazer isso, por que não criamos outra máscara ou essa tem uma máscara? Sim, é verdade. Então, na verdade, podemos simplesmente mudar a máscara. Podemos selecionar isso e depois movê-lo um pouco, assim. Então, estou selecionando a máscara usando a ferramenta de seleção e apenas colocando-a lá. E por que não o movemos um pouco mais para baixo? Potencialmente, coloque-o no meio, agora estou dizendo que veio da Pixar Podemos colocar esse texto aqui dizendo que veio e então a Pixar será como um texto Nosso vídeo funcionará como legenda de certa forma. Então, deixe-me colocar assim. Ok, então temos algumas coisas aparecendo aqui. Temos esse grande texto aparecendo. Vamos pressionar P e S e criar quadros-chave. E eu gostaria de começar com essa linha, que é como Steve Jobs entrou na Pixar e selecionou essas, tornando-as mais fáceis E, na verdade, nesta parte aqui, eu gostaria desses quadros-chave, potencialmente apenas mova-os um pouco, porque não gosto da forma como estão sendo animados aqui. Mova isso um pouco mais rápido também. Por que não encontramos uma foto de Steve Jobs para esta última parte aqui? Esse único acordo o tornou mais rico. Oh, isso parece muito interessante. Por que não tentamos usar um pouco disso? Ok, então para desaparecer, vou apenas animar a opacidade para fazer com que pareça, então aqui também podemos tentar usar uma transição do compositor de animação para ver se E então, para adicionar legendas aqui no final, vou copiá-las Por que não adicionamos o texto E aqui e eu vou colar o texto. Basta selecionar o texto, a pessoa P, mudar sua posição e vamos criar algum tipo de posição de transformação de animação. Vamos abaixá-lo. Diminua a opacidade e aumente o desfoque em 100, 100 pressionando novo e tornando as coisas um pouco mais rápidas e, em seguida, diminua o atraso para, digamos Na verdade, precisa começar aqui. E eu acho que o desfoque é um pouco demais. Então, podemos diminuí-lo para 50. E vamos criar quadros-chave de opacidade aqui também. Então isso vai ser um e vai estar em zero, então esse, por algum motivo, está em cinco. Na verdade, eu gostaria de pré-compor isso e ampliar um pouco mais P e S. Crie quadros-chave, amplie um pouco Tipo, então selecione esses dois. Faça com que seja um pouco mais suave. Ok, vamos assistir desde o início. 17. Adicione música, efeitos sonoros e acabamento final do áudio: Bem-vindo. Neste vídeo, vamos fazer design de som diretamente no After effect. E para fazer isso, precisamos encontrar nosso arquivo de áudio, que estará na parte inferior, e temos que pressionar L e L duas vezes. E então vamos obter as formas de onda de áudio. Isso é muito importante porque vai facilitar nossa flutuação ao vivo Poderemos ver onde temos certas palavras, onde o discurso termina e o outro começa, basicamente o final da frase e o início da nova frase. Agora, para fazer o design de som, precisamos obter áudio, o melhor lugar que encontrei ao longo anos foi o Epidemic Sound Epidemic Sound é uma empresa especializada na produção de música, efeitos sonoros E se acessarmos o site deles e dermos uma olhada, veremos que temos o tipo de descoberta que será como tudo de uma vez. Em seguida, temos o toque de música, onde podemos pesquisar na parte superior ou classificar artistas de diferentes gêneros, coisas assim, super convenientes E para os efeitos sonoros, temos muitos efeitos sonoros aqui e, como você pode ver, também temos uma interface de usuário. Então, chegamos aqui e procuramos muitas interfaces de usuário. O que eu faço é entrar na interface e procurar por alguma falha B. Isso é realmente muito bom. Haverá um link na descrição do teste gratuito de 30 dias do som epidêmico Eu recomendei que você tentasse ver como trabalhar com ferramentas profissionais. No entanto, para economizar tempo, eu já tenho uma pasta com sons da interface do usuário , todos coletados do Epidemic Sound Como você pode ver aqui, temos som epidêmico na parte superior. Então você pode encontrar todos esses sons no Epidemic Sound. E vamos ouvir um pouco o que temos aqui. Sim. Sim. Ok, então esse será o primeiro som que vamos usar e, para tornar nossa vida um pouco mais fácil, podemos selecionar tudo aqui e pré-compô-lo pressionando o comando Shift ou Control C, e ele será chamado de Podemos usar o áudio aqui. Então, podemos realmente criar outra pasta e chamá-la de áudio para tornar as coisas ainda melhores, e depois colocar o áudio aqui e, sempre que colocarmos qualquer outro efeito sonoro, vamos colocá-lo na pasta para garantir que as coisas estejam organizadas. Então vamos lá. Esse é o nosso som. Vou apenas arrastá-lo e soltá-lo. Pressione L, L novamente, e aí temos nosso som. Então, podemos ver que temos dois sons. Todo mundo presume que Steve Jobs fez fortuna com a Apple, mas isso é e podemos encurtá-la fazendo exatamente isso E então, quando Steve Jobs estiver prestes a aparecer na tela, vamos colocá-lo mais ou menos aqui. Steve Jobs M Então, todo mundo presume que Steve Jobs fez fortuna Eu diria que é um pouco mais fácil fazer efeitos sonoros em algo como o Premiere Pro, mas ainda podemos fazer isso no After Effects Então, temos o som quando Steve Jobs aparece na tela. Zoom Steve Jobs fez seu E para trabalhar com o áudio, falando aqui em segundo plano, é um pouco alto demais. Amplie Steve Job. Vamos entrar no áudio do Windows. Então vamos colocá-lo aqui em cima, e só precisamos arrastá-lo e soltá-lo aqui apenas para fins de organização, porque é um pouco mais organizado dessa forma. E então tudo o que precisamos fazer é diminuir a acupose. Por exemplo, para este, eu diria que precisamos ir para, tipo, menos dez. Vamos tentar. O trabalho árduo de Tom? Todo mundo assume um trabalho árduo. Mãe, hmm. Vamos tentar tentar -12 Todos presumem que Steve Jobs fez fortuna com a Apple. Mas se ainda estiver um pouco alto, podemos baixá-lo ainda mais, digamos que, atualmente, esteja em menos dez Podemos fazer isso em -20 e este em -20 também. Então, vamos tentar. Todos presumem que Steve Jobs fez seu Sim. Então, está resolvido em segundo plano. Muito bom. Todos presumem que Steve Jobs fez fortuna com a Apple. Então, aqui para este Zoom, você pode realmente usar o compositor de animação e procurar sons E aqui, na verdade, podemos simplesmente pesquisar um pouco, vamos tentar este Ah, mas na verdade isso é da Apple. Mas isso é verdade. Hmm. Não tenho certeza se está funcionando muito bem aqui. Vamos tentar isso uma vez. Isso é um pouco mais longo. Sua fortuna vem da Apple, mas na verdade é Rom. Mãe, hmm. Ok, isso é melhor. Para esse zoom muito interessante que está acontecendo na tela, podemos realmente usar algo semelhante. Podemos simplesmente duplicar este e depois criar o Swishliko. Na verdade, oh Quando ele morreu, ele não é da Apple, mas na verdade é Rom. Quando ele morreu, ele tinha um patrimônio líquido da Apple. Mas isso está realmente errado quando ele morreu. Ótimo. Então, o que estou tentando fazer é apenas apoiar o momento que temos com algum tipo de som. Então, para este aqui, podemos realmente usar algo como uma catraca, que eu acredito ter Sim, isso pode ser muito bom. Vamos colocar a catraca aqui e ver Presson L para ver Se seu patrimônio líquido fosse de pouco mais de $10 bilhões. Mas a maior parte disso não veio de pixels. Empregos? Que foto você é? Sim, vou usar uma peça que é um pouco mais tarde. Comece mais ou menos aqui quando vemos os números pela primeira vez. Seu patrimônio líquido era de pouco mais de 10 bilhões. Dólares, mas vamos acabar com isso aqui. Vou pressionar Option Right Bracket para finalizar aqui. Bilhões de dólares. Mas a maior parte disso não veio. Ok, para este, podemos usar o efeito de máquina de escrever, que também temos máquina de escrever Vamos simplesmente inseri-lo e desativar o visual porque na verdade é um vídeo, e vamos encontrar um lugar onde a primeira letra comece e a coloquemos lá Mas a maior parte disso não veio de iPhones, Max ou AppleST. Sim, perfeito. E então, para cada imagem que temos em cima, podemos usar algum tipo de sucesso ou algum tipo de pop-up, o que, na verdade, podemos usar para compositores de animação Isso é bom. Eu virei dos iPhones Então, estou apenas encontrando um ponto em que ele muda e depois vou usá-lo novamente. Máximo. E onde está aqui? E vamos adicionar. Vamos ouvir. Eu venho de iPhones, Mac ou ações da Apple. Veio da Pixar. Josh Dobbs comprou Pixar em 1986 por E aqui, podemos usar um efeito sonoro de marcador porque estamos meio que destacando-o com um Então, vamos procurar um marcador. Isso vai ser bom para começar. A propósito, esqueci de adicioná-lo ao áudio. Isso não é um problema. Vamos colocar isso aqui, garantir que as coisas estejam um pouco mais organizadas e depois colocar a catraca aqui também Perfeito. Ok, para o marcador, vamos tentar soltá-lo Vamos ver quando a palavra começa. Aproximadamente aqui. Apenas $5 milhões. Ok, isso é bom. E então, para esse marcador, vamos usar o marcador aqui também Vou duplicá-lo pressionando Command D ou Control D e, em seguida, vou para este lugar onde também vou pressionar e Shift para garantir que ele se encaixe perfeitamente no indicador de reprodução 20 anos depois, o corpo da Disney quatro por 7 bilhões. Para esses movimentos, também podemos usar um swoosh. Então, sabemos que isso é um golpe. Podemos duplicá-lo, colocá-lo no topo, colocá-lo aqui. Começamos em 1986 com apenas 5 milhões de dólares, uma pequena aposta. 20 anos depois, o corpo quatro da Disney. E então use outro aqui, então eu vou duplicar este, colocá-lo no topo, colocá-lo à direita Vamos colocar assim. Por quatro por 7 bilhões. Mova-se para a esquerda para começar mais rápido. Disney body four for seven. Mais tarde, o corpo da Disney quatro por sete. Talvez um pouco para a esquerda. A Disney o comprou por mais de 7 bilhões. Isso é um bom negócio. E aqui precisamos usar algo como um Swoosh rápido. Então, mais uma vez, vá para o Animation Composer, pesquise por Swoosh Um pouco mais rápido, vamos ver. Esse único acordo rendeu a ele 7 bilhões. Esse único acordo o tornou mais rico do que toda a sua carreira na Apple Todo mundo presume que Steve Jobs fez fortuna com a Apple, mas isso está realmente errado. Quando ele morreu, seu patrimônio líquido era de pouco mais de 10 bilhões de dólares Mas a maior parte disso não veio de iPhones, Max ou ações da Apple. Veio da Pixar. Jobs comprou a Pixar em 1986 por apenas 5 milhões de dólares, uma pequena aposta 20 anos depois, a Disney o comprou por mais de 7 bilhões. Esse único acordo o tornou mais rico do que toda a sua carreira na Apple Agora só precisamos reduzir tudo em cerca de 20%. Então, se eu abrir o áudio, teremos -20 Ok, então vou colocar -20 aqui e vou copiá-lo e, em seguida, pressionar a copiá-lo e, em seguida, pressionar guia e colocar -20 mais longe também Apple, mas na verdade isso é Oh, ok. Isso é muito silencioso. Então, vamos tentar menos dez menos dez Basicamente, a da esquerda é a orelha esquerda e a da direita é a orelha direita, e podemos simplesmente retirá-la da orelha direita ou da orelha esquerda. Da Apple, mas isso está realmente errado. Quando tudo bem, então isso precisa ser menos dez e menos dez, também Ele morreu, seu patrimônio líquido? Definitivamente, isso precisa ser muito mais silencioso, menos dez e menos dez. Vamos tentar. Quando ele morreu, seu patrimônio líquido era de pouco mais de um bilhão de dólares. Mas a maioria disso aconteceu. Ah, sim. Isso precisa estar em torno de -20. Mas a maior parte disso não veio de iPhones, Max ou Apple Ah, e isso é, tipo, muito alto. Ok, então clique neste. -20 -20. Vamos ver. Quão alto é? iPhones. OK. Essa é uma boa quantidade de volume, -20. -20 é basicamente em termos de decibéis. Você quer ter certeza de que o áudio está aproximadamente entre zero e -30 em termos de efeitos sonoros, dublagens e coisas Quais escolhas estão em 19 Isso também precisa estar em menos dez, para que possamos ouvi-lo, mas não está dominando Quais são as escolhas em 1986? Nós apenas brigamos? Isso é muito alto, eu sei, imediatamente , precisa estar em -25, mais ou menos, porque está muito alto É por apenas 5 milhões de dólares. Uma pequena aposta 20 anos depois, a Disney. Então, mais uma vez, precisa estar em -25. 20 anos depois, a Disney o comprou por mais de sete. E isso precisa estar em -15. A Disney o comprou por mais de 7 bilhões. Esse único acordo o transformou. E isso precisa ser, vamos tentar -15. Esse único acordo o tornou mais rico do que toda a sua carreira na Apple Todo mundo presume que Steve Jobs fez fortuna com a Apple, mas isso está realmente errado. Quando ele morreu, seu patrimônio líquido era de pouco mais de 10 bilhões de dólares, mas a maior parte não Na verdade, o movimento que ocorre quando está caindo, na verdade, eu gostaria de adicionar outro efeito sonoro aqui. O que seria como um golpe. Podemos acessar a pesquisa de compositores de animação por Swoosh. Para este swoosh, mova-o Bilhões de dólares. Mas a maioria. E mova-o para mais ou menos aqui. Quando está prestes a desaparecer e se mover para uma velocidade super rápida. Bilhões de dólares. Mas a maioria. Um pouco mais rápido. Bilhões de dólares. Mas a maioria. Pouco mais de 10 bilhões de dólares. Mas a maioria. Maioria. Shalin. É melhor aqui. Ok, então áudio, vamos fazer menos dez para este, menos dez, menos dez foi um pouco mais Mas a maior parte disso não veio dos iPhones, Max ou das ações da Apple Veio da Pixar. Jobs comprou a Pixar em 1918 Acho que a Pixar pode ser uma boa ideia permitir que o visual, permita que o áudio apareça aqui também Bullet. Veio da Pixar. Jobs comprou a Pixar? Então, vamos ouvir. Estoque completo Veio da Pixar. Jobs comprou a Pixar em 1986 por apenas 5 milhões de dólares, uma pequena aposta 20 anos depois, a Disney o comprou por mais de sete. Bilhão. Esse único acordo o tornou mais rico do que toda a sua carreira na Apple Todo mundo presume que Steve Jobs fez fortuna com a Apple, mas isso está realmente errado. Quando ele morreu, seu patrimônio líquido era de pouco mais de 10 bilhões de dólares, mas a maior parte não vinha de iPhones, Max ou ações da Apple Veio da Pixar. Jobs comprou a Pixar em 1986 por apenas 5 milhões de dólares, uma pequena aposta Dez anos depois, a Disney o comprou por mais de 7 bilhões. Esse único acordo o tornou mais rico do que toda a sua carreira na Apple Todo mundo acha que está bem, esse vídeo é perfeito. Eu absolutamente amei o resultado. Temos muitos efeitos sonoros bons e são muito, muito bons. Agora, a última parte, tudo que precisamos fazer é exportar o vídeo. Nós vamos fazer o próximo vídeo. Se você tiver alguma dúvida, me avise. Fora isso, nos vemos no próximo vídeo. 18. Como exportar sua animação de UI do After Effects para as redes sociais: Bem-vindo. E esse vídeo é enviado para que possamos exportar o vídeo. Então, tudo o que precisamos fazer é entrar no arquivo no canto superior esquerdo, clicar em Exportar e adicionar à fila de renderização Para as configurações, recomendo que você mantenha as melhores configurações aqui nas configurações de renderização e no módulo de saída. Eu recomendo definir alta qualidade com o Alpha. Basicamente, em termos dessas configurações, se você precisar de algo específico, você definitivamente saberá porque um cliente solicitará ou uma plataforma solicitará ou algo parecido. Caso contrário, deixe na melhor das hipóteses e coloque uma alta qualidade com o Alpha. Então, faça assim. O que isso faz é que, se houver algo parecido com um plano de fundo, ele manterá o plano de fundo. Mas se houver algo transparente , será transparente. É apenas algo que eu criei para mim e sempre tenho alta qualidade com o Alpha. É um pouco mais fácil porque não preciso trocar. É por isso que eu sempre exporto com essas configurações. E então, se eu clicar aqui, precisamos dar o nome do vídeo, que será o nome da composição que queremos exportar. Podemos mudar isso aqui no topo. Clique em Salvar e, em seguida, clique em Renderizar. E é isso. Depois de renderizar, poderemos ver o vídeo inteiro para garantir que está tudo bem Se for, então este vídeo está pronto. Vamos até a área de trabalho e ver o vídeo. Todo mundo presume que Steve Jobs fez fortuna com a Apple, mas isso está realmente errado. Quando ele morreu, seu patrimônio líquido era de pouco mais de 10 bilhões de dólares Mas a maior parte disso não veio de iPhones, Max ou ações da Apple Veio da Pixar. Jobs comprou a Pixar em 1986 por apenas 5 milhões de dólares, uma pequena aposta 20 anos depois, a Disney o comprou por mais de 7 bilhões. Esse único acordo o tornou mais rico do que toda a sua carreira na Apple Lindo, absolutamente lindo. Adoro esse vídeo e esses vídeos prontos para serem publicados. Então, se você tiver alguma dúvida, me avise e nos vemos no próximo vídeo. 19. Último passo!: Parabéns para você. Você está quase 100% concluído com o curso de animação pós-efeitos da interface do usuário. Há apenas dois pequenos passos que você precisa dar. Primeiro, aja. Como disse Confúcio, uma jornada de 1.000 milhas começa com uma Então, se você ainda não o fez, dê o primeiro passo criando sua primeira animação de interface de usuário. Todas as melhores informações do mundo não significam nada se você não agir de acordo com elas, e até mesmo pequenos passos levam a resultados massivos. E. Se você encontrou valor neste programa, eu realmente apreciaria se você pudesse levar 60 segundos para deixar sua avaliação honesta. Serei imensamente grato a você e seu feedback ajudará enormemente os futuros alunos escolher o melhor programa para eles Embora esse curso esteja concluído, sua jornada está apenas começando. Certifique-se de manter eu e meus colegas informados. Lembre-se de que estou aqui para seu sucesso. Portanto, se você tiver alguma dúvida, entre em contato na seção QN abaixo Obrigado novamente por me escolher como seu instrutor, desejando a você tudo de bom e ansioso para vê-lo em cursos futuros