Skip to main content

Rig de controle com sliders

Sliders são a interface entre você e a expressão. Em vez de editar código toda vez, você gira um slider. É a diferença entre um projeto que você entrega e um que você tem que manter eternamente.

Expression Controls

O after tem um set de efeitos chamado Expression Controls que não renderizam nada. Só criam parâmetros animáveis para usar como entrada de expressões:

TipoO que é
Slider Controlnúmero contínuo
Angle Controlângulo com rotação visual
Color Controlseletor de cor
Point Controlposição 2D
Checkbox Controlverdadeiro/falso (0 ou 1)
Layer Controlreferência a outra layer

Aplique em um nulo chamado CONTROLS e use como hub central do rig.

Referenciando um slider

ctrl = thisComp.layer("CONTROLS");
velocidade = ctrl.effect("Velocidade")("Slider");
time * velocidade

Rig de rotação controlável

// no nulo "CONTROLS":
// Slider "Velocidade" (range: 0 a 10, padrão: 1)
// Checkbox "Ativo" (padrão: 1)
ctrl = thisComp.layer("CONTROLS");
vel = ctrl.effect("Velocidade")("Slider");
ativo = ctrl.effect("Ativo")("Checkbox");
if (ativo) {
time * 360 * vel
} else {
value
}

O checkbox liga/desliga a rotação. O slider controla a velocidade. Sem tocar na expressão depois de criada.

Rig de cor dinâmica

// no nulo "CONTROLS": Color Control "Cor Principal"
// em Fill Color de uma Shape Layer:
ctrl = thisComp.layer("CONTROLS");
ctrl.effect("Cor Principal")("Color")

Mude a cor no nulo e atualiza em todas as layers que referenciam esse controle.

Wiggle controlável

ctrl = thisComp.layer("CONTROLS");
freq = ctrl.effect("Wiggle Freq")("Slider");
amp = ctrl.effect("Wiggle Amp")("Slider");
ativo = ctrl.effect("Wiggle Ativo")("Checkbox");
if (ativo) {
wiggle(freq, amp)
} else {
value
}

Rig de visibilidade

// opacity controlada por checkbox
ctrl = thisComp.layer("CONTROLS");
visivel = ctrl.effect("Elemento Visível")("Checkbox");
visivel * 100
// checkbox 1 = 100% opacidade, checkbox 0 = 0% opacidade

Pick whip

Para casos simples, não precisa escrever a expressão manualmente. Use o pick whip (ícone de espiral ao lado da propriedade) e arraste até o slider no nulo. O after escreve a referência automaticamente.

O código gerado vai parecer:

thisComp.layer("CONTROLS").effect("Slider Control")("Slider")

Você pode editá-lo depois para adicionar lógica.