Crie um desenho à mão. GIF no Adobe Photoshop

1. Introdução: Quer apimentar seu blog ou site com GIFs animados bonitos? Você já precisou da reação perfeita GIF para aquele amor menial? Todos nós já estivemos lá. Faça esta aula para aprender como você pode fazer uma você mesmo. Vou guiá-lo por todo o processo de animação de personagens desenhados à mão e letras no Photoshop. Do esboço à exportação. É muito mais fácil do que imagina. Em breve você estará exibindo seus GIFs em seu blog ou Instagram. Então vamos começar e fazer alguns GIFs. 2. Como preparar seu GIF à mão de letras: O projeto para esta classe é criar um GIF desenhado à mão com pelo menos um aspecto animado. Pode ser tão simples como um personagem piscando ou rabiscar estilo mão-lettering. Eu gosto muito desse efeito de texto saltando que eu usei no meu vídeo de introdução, e é realmente muito fácil de fazer. Então eu vou seguir em frente e demonstrar isso primeiro. Primeiro, desenhe sua palavra ou frase , crie uma nova camada e solte a opacidade da primeira camada para que fique mais fácil de rastrear. Não se preocupe com o traço ser perfeito. O ponto é que cada traçado seja ligeiramente diferente do último. Repita isso duas ou três vezes mais. Acho que é uma boa ideia fazer três a cinco camadas. Você também pode fazer essa etapa tradicionalmente com caneta e papel de rastreamento e digitalizá-la se quiser. Depois de terminar seus cinco traçados, certifique-se de aumentar a opacidade de todas as suas camadas até 100%. A maneira mais fácil de alterar a cor de suas letras em todas as camadas é criar um mapa de gradiente. Vá para ajustes, mapa de gradiente e certifique-se de que a camada está no topo. Em seguida, clique na barra de gradiente e, com esses seletores de cores nos lados de gravação e esquerdo, você pode clicar duas vezes neles e escolher uma cor. Como esta camada está no topo, ela se aplicará a todas as camadas abaixo dela. Cada camada representa um quadro da animação. Então, por uma questão de organização, certifique-se de mantê-los numerados na ordem em que deseja que eles joguem. Agora que terminei minhas camadas, estou pronto para animar. 3. Como animar sua lettering: Portanto, você vai querer se certificar de que sua linha do tempo está visível. Vá para Janela > Linha do tempo. Em algumas versões do Photoshop, ele vem com o menu suspenso aqui no centro, que tem um par de opções diferentes de exibição da linha do tempo. Você só deve ter certeza de que você escolhe Criar animação de quadro. É aqui que você organizará seus quadros-chave e testará sua animação. O primeiro quadro mostra todas as camadas que estão definidas como visíveis. Você deseja desativar a visibilidade de todas as camadas que você não deseja exibir. Como queremos que a camada um apareça no primeiro quadro, certifique-se de que as camadas de dois a cinco sejam invisíveis. Antes de passar para o quadro dois, você vai querer alterar o tempo clicando nesta seta suspensa. Você sempre pode alterar a velocidade alterando os tempos de atraso de seus quadros mais tarde se quiser, mas geralmente acho que 0,2 segundos por quadro funciona bem para GIFs. Então, quando você cria um novo quadro clicando neste símbolo ouvir direito na linha do tempo, esse novo quadro irá replicar as configurações do primeiro quadro. É por isso que eu fiz você mudar o tempo de atraso porque então ele só irá aplicar automaticamente esse tempo de atraso para os próximos quadros que você fizer. Então, de qualquer maneira, você só tem que ter certeza que a camada dois é a única camada que é visível no quadro dois e camada três é a única camada que é visível no quadro três e assim por diante e assim por diante e assim quarta para os outros dois quadros. Aqui em baixo há um menu suspenso que tem a opção de jogar Once, Three Vezes ou Forever, e você vai querer escolher Forever, já que queremos fazer loop. Empurre o play e lá vai você. Acho que parece muito bom. Muito feliz com isso. Vou mostrar a vocês como exportá-la mais tarde. 4. Como animar um personagem: É aqui que fica um pouco mais complicado, dependendo da complexidade do seu personagem e da animação em si. O processo real de animação quadro a quadro é praticamente o mesmo que é com o texto, mas você vai querer testar sua animação áspera antes de limpar seus desenhos. Então eu vou fazer essa garotinha acenar. Eu não preciso necessariamente fazer isso, mas para uma demonstração, vou usar uma técnica chamada Onion Skinning, onde você desenha seu primeiro quadro e seu último quadro onde você quer que a animação termine antes de tudo dos quadros no meio. Como já tenho meu primeiro quadro desenhado, vou diminuir a opacidade, fazer uma nova camada e desenhar meu último quadro. Agora que isso foi feito, é mais fácil ver o que precisa acontecer no meio. Esta é uma técnica especialmente útil para animações mais complicadas, como correr ou dançar. Certifique-se de ficar bastante solto com seus desenhos nesta fase se você estiver fazendo algo mais complicado como isso. Não fique preso ao limpá-los, porque você quer garantir que sua animação seja executada sem problemas primeiro antes de passar o tempo para torná-los bonitos. Esta é uma animação que fiz há alguns anos. É um conjunto de movimentos de teste para um jogo. Mas de qualquer forma, como você pode ver, é muito mais complicado. Eu tive que usar referência e realmente passei algum tempo nisso. Então seria algo assim que você gostaria de usar a pele de cebola. Se você está apenas fazendo seu personagem fazer algo simples como piscar ou acenar, você não precisa necessariamente fazer isso. O que funciona para você, na verdade. De qualquer forma, agora que tenho minhas camadas, estou transferindo-as para minha linha do tempo para testar minha animação. Eu não vou me preocupar em limpar isso porque eu gosto de como ele parece, mas se você limpar seus esboços ásperos fazendo arte de linha limpa em camadas separadas, todas as suas novas camadas vão estragar sua animação. É mais fácil recriar sua linha do tempo com sua nova arte de linha. Caso contrário, você teria que voltar e mexer com todas as configurações de visibilidade de cada camada em cada quadro-chave. 5. Exportando GIF e vídeos: Aqui está o meu GIF acabado. Exportar um GIF é bem simples. Se você tem uma versão do Photoshop de, Eu acredito 2015 e de volta, a opção Salvar para Web está em um lugar diferente. Na minha versão, está aqui em Salvar como. Mas, para versões mais antigas, você precisará ir para Arquivo > Exportar > Salvar para a Web. De qualquer forma, clique em Salvar para Web. Certifique-se de que tudo fique bem. O tamanho do arquivo deve ser relativamente pequeno e a repetição deve ser definida como Forever. Mudei o meu para 600 por 600 pixels e depois cliquei em Enter porque parecia um pouco grande. Isso parece bom. Salve-o na sua área de trabalho e lá vai você. Se você quiser postar seu GIF no Instagram, você precisará exportá-lo como um vídeo porque o Instagram não suporta GIFs. O vídeo deve ter pelo menos cinco segundos de duração, então você precisa alongar seu GIF. Como meus quadros estão definidos para 0,2 segundos, isso significa que precisarei de pelo menos 25 quadros. Mas tenha em mente que você pode precisar de mais ou menos se você tiver escolhido uma quantidade diferente de tempo para cada quadro durar. De qualquer forma, basta copiar e colar as camadas realçando todas elas e, em seguida, mantendo pressionada a tecla Option (ou Alt no PC) e arrastando-a. Em seguida, realce-os novamente, mantenha pressionada a tecla Option e arraste e solte Lá vai você. Eu agora tenho 30 quadros, então isso deve ser muito tempo. Então tudo o que você faz depois disso é ir para Arquivo > Exportar > Renderizar vídeo. Levará alguns segundos para carregar. Altere o nome se for necessário e certifique-se de salvá-lo na área de trabalho. Em seguida, pressione Render. Agora você pode visualizá-lo. Você pode colocá-lo em seu telefone soltando-o em seu Dropbox, ou se você tiver um iPhone, colocando-o em uma pasta e, em seguida, afundando essa pasta no seu telefone através do iTunes. Isso é isso! Se você postar seu GIF no Instagram, sinta-se livre para me marcar @melissaleedesign. Eu adoraria vê-los lá ou na página do projeto da turma. Muito obrigado por ter assistido à minha aula. Eu adoraria se você me deixasse um comentário, e por favor não hesite em me fazer quaisquer perguntas que você possa ter em Discussions. Te vejo na próxima vez!