Relações

5 min read

As relações são ligações orientadas pelo comportamento entre os itens. Em vez de manualmente keyframing cada movimento, você pode declarar relações como “esta lua orbita esse planeta” e PinePaper lida com a animação automaticamente.

Relations panel showing linked items
O painel Relações mostrando itens conectados por diferentes tipos de relações

Tipos de Relação Principais

Relação Designação das mercadorias Uso do Exemplo
órbitas Movimento circular em torno do alvo Lua em órbita de um planeta
a seguir Move-se para o alvo com suavização Rótulo após um caractere
anexado a Joga com o alvo (deslocamento fixo) Chapéu na cabeça de um personagem
mantém distância Mantém distância fixa do alvo Elétrons em torno de um núcleo
pontos at Gira para o alvo Seta apontando para o cursor
espelhos Posição dos espelhos através do eixo Efeito de reflexão
paralaxe Movimento baseado em profundidade Deslocamento de fundo
limites para Permanece dentro dos limites definidos Bola saltando em uma caixa

Relações de Animação

Relação Designação das mercadorias Uso do Exemplo
cresce de Escalas de zero a tamanho completo Itens que aparecem em sequência
cambaleado com Animação em grupo com cambaleante Título das letras que aparecem uma por uma
indica Pulso de realce temporário Chamar a atenção para um item
circunscritos Desenha a forma em torno do alvo Realçar um elemento chave
wave through Efeito de distorção da onda Ondular através de uma linha de itens
morphs to Animação de transformação da forma Transição de forma para outra
câmera sellows Ver as áreas a seguir ao alvo Câmera que rastreia um caractere
câmera animados Ampliação/pan da câmera de teclado Sequências de zoom cinematográficas

Relações de Animação Processual

Estas relações criam animação sem precisar de um item de destino:

Relação Designação das mercadorias Uso do Exemplo
driver by Propriedade segue outra propriedade Opacidade controlada por posição
balançar Movimento de ruído processual Jittery, movimento orgânico
tempo expressão Expressão matemática ao longo do tempo Oscilação da onda do seno

Adicionando Relações

Da UI

  1. Selecione o item source (aquele que se moverá)
  2. Abra a seção Relações no painel Propriedades
  3. Escolha um tipo de relação
  4. Selecione o item alvo (aquele a que se relacionar)
  5. Ajustar os parâmetros conforme necessário

Parâmetros de Relação

Cada tipo de relação tem parâmetros específicos:

órbitas:

Parâmetro Designação das mercadorias Padrão
raio Distância do alvo 100
velocidade Velocidade de rotação 0.5
direção clockwise ou counter-clockwise no sentido horário
fase Ângulo inicial (radianos) 0

a seguir:

Parâmetro Designação das mercadorias Padrão
deslocamento [x, y] deslocamento do alvo [0, 0]
suavização Alisamento do movimento (0-1) 0.1
atraso Seguir o atraso em segundos 0

mexer:

Parâmetro Designação das mercadorias Padrão
frequência Oscilações por segundo 2
amplitude Deslocamento máximo (px) 10
propriedade position, rotation, opacity, scale posição
sementes Valor das sementes reprodutíveis 0

tempo expressão:

Parâmetro Designação das mercadorias
propriedade Qual propriedade animar (x, y, rotation, opacity, scale)
expressão Expressão matemática usando t (tempo) e v (valor base)

Funções disponíveis: sin, cos, abs, floor, ceil, sqrt, pow, min, max, clamp, lerp, smoothstep

Item orbiting another item
A círculo pequeno orbitando um maior usando a relação "órbitas"

Relações em Tempo

As relações só podem ser activas durante uma janela de tempo específica:

Parâmetro Designação das mercadorias
startTime Quando a relação se ativa (segundos)
endTime Quando a relação desactiva (segundos)
remove automaticamente Remove automaticamente após o endTime

Isso permite que você crie sequências onde itens mudam de comportamento ao longo do tempo - por exemplo, um item orbita por 3 segundos, em seguida, segue por 2 segundos.

Animação da Câmera

A relação camera_animates cria sequências de zoom e pan cinematográficas:

  1. Adicione a relação camera_animates para criar movimentos de câmera com keyframed
  2. Defina níveis de zoom e posições centrais em momentos diferentes
  3. O viewport anima suavemente entre quadros de teclas

Isso é perfeito para apresentações, tutoriais e apresentações cinematográficas onde você deseja orientar a atenção do espectador.

Dicas

Composable: Várias relações podem ser aplicadas ao mesmo item. Eles se aplicam em sequência cada quadro, para que você possa combinar orbits com wiggle para o movimento orgânico complexo.

  1. Comece simples - Comece com follows ou attached_to antes de tentar configurações complexas
  2. Use time-scoping - Crie sequências dando relações diferentes janelas de tempo
  3. Combinar com quadros de chaves - Relações e animações de quadros de chaves podem funcionar em conjunto
  4. Preview frequentemente - Jogue a linha do tempo para ver como as relações interagem

Relacionados: Animações