Share
Per andare avanti con il nostro recente tutorial sul flusso di lavoro dello sviluppo di script, andremo oltre i concetti di base e le buone pratiche necessarie per iniziare a scrivere gli script di After Effects. Andremo oltre le solite azioni di After Effects come: creare un progetto, creare una composizione, creare un livello, creare forme, aggiungere effetti, cambiare valori ed espressioni, usare testo e caratteri, aggiungere fotogrammi chiave, usare funzioni, ecc..
Se stai cercando una soluzione rapida con uno script di After Effects, c'è un'eccellente raccolta su VideoHive. Oppure potresti prendere in considerazione l'idea di presentare i tuoi script come autore!
Come indicato nel tutorial sull'installazione e sull'utilizzo del pacchetto di generazione di After Effects Sublime Text, gli script sono file che utilizzano il linguaggio Adobe ExtendScript. ExtendScript è una forma estesa di JavaScript utilizzata da diverse applicazioni Adobe come Photoshop, Illustratore, e InDesign. ExtendScript è un modo efficace per ottenere tutto ciò che vuoi in After Effects.
Gli script utilizzano il linguaggio Adobe ExtendScript, una forma estesa di JavaScript utilizzata da diverse applicazioni Adobe come Photoshop, Illustrator e InDesign
Questo tutorial tratterà i concetti di base e le buone pratiche necessarie per iniziare a scrivere gli script di After Effects.
Inizieremo usando il
nuovo progetto()
metodo del
App
oggetto e avvolgendolo tra parentesi graffe.
// Creazione del progetto app.newProject ();
Il
App
oggetto è la radice di quasi tutto come visto su questo schema:
Questo schema può essere trovato nella Guida agli script di Adobe After Effects CS6 come la maggior parte di ciò che spiegherò in questo tutorial.
Ora creiamo la nostra composizione usando il
App
oggetti secondari dell'oggetto
progetto
che contiene il progetto creato nella prima riga e il
elementi
oggetto secondario che consente di accedere alle cartelle e alle composizioni visualizzate nella finestra del progetto in After Effects.
Accentsconagua
// Creazione del progetto app.newProject (); // Creazione di comp app.project.items.addComp ("Demo", 1280, 720, 1, 10, 24); Scrivere un codice pulito e gestibile è molto importante. Non stiamo più scrivendo espressioni veloci e sporche. Dal momento che vogliamo che i nostri script siano facilmente scalabili, dobbiamo abbracciare le convenzioni della community di Javascript.
Quindi isoleremo i dati chiave in variabili e li nomineremo in base al loro contenuto. Inoltre, metteremo le condizioni nel caso in cui ci fosse già un progetto o una composizione nel nostro file After Effects.
// Creazione del progetto var currentProject = (app.project)? app.project: app.newProject (); // Creazione di comp var compSettings = cs = [1280, 720, 1, 10, 24]; var defaultCompName = "Demo"; var currentComp = (currentProject.activeItem)? currentProject.activeItem: currentProject.items.addComp (defaultCompName, cs [0], cs [1], cs [2], cs [3], cs [4]); currentComp.openInViewer ();
Il
var
parola chiave indica che la seguente variabile è una nuova variabile. Ecco perché, sulla linea 9, non usiamo il
var
parola chiave più perché vogliamo usare
currentComp
valore (che è il comp che abbiamo appena creato).
Ecco, riga per riga, cosa abbiamo fatto in inglese:
Riga 3: crea una nuova variabile
progetto attuale
che sarà uguale a
app.project
Se
app.project
non è indefinito e sarà altrimenti uguale a
app.newProject ()
.
Riga 6: crea nuove variabili
compSettings
e
cs
che è uguale a una nuova serie di valori.
Riga 7: crea una nuova variabile
defaultCompName
che contiene il nome che daremo al nostro comp.
currentComp
che sarà uguale al
activeItem
proprietà dei nostri
progetto attuale
oggetto. Se non è indefinito e sarà altrimenti uguale al risultato del
addComp
metodo del
elementi
sotto-oggetto di
progetto attuale
a chi invieremo una serie di argomenti contenenti:
Linea 9: Usa il
currentComp
metodo
openInViewer
che aprirà la timeline per questa composizione.
Sì, ci sono molti metodi e proprietà. Anche in questo caso, è necessario dare un'occhiata ad Adobe After Effects CS6 Scripting Guide per ulteriori informazioni sugli oggetti e sui relativi metodi e proprietà disponibili. La guida è davvero ben scritta e una rapida ricerca per Oggetto del progetto ti porterà immediatamente alle informazioni giuste.
var myVar = "Valore stringa";
var myVar = 2;
var myVar = array ("valore1", "valore2", 3); var myVar = ["valore1", "valore2", 3];
function myFunction (argomento) // Fai qualcosa
myObject.myProperty = "Valore"
myObject.myMethod (argomento)
Dal momento che durante l'esecuzione dello script si verificano molte operazioni, dovrai decidere cosa accadrà quando colpisci
un???? + Z
/
CTRL + Z
Facendolo così piuttosto facile, abbiamo solo avvolto il nostro codice tra il
beginUndoGroup ()
e
endUndoGroup ()
metodi del
App
oggetto. Questo metodo accetta un argomento che è il nome che verrà visualizzato in After Effects
Modifica> Cronologia
menu.
app.beginUndoGroup ("Demo Script"); // Creazione del progetto var currentProject = (app.project)? app.project: app.newProject (); // Creazione di comp var compSettings = cs = [1280, 720, 1, 10, 24]; var defaultCompName = "Demo" var currentComp = (currentProject.activeItem)? currentProject.activeItem: currentProject.items.addComp (defaultCompName, cs [0], cs [1], cs [2], cs [3], cs [4]); currentComp.openInViewer (); app.endUndoGroup (); Per creare il nostro livello di sfondo, useremo il
strati
sub-oggetto del nostro
currentComp
. Chiama il
addSolid ()
metodo e inviarlo questi argomenti:
app.beginUndoGroup ("Demo Script"); // Creazione del progetto var currentProject = (app.project)? app.project: app.newProject (); // Creazione di comp var compSettings = cs = [1280, 720, 1, 10, 24]; var defaultCompName = "Demo" var currentComp = (currentProject.activeItem)? currentProject.activeItem: currentProject.items.addComp (defaultCompName, cs [0], cs [1], cs [2], cs [3], cs [4]); currentComp.openInViewer (); // Creazione del livello di sfondo var backgroundLayer = currentComp.layers.addSolid ([93, 5, 2], "Background", cs [0], cs [1], cs [2]); app.endUndoGroup (); Il modo migliore per creare la nostra croce centrata è usando l'effetto Grid sul nostro livello di sfondo. Per farlo, useremo il nostro
backgroundLayer
variabile a cui si riferisce
currentComp.layers.byName ( "backgroundLayer")
e useremo il suo
effetti
proprietà.
// Aggiunta dell'effetto griglia backgroundLayer.Effects.addProperty ("Grid"); backgroundLayer.property ( "Effetti") di proprietà ( "griglia") immobili ( "ancora") setValue ([0,0])...; proprietà background ("Angolo"). backgroundLayer.property ( "Effetti") di proprietà ( "griglia") immobili ( "Colore") setValue ([0,0,0])...; backgroundLayer.property ("Effects"). proprietà ("Grid"). proprietà ("Metodo di fusione"). setValue (2); Ci sono alcune cose che dovresti notare qui. Prima il
proprietà()
il metodo è concatenabile, il che significa che è possibile chiamarlo più volte per raggiungere la proprietà secondaria che si desidera ottenere.
backgroundLayer.property ( "opacità")
: L'opacità di Layer.
backgroundLayer.property ( "Effetti"). La struttura ( "griglia"). La struttura ( "Opacità")
: L'opacità dell'effetto griglia.
Secondo, usiamo il metodo
valore impostato()
quando vogliamo impostare un valore ma non quando vogliamo impostare un'espressione.
Per aggiungere l'effetto wipe, creeremo un nuovo livello e useremo l'effetto Radial Wipe.
// Creazione del layer wipe var wipeLayer = currentComp.layers.addSolid ([0.1, 0.1, 0.1], "Wipe", cs [0], cs [1], cs [2]); wipeLayer.Effects.addProperty ("Radial Wipe"); wipeLayer.property ("Effects"). proprietà ("Radial Wipe"). proprietà ("Wipe"). setValue (2); // In senso antiorario wipeLayer.property ("Opacity"). SetValue (50); // Impostazione wipe transizione animazione wipeLayer.property ("Effetti"). Proprietà ("Radial Wipe"). Proprietà ("Completamento transizione"). SetValueAtTime (0, 100); wipeLayer.property ("Effetti"). proprietà ("Radial Wipe"). proprietà ("Completamento della transizione"). setValueAtTime (1, 0); wipeLayer.property ("Effects"). proprietà ("Radial Wipe"). proprietà ("Transition Completion"). expression = "loopOut ('Cycle')"; Abbiamo usato il metodo
setValueAtTime ()
per impostare i fotogrammi chiave e a
loopOut ( "Cycle")
fare il ciclo di animazione (ha senso, giusto?).
Giocare con il testo è un po 'diverso dal momento che devi modificare direttamente le proprietà del valore del testo sorgente.
// Aggiunta del livello di testo var textLayer = currentComp.layers.addText ("Countdown"); var textProperty = textLayer.property ("Testo sorgente"); var textPropertyValue = textProperty.value; // Modifica delle impostazioni del testo di origine textPropertyValue.resetCharStyle (); textPropertyValue.fontSize = 200; textPropertyValue.fillColor = [0, 0, 0]; textPropertyValue.justification = ParagraphJustification.CENTER_JUSTIFY; textProperty.setValue (textPropertyValue); // Aggiunta di espressioni al testo del testo di origineProperty.expression = "Math.floor (10-time)"; // Regolazione del punto di ancoraggio del livello di testo var textLayerHeight = textLayer.sourceRectAtTime (0, false); textLayer.property ("Punto di ancoraggio"). setValue ([0, textLayerHeight.height / 2 * -1]); Abbiamo cambiato le nostre proprietà del valore del testo e utilizzate
valore impostato()
per inviarlo nuovamente al nostro livello di testo. Inoltre, abbiamo usato un'espressione semplice per fare il nostro conto alla rovescia.
Math.floor ()
è una funzione Javascript che rimuoverà la parte decimale di un numero. Successivamente, centriamo il punto di ancoraggio usando il
sourceRectAtTime ()
metodo.
Per aggiungere le ellissi useremo il
addShape ()
metodo e dargli un gruppo vettoriale e una forma vettoriale. Faremo anche una piccola funzione per evitare la ripetizione del codice.
// Aggiunta di un livello forma per le cerchie var shapeLayer = currentComp.layers.addShape (); // Aggiunta del gruppo forme cerchio var shapeGroup = shapeLayer.property ("Contenuto"). AddProperty ("ADBE Vector Group"); // Aggiunta di forme circolari createEllipse (shapeGroup, 200); createEllipse (shapeGroup, 400); // Aggiunta di tratti neri alle forme var stroke = shapeGroup.property ("Contents") .addProperty ("ADBE Vector Graphic - Stroke") .property ("Color"). SetValue ([0, 0, 0]); function createEllipse (shapeGroup, size) var ellipse = shapeGroup.property ("Contenuto"). addProperty ("ADBE Vector Shape - Ellipse"); var ellipseSize = ellipse.property ("Size"). setValue ([size, size]); La linea 5 è davvero importante dal momento che non sarai in grado di trovare il
Contenuto
proprietà in né la documentazione né nell'interfaccia di After Effects per il momento, grazie a Dan Ebbert per il suo aiuto (http://forums.creativecow.net/thread/227/22280).
Abbiamo usato una piccola funzione personalizzata invece di duplicare la creazione dell'ellisse. Puoi usare le funzioni come desideri.
Regola pratica di base: se stai copiando delle righe di codice, considera di usare una funzione.
Per il resto abbiamo solo modificato le proprietà della forma. Si consiglia di fare riferimento ad Adobe After Effects CS6 Scripting Guide per vederli elencati.
Potresti aver notato il
tratto var
la linea sembra un po 'diversa da quella che abbiamo già scritto. Javascript supporta il concatenamento su più linee. Il risultato sarà lo stesso e non c'è un modo buono o cattivo, è una scelta di stile di codifica personale che potresti o non vorresti adottare.
Le possibilità di scripting sono infinite e possono creare uno strumento davvero potente una volta padroneggiato. Ecco qualche altra documentazione su scripting e Javascript:
