AjudaDesign de movimento

Design de movimento

Assista ao exemplo de movimento em destaque e aprenda a criar um briefing, visualizar, revisar e exportar um projeto. O passo a passo usa um projeto de prática separado chamado Focus.

Design de movimento — exemplo em destaque, 37 segundos. As etapas abaixo usam um projeto Focus separado para explicar o fluxo de trabalho.

Comece com um dos cinco exemplos integrados

Na Home, selecione Motion design abaixo do campo de prompt. Quatro linhas ficam visíveis por vez. Role a lista de exemplos para revelar Product Promo na parte inferior.

Captura contínua com rolagem; o app mostra quatro linhas por vez.

Encontre uma direção útil

  • Bring Ideas to Life: uma história de 20 segundos com recortes de papel para narrativa, personagens e textura artesanal.
  • The Future Is Already Here: um reel de tecnologia de 20 segundos para edição guiada pelo ritmo, tipografia cinética e superfícies cromadas.
  • Motion Designer Showreel: uma apresentação de motion de 15 segundos para portfólios e introduções.
  • One-Shape UI Motion: uma transformação contínua de interface de 14 segundos, de botões e estados de carregamento a players e gráficos.
  • Product Promo: um filme de 15 segundos sobre um produto fictício de pagamentos, voltado a benefícios, demonstrações de interface e um encerramento com a marca.

Primeiro, abra o Preview; depois, adapte o prompt

Clique na miniatura para abrir o Preview. Feche-o e clique no título ou no texto do prompt para inserir o briefing do exemplo no compositor. Substitua o produto, o texto, a duração e o estilo antes de enviar. Abrir um Preview não cria um novo projeto seu.

Antes de começar

Conclua a configuração da conexão com IA uma vez. Escolha um projeto pequeno o suficiente para inspecionar: o exemplo Focus usa um ponto verde, um cartão de tarefa, uma marca de conclusão e uma mensagem final da marca. Ele usa animação e áudio locais, em vez de um serviço externo pago de geração de mídia.

Etapa 1 — Escolha Motion design

Na Home, abra o menu de tipo de criação abaixo do prompt e escolha Motion design. Os exemplos integrados de movimento aparecem abaixo do compositor. A lista mostra quatro linhas por vez; role dentro dela para chegar à quinta. Veja todos os cinco exemplos se quiser um ponto de partida.

Escolha Motion design no menu de tipo de criação da Home.

Etapa 2 — Descreva o resultado

Informe a duração, a proporção, o texto visível, a direção visual, o tempo das cenas, o áudio e os arquivos finais. Peça um arquivo-fonte editável e um MP4 reproduzível quando precisar dos dois.

Crie um filme de produto com movimento de 10 segundos chamado Focus, em 1920×1080 a 30fps. Use branco-papel #fafafa, tinta #262626 e um toque discreto de verde #63fe13. Mantenha um único ponto verde percorrendo continuamente um cartão de tarefa Collect, uma marca de conclusão Done e uma marca final Focus. Mostre Focus em 0–2s, Collect em 2–5s, Done em 5–8s e “Make room for what matters.” em 8–10s. Adicione música original suave e alguns efeitos sonoros sutis, sem narração nem serviços externos pagos de mídia. Crie neste projeto o arquivo-fonte editável e o MP4 real.
Um rascunho de briefing em inglês no compositor da Home. Confirme o tipo de criação antes de enviá-lo.

Etapa 3 — Aguarde a produção e a renderização

O agente cria os arquivos-fonte e os recursos e depois renderiza o vídeo. Um plano ou uma prévia animada do arquivo-fonte não comprova que o MP4 existe. Aguarde o arquivo de vídeo e o estado de conclusão da renderização.

O aplicativo renderizando o vídeo real.

Etapa 4 — Inspecione o vídeo

Abra o artefato MP4 e reproduza-o. Verifique o texto, a continuidade do movimento, as transições, a pausa final, a música e os efeitos sonoros. Percorra também a linha do tempo, além de assistir do início ao fim. Inspecione o arquivo-fonte editável separadamente quando precisar continuar trabalhando nele.

Controles originais do aplicativo e suas posições de operação. A arte do player foi composta com imagens do filme em destaque para fins de ilustração.
A cena azul pintada à mão aos 18 segundos do filme em destaque.

Etapa 5 — Solicite uma revisão específica

Continue no mesmo projeto. Identifique a alteração exata e o que deve permanecer consistente e, em seguida, solicite uma nova renderização. No passo a passo real, a segunda versão altera apenas a mensagem final. Abra o novo MP4 e confirme se a frase revisada está visível. Atualizar o arquivo-fonte não altera retroativamente um vídeo já renderizado.

Altere a frase final de “Make room for what matters.” para “Focus on what matters.” Mantenha as outras cenas, a duração de dez segundos, as cores e o áudio. Renderize focus-v2.mp4 e mantenha o focus.mp4 original para comparação.
Controles originais do aplicativo e suas posições de operação. A arte do player foi composta com imagens do filme em destaque para fins de ilustração.

Etapa 6 — Baixe a versão verificada

Abra o MP4 que pretende entregar e clique em Download (Baixar) na barra de ferramentas superior direita. Escolha um local e um nome de arquivo na janela de salvamento do sistema. Confirme se o arquivo local existe, pode ser reproduzido e contém a revisão mais recente. Se a janela de salvamento não conseguir concluir a operação, preserve o projeto e inclua o estado de erro da janela ao pedir ajuda ao suporte. Clicar no controle Download não significa que o salvamento foi concluído.

Controles originais do aplicativo e suas posições de operação. A arte do player foi composta com imagens do filme em destaque para fins de ilustração.

Mantenha o projeto editável

Neste exemplo, o arquivo de entrada é motion-source/focus/index.html. Ao mover o arquivo-fonte, mantenha junto dele o arquivo GSAP, as fontes e o áudio. O MP4 é o arquivo final para reprodução; ele não contém o projeto-fonte editável.

Controles originais do aplicativo e suas posições de operação. A arte do player foi composta com imagens do filme em destaque para fins de ilustração.

Facilite o entendimento do briefing

Especifique o texto visível em vez de pedir ao agente que tente adivinhá-lo. Use intervalos de tempo para momentos importantes e informe se a saída deve ser um filme ou uma animação interativa. Mencione explicitamente a música e a narração. Para revisões, indique a cena ou o intervalo de tempo e identifique os elementos que devem permanecer inalterados.