Como editar interpolações de movimento usando o Motion Editor

O Editor de movimento do Animate ajuda você a criar Interpolações de movimento complexas de maneira muito simples. O Editor de movimento apresenta uma exibição compacta de todas as Propriedades aplicadas à determinada interpolação no formato de gráficos bidimensionais. Você pode optar pode modificar cada um desses gráficos, além das propriedades de interpolação correspondentes. Com controle preciso e alta granularidade, é possível enriquecer muito suas animações para simular um comportamento real no Editor de movimento.

Sobre o Editor de movimento

O Editor de movimento foi projetado para facilitar a criação de interpolações complexas. O Editor de movimento permite controlar e manipular as propriedades de uma interpolação. Após criar uma Interpolação de movimento, é possível aproveitar o Editor de movimento para refinar com exatidão sua interpolação. O Editor de movimento possibilita a edição direcionada da interpolação, permitindo selecionar e modificar uma propriedade por vez.

Por que usar o Editor de movimento?

O Editor de movimento foi projetado para facilitar a criação de interpolações complexas. Assim, o Editor de movimento oferece controle granular de interpolações e suas propriedades. Os itens a seguir podem ser obtidos somente pelo uso do Editor de movimento:

• Fácil acesso e modificação de todas as Propriedades aplicadas a uma interpolação em um único painel.
• Adicionar diferentes predefinições atenuadas ou personalizar a atenuação: o Editor de movimento permite adicionar predefinições diferentes, adicionar várias predefinições ou criar uma Atenuação personalizada. Uma maneira fácil de simular o comportamento real de objetos é adicionar uma atenuação a uma propriedade interpolada.
• Curva resultante: é possível aplicar atenuações a propriedades individuais e ver os efeitos dessas atenuações em gráficos de propriedade individuais por meio da Curva resultante. Uma curva resultante é uma representação da interpolação real.
• Pontos de ancoragem e pontos de controle: é possível isolar e editar as seções principais de uma interpolação através dos Pontos de ancoragem e pontos de controle.
• Animações refinadas: o Editor de movimento é a única maneira de fazer determinados tipos de animações, como criar uma interpolação de caminho com curva em uma propriedade individual ajustando sua Curva de propriedade.

Como abrir o painel do Editor de movimento

Neste artigo, presume-se que você já criou uma Interpolação de movimento e está usando o Editor de movimento para refinar a interpolação.

Para abrir o Editor de movimento, faça o que se segue:

1. Na Linha do tempo, selecione o intervalo de interpolação de movimento que deseja refinar e clique duas vezes no intervalo de interpolação. Também é possível clicar no intervalo de interpolação e selecionar Refinar interpolação para ativar o Editor de movimento.

Curvas de propriedade

O Editor de movimento representa as Propriedades de uma interpolação por meio de gráficos bidimensionais chamados Curvas de propriedade. Esses gráficos são formados em uma grade no Editor de movimento. Cada propriedade possui sua própria Curva de propriedade, organizada em relação ao tempo no eixo horizontal (da esquerda para a direita), e em relação à alteração para um valor de propriedade no eixo vertical.

É possível manipular a Interpolações de movimento através da edição das Curvas de propriedade no Editor de movimento. Para isso, o Editor de movimento proporciona uma edição estável das Curvas de propriedade, permitindo que você tenha mais controle sobre a interpolação. Você pode adicionar Quadros-chave da propriedade ou Pontos de ancoragem para manipular uma Curva de propriedade. Isso permite manipular as partes-chave da Curva de propriedade, onde você deseja que as interpolações exibam transições para determinada Propriedade.

Observe que o Editor de movimento só permite editar as propriedades que não podem ser alteradas durante um intervalo de interpolação. Por exemplo, a Propriedade de qualidade do filtro Bisel de gradiente pode receber apenas um valor durante o intervalo de interpolação e, assim, não é possível editá-lo com o Editor de movimento.

Pontos de ancoragem

Os pontos de ancoragem oferecem um controle maior sobre as Curvas de propriedade, o que permite a modificação explícita das partes essenciais de uma curva. Você pode controlar com precisão a forma de grande parte das curvas no Editor de movimento ao adicionar os quadros-chave da propriedade ou os pontos de ancoragem.

Os Pontos de ancoragem são exibidos como quadrados na grade. Você pode usar o Editor de movimento para controlar o comportamento da interpolação ao adicionar Pontos de ancoragem a uma Curva de propriedade ou modificar sua posição. Ao adicionar um Ponto de ancoragem, um canto é criado, no qual a Curva passa pelos ângulos. Contudo, é possível suavizar qualquer segmento de uma Curva de propriedade com os controles de Bézier para os Pontos de controle.

Pontos de controle

Os pontos de controle permitem suavizar ou modificar uma Curva de propriedade em qualquer um dos lados de um Ponto de ancoragem. Os Pontos de controle podem ser modificados usando os Controles de Bézier padrão.

Edição de curvas de propriedade

Para editar as Propriedades de uma interpolação, faça o seguinte:

1. No Animate, com um intervalo de interpolação selecionado, Clique com o botão direito do mouse > selecione Refinar interpolação para exibir o Editor de movimento (ou clique duas vezes no intervalo de interpolação selecionado).
2. Role para baixo e selecione a Propriedade que deseja editar. Para inverter a seleção, clique com o botão direito do mouse e selecione Inverter seleção.
   
3. Com a Curva de propriedade para a Propriedade selecionada em exibição, é possível escolher qualquer uma das ações abaixo:
   1. Adicione o Ponto de ancoragem ao clicar no botão  e em um quadro desejado na Curva de propriedade para adicionar um Ponto de ancoragem. Ou clique duas vezes na curva para adicionar um ponto de ancoragem.
   2. Selecionar e mover (para qualquer direção) um Ponto de ancoragem existente para o quadro desejado localizado dentro da grade. O limite vertical do movimento está restrito ao intervalo de valores da Propriedade.
   3. Remova um Ponto de ancoragem ao selecionar e pressionar Ctrl + Clique (Cmd + Clique no MAC).

Edição de Curvas de propriedade usando Pontos de controle

Para editar as Curvas de propriedade usando os Pontos de controle, faça o seguinte:

1. No Animate, com um intervalo de interpolação selecionado, Clique com o botão direito do mouse > selecione Refinar interpolação para exibir o Editor de movimento (ou clique duas vezes no intervalo de interpolação selecionado).
2. Role para baixo e selecione a Propriedade que deseja editar. Para inverter a seleção, clique com o botão direito do mouse e selecione Inverter seleção.
   
3. Com a Curva de propriedade para a Propriedade selecionada em exibição, é possível escolher qualquer uma das ações abaixo:
   1. Adicionar um Ponto de ancoragem clicando no botão  e em seguida clicando no quadro desejado localizado dentro da grade. Ou clique duas vezes na curva para adicionar um ponto de ancoragem.
      
      OU
      
      
   2. Selecionar um Ponto de ancoragem existente na grade.
4. Com o Ponto de ancoragem selecionado, aplique o comando Alt+arrastar verticalmente para ativar os Pontos de controle. É possível modificar a forma da curva para suavizar os segmentos do canto usando os controles de bézier. 

Como copiar Curvas de propriedade

Também é possível copiar Curvas de propriedade para outras Propriedades localizadas dentro do Editor de movimento.

Para copiar uma Curva de propriedade, faça o seguinte:

1. No Animate, com um intervalo de interpolação selecionado, Clique com o botão direito do mouse > selecione Refinar interpolação para exibir o Editor de movimento (ou clique duas vezes no intervalo de interpolação selecionado).
2. Selecione a Propriedade cuja curva deseja copiar e clique com o botão direito do mouse > Copiar OU pressione Ctrl + C (Cmd + C no MAC).
3. Para colar a curva com valores absolutos, selecione a Propriedade na qual você deseja colar a curva de propriedade copiada e clique com o botão direito do mouse em > Colar ou pressione Ctrl + V (Cmd + V no MAC).
4. Para colar a curva no intervalo da curva de destino, selecione a Propriedade na qual você deseja colar a curva de propriedade copiada e clique com o botão direito do mouse em > Colar para ajustar ao intervalo atual.

Como reverter uma Curva de propriedade

Para reverter uma Curva de propriedade, faça o seguinte:

1. No Editor de movimento, selecione uma Propriedade.
2. Clique com o botão direito do mouse > Reverter para reverter a Curva de propriedade.

Aplicação da predefinição e de atenuações personalizadas

O efeito Easing permite controlar a velocidade da interpolação, produzindo um movimento mais realista e com efeitos mais agradáveis. Aplicar atenuações em interpolações de movimento permite manipular o início de uma animação, fazendo com que o objeto apresente um movimento mais natural. Por exemplo, um dos usos mais comuns é adicionar a aceleração e desaceleração realística no final do caminho de movimento de um objeto. Em outras palavras, o Animate realiza alterações na taxa de mudança do valor da Propriedade, dependendo da atenuação aplicada.

A atenuação pode ser simples ou complexa. O Animate inclui um grande intervalo de atenuações predefinidas que você pode aplicar para obter efeitos simples ou complexos. Você também pode atribuir Força a uma atenuação, para aprimorar o efeito visual de uma interpolação. No Editor de movimento, você também pode criar suas próprias curvas de atenuação.

Como as curvas de atenuação no Editor de movimento podem ser complexas, use-as para criar um movimento complexo no Palco, sem criar caminhos complexos de movimento no mesmo. Também é possível usar as curvas de atenuação para criar interpolações complexas de qualquer outra propriedade, além das propriedades espaciais como Local X e Y.

Facilidade na personalização

A personalização de atenuações permite que você crie sua própria atenuação usando a curva de Atenuação personalizada no Editor de movimento. É possível aplicar a atenuação personalizada a qualquer propriedade de uma interpolação selecionada.

O gráfico de Atenuação personalizada representa o nível de movimento com o passar do tempo. Os quadros são representados pelo eixo horizontal, e a percentagem de alteração nas interpolações é representada pelo eixo vertical. O primeiro valor na animação é em 0% e o último quadro-chave pode ser definido de 0 a 100%. A taxa de alterações da instância interpolada é exibida pelo declive na curva do gráfico. Se você criar uma linha horizontal (sem declive) no gráfico, a velocidade será zero; se você criar uma linha vertical no gráfico, haverá uma taxa instantânea de alteração.

Como aplicar uma curva de atenuação a uma Curva de propriedade

Para adicionar atenuação a uma Propriedade interpolada, faça o seguinte:

1. No Editor de movimento, selecione a Propriedade na qual você deseja aplicar a Atenuação e clique no botão Adicionar atenuação para exibir o Painel de atenuação.
2. No Painel de atenuação, você pode:
   1. Aplicar uma Atenuação predefinida, selecionando uma predefinição no painel esquerdo. Especificar a Força da atenuação, inserindo um valor no campo Easing.
   2. Criar uma atenuação personalizada, selecionando Personalizar atenuação no painel esquerdo e modificando Curva de atenuação. Para obter mais informações, consulte Criação e aplicação de curvas de atenuação personalizadas.
3. Clique em qualquer ponto fora do Painel de atenuação para fechá-lo. Observe que o botão Adicionar atenuação exibe o nome da Atenuação aplicada à Propriedade.
   

Como criar e aplicar Curvas de atenuação personalizadas

Para criar e aplicar uma Atenuação personalizada a uma Propriedade interpolada, faça o seguinte:

1. No Editor de movimento, selecione a Propriedade na qual deseja aplicar a Atenuação personalizada, e em seguida clique no botão Adicionar atenuação para exibir o Painel de atenuação.
2. Nele, é possível modificar a curva padrão da Atenuação personalizada da seguinte maneira:
   1. Pressione Alt + Click para adicionar Pontos de ancoragem na curva. Além disso, você pode mover esses pontos para qualquer local da grade.
   2. Ativar Pontos de controle (Alt+click em um Ponto de ancoragem) em um Ponto de ancoragem para suavizar segmentos de curva em qualquer um dos lados de um Ponto de ancoragem.
3. Clique fora do Painel de atenuação para fechá-lo. Observe que o botão Adicionar atenuação exibe Personalizado, indicando que você aplicou a Atenuação personalizada na Propriedade.

Como copiar Curvas de atenuação

Para copiar uma Curva de atenuação, faça o seguinte:

1. No Painel de atenuação, selecione a Curva de atenuação que deseja copiar e pressione Ctrl + C (Cmd + C no MAC).
2. Selecione a Propriedade na qual deseja colar a curva de atenuação copiada, e pressione Ctrl + V (Cmd + V no MAC).

Como aplicar a Atenuação à múltiplas propriedades

Agora você pode aplicar uma Atenuação predefinida ou personalizada à grupos de propriedade. O Editor de movimento organiza as propriedades de maneira hierárquica em grupos de propriedade e sub-propriedades. Você pode optar por aplicar a Atenuação a qualquer nível, ou seja: em propriedades individuais ou em grupos de propriedade, desde estejam inclusos nesta hierarquia.

Observe que, após aplicar a Atenuação a um Grupo de propriedade, você pode editar as sub-propriedades individualmente. Isso também quer dizer que você pode aplicar uma Atenuação diferente (daquela usada no grupo) a uma sub-propriedade.

Para aplicar a Atenuação a múltiplas propriedades, faça o que se segue:

1. No Editor de movimento, selecione o Grupo de propriedade e clique no botão Adicionar atenuação para exibir o Painel de atenuação.
2. No Painel de atenuação, selecione uma Atenuação predefinida ou crie uma Atenuação personalizada. Clique em qualquer lugar ao redo do Painel de atenuação para aplicar a Atenuação selecionada ao Grupo de propriedade.

Curva resultante

Quando uma curva de atenuação é aplicada a uma curva de propriedade, uma sobreposição visual chamada Curva resultante é exibida na grade. A curva resultante é uma representação exata do efeito da Atenuação aplicada a uma Curva de propriedade. Indica a animação final do objeto interpolado. A curva resultante  permite compreender o efeito que você visualiza no Palco ao testar uma animação.

Como controlar a exibição do Editor de movimento

No Editor de movimento, você pode controlar que curvas de propriedade serão editadas, e o tamanho da exibição de cada propriedade de curva. As curvas de propriedade exibidas em um tamanho grande são mais fáceis de editar.

• O novo Editor de movimento exibe apenas as propriedades que foram aplicadas a uma interpolação.
• É possível usar a alternância de ajuste da visualização () para ajustar o Editor de movimento à largura da linha do tempo.
• É possível usar o ajuste do tamanho do Editor de movimento e optar por exibir menos () ou mais quadros () no uso dos controles de Zoom da linha do tempo. Também é possível usar o controle deslizante para definir uma visualização apropriada do Editor de movimento.
• O Editor de movimento também possui uma alternância de zoom vertical. É possível usar o Zoom vertical para exibir uma faixa adequada de valores de propriedade no Editor de movimento. A aplicação de zoom também permite fazer edições direcionadas e mais refinadas em uma Curva de propriedade.
• As propriedades aparecem expandidas, por padrão, no painel esquerdo do Editor de movimento. Contudo, clicar no nome de uma propriedade recolherá a lista de busca detalhada.

Atalhos de teclado

Clique duas vezes - em uma curva de propriedade para adicionar um Ponto de ancoragem.

Alt+Arrastar - um ponto de ancoragem para ativar os Pontos de controle.

Alt+Arrastar - para manipular um ponto de controle selecionado (edição unilateral).

Alt-clique - em um ponto de ancoragem para desativar pontos de controle (ponto do canto).

Shift+arrastar - para mover um ponto de ancoragem em direção linear.

Comando/Control + Clique - para excluir um ponto de ancoragem.

Teclas de seta para cima/para baixo - para mover verticalmente um ponto de ancoragem selecionado.

Comando/Control + C/V - para copiar/colar uma curva selecionada.

Comando/Control + R - para reverter uma curva selecionada.

Comando/Control + Rolar - para aumentar/diminuir o zoom.