Scopri come utilizzare la funzione videocamera di Animate CC.

La funzione Videocamera di Animate CC simula una videocamera reale. Precedentemente, gli esperti di animazione dovevano ricorrere a estensioni di terze parti (più o meno di qualità e più o meno compatibili) oppure dovevano modificare le animazioni per simulare lo spostamento di una videocamera. Gli animatori possono utilizzare le funzioni seguenti integrali per ogni pellicola di movimento.

  • Panning con il soggetto del fotogramma
  • Ingrandimento dell’oggetto di interesse per creare un effetto particolare
  • Riduzione di un fotogramma per offrire all’utente un quadro d’insieme
  • Modifica del punto focale per portare l’attenzione dell’utente da uno soggetto a un altro
  • Rotazione della videocamera
  • Utilizzo di filtri o tinte per applicare effetti di colore a una scena 

Quando impostate un’inquadratura per la composizione, considerate i livelli come se fossero il mirino di una videocamera. Su un livello videocamera potete aggiungere anche interpolazioni o fotogrammi chiave.

Lo strumento videocamera è disponibile per tutti i tipi di documento incorporati in Animate CC - HTML Canvas, WebGL e Actionscript.

Attivazione o disattivazione della videocamera

Per abilitare lo strumento Videocamera, usate una delle opzioni seguenti:

  • Fate clic sull'icona della videocamera nel pannello Strumenti.
  • Fate clic sul pulsante Aggiungi/Rimuovi videocamera nella linea temporale.

Una volta attivata una videocamera, viene visualizzato un bordo dello stage nello stesso colore del livello della videocamera.

Videocamera
Area di lavoro videocamera

A. Contorno stage B. Icona videocamera C. Proprietà videocamera D. Effetti colore videocamera E. Strumento videocamera F. Icona videocamera G. Livello videocamera 

Lo stage ora si comporta come una videocamera per il documento. Al pannello Linea temporale viene aggiunto un nuovo livello videocamera con l'oggetto videocamera. Quando selezionate lo strumento videocamera, l'icona della videocamera è abilitata nella finestra di ispezione proprietà.

Quando la videocamera è abilitata:

  • Il documento corrente è posizionato in modalità videocamera.
  • Lo stage si trasforma in una videocamera.
  • Il bordo della videocamera è visibile nel limite dello stage.
  • Il livello della videocamera è selezionato.  

Zoom, rotazione o panning della videocamera

Zoom della videocamera

  1. Utilizzate i controlli di zoom disponibili nella schermata per eseguire uno zoom sull’oggetto oppure impostate valori di zoom specifici nel pannello Proprietà della videocamera.

    zoom_rotate
    Zoom e rotazione

  2. Per zoomare nella scena, modificate i valori di zoom o selezionate la barra di scorrimento nella parte inferiore dello stage.

  3. Per ingrandire il contenuto, spostate il cursore verso il lato + e spostatelo verso il lato - per ridurre lo zoom.

  4. Per consentire un livello infinito di valori di zoom su ogni lato, rilasciate il cursore così che torni al centro. 

Rotazione della videocamera

  1. Utilizzate i controlli di zoom disponibili nella schermata per ruotare l'oggetto oppure impostate i valori di rotazione nel pannello Proprietà della videocamera.

  2. Per specificare l'effetto di rotazione su ciascun livello, modificate i valori di rotazione o utilizzare i cursori di rotazione per manipolare la rotazione.

  3. Per consentire un livello infinito di valori di rotazione, rilasciate il cursore così che torni alla posizione di riposo. Il numero al centro del controllo indica i gradi di rotazione attualmente applicati.

Eseguire il panning della videocamera

  1. Fate clic sul riquadro di delimitazione e trascinate su un punto qualsiasi nel livello della videocamera sullo stage.

  2. Per eseguire il panning dell'oggetto selezionato, scorrete verso l'alto o il basso o utilizzare il tasto Maiusc per eseguire il panning in orizzontale o in verticale, senza alcuna inclinazione.

  3. Quando lo strumento videocamera è attivo, ogni azione di trascinamento è un’operazione di panning entro il bordo della videocamera.

Utilizzo dei controlli per il panning della videocamera

Potete usare le coordinate della videocamera X e Y in Proprietà videocamera nella finestra di ispezione Proprietà della videocamera per spostare la videocamera con precisione. 
Controlli per il panning della videocamera
Controlli per il panning della videocamera

Per effettuare il panning degli oggetti in orizzontale, spostate il puntatore del mouse sul valore di coordinazione x e trascinate il cursore a destra o a sinistra. 

Per effettuare il panning degli oggetti in verticale, spostate il puntatore del mouse sul valore di coordinazione y e trascinate il cursore a destra o a sinistra.

Ripristinare le opzioni degli effetti della videocamera

Se desiderate tornare alle impostazioni originali, potete ripristinare le modifiche apportate con la videocamera agli effetti di panning, zoom, rotazione e colori. Per conservare i valori delle proprietà precedenti, fate clic sull'icona di ripristino accanto a ciascuna delle proprietà.

Proprietà videocamera
Proprietà videocamera

Applicazione della tinta a un livello videocamera

  1. Selezionate il pannello Videocamera > Proprietà. Per abilitare o disabilitare l'effetto della tinta, selezionate la casella di spunta Tinta.

    Effetti colore videocamera
    Effetti colore videocamera
  2. Modifica il valore di tinta (percentuale) e il colore tinta RGB per il fotogramma corrente.

    Nota:

    Questa funzione è supportata per i tipi di documento AS3 e WebGL. 

Regolazione dei filtri colore su un livello videocamera

  1. Nel pannello delle proprietà della videocamera, selezionate la casella di controllo Regola colore per abilitare o disabilitare l'effetto del filtro.

  2. Modificate i valori di Luminosità, Contrasto, Saturazione e Tonalità per il fotogramma corrente. L'intervallo accettabile per le opzioni Luminosità, Contrasto, Saturazione è compreso tra -100% e 100% e per la Tonalità è compreso tra -180° e 180°.

    Nota:

    Questa funzione è supportata solo per il tipo di documento AS3. 

Creare un effetto di parallasse con la videocamera e la profondità del livello

Gli sviluppatori e i designer di giochi desiderano creare esperienze di gioco immersive. Utilizzando i vari oggetti del gioco sui livelli di sfondo e di primo piano, potete controllare la velocità e la posizione di tali oggetti. Mantenendo l'inquadratura della videocamera su un punto focale costante, potete spostare gli oggetti a velocità diverse per creare un effetto tridimensionale. In Animate CC, durante la creazione di animazioni 2D potete ottenere questo effetto utilizzando la videocamera e la funzione per la profondità del livello. Potete creare un effetto di parallasse per gli oggetti, modificando la profondità dei livelli nel pannello Profondità livello. Per utilizzare la profondità del livello, fate clic su Finestra > Profondità livello.

Fate clic qui per ulteriori informazioni sulla profondità del livello. 

  1. Create più oggetti su livelli diversi in Animate.

  2. Aggiungete profondità diverse a ciascun livello.

  3. Aggiungete il livello videocamera facendo clic sullo strumento videocamera.

    camera-layer
    Livello delle videocamera nella profondità del livello

Con questo effetto potete visualizzare la profondità e la prospettiva degli oggetti.

  • Gli oggetti che sono più vicini alla videocamera si muovono in modo più rapido rispetto agli oggetti che sono lontani dalla videocamera.
  • Quando il livello delle videocamera è al valore 0, agli oggetti più vicini alla videocamera è associato un numero positivo inferiore, mentre a quelli più lontani è associato associato un numero positivo superiore. I valori dei livelli che si trovano dietro la videocamera corrispondono a un numero negativo. 

Video che illustra l'effetto di parallasse e la profondità z della videocamera

Video che illustra l'effetto di parallasse e la profondità z della videocamera
In questo video potete vedere l'effetto di parallasse seguito dallo zoom della videocamera.

Blocco di un livello con la videocamera

Gli animatori e i designer di giochi hanno l'esigenza di fissare alcuni oggetti dell'animazione alla visualizzazione della videocamera. Ad esempio, un pulsante di azione, un HUD (Heads Up Display) in un gioco che mostra l'indicatore temporale o una pistola. In tali casi occorre mantenere l'elemento bloccato allo spostamento della videocamera. La funzione Collega a videocamera di Animate consente di ottenere questo effetto.

Blocco di un livello con la videocamera
Blocco di un livello con la videocamera

Quando associate un livello alla videocamera, gli oggetti in tale livello vengono fissati alla videocamera e si spostano con movimento con la videocamera. Pertanto, nell'output sembra che non siano influenzati dai movimenti della videocamera.

Potete associare un livello a una videocamera facendo clic sul punto nella colonna dell'icona di associazione della videocamera. Se il livello è associato alla videocamera, accanto al nome del livello viene visualizzata un'icona rappresentativa.  

La figura che segue illustra il comportamento del livello prima e dopo la sua associazione alla videocamera: 

Figura che illustra un'animazione quando il livello non è associato a una videocamera:

Livello senza blocco della videocamera
Livello senza blocco della videocamera

Figura che illustra un'animazione quando il livello non è associato alla videocamera: 

Livello con blocco della videocamera
Livello con blocco della videocamera

Potete anche associare e dissociare tutti i livelli dalla videocamera, facendo clic sull'icona di associazione della videocamera nella linea temporale. 

Associare tutti i livelli alla videocamera
Figura che illustra tutti i livelli quando sono associati alla videocamera

Utilizzo della videocamera in fase di riproduzione

Potete inserire, accedere o gestire la videocamera in fase di riproduzione (runtime) mediante le API della videocamera per i tipi di documenti AS3, WebGL e HTML Canvas. L'elenco delle API di runtime della videocamera per i tipi di documenti AS3, WebGL e HTML Canvas è il seguente:

Tipo Classe  Esempio Descrizione
AS3 VirtualCamera

import fl.VirtualCamera;

var cameraObj = VirtualCamera.getCamera(root);

Ottiene l'oggetto della videocamera. Per ottenere o impostare le proprietà della videocamera in fase di riproduzione.
HTML Canvas VirtualCamera var cameraObj = AdobeAn.VirtualCamera.getCamera(exportRoot); Ottiene l'oggetto della videocamera. Assicuratevi di abilitare la videocamera durante la creazione del contenuto.
WebGL VirtualCamera var cameraObj = flwebgl.VirtualCamera.getCamera(stage.getPlayer()); Ottiene l'oggetto della videocamera. Assicuratevi di abilitare la videocamera durante la creazione del contenuto.

Nota:

Al tipo di documento AS3 si applicano tutti i metodi. Alcuni dei metodi non sono disponibili per i documenti di tipo WebGL e HTML Canvas. I metodi applicabili/non applicabili per WebGL e HTML Canvas sono indicati nelle ultime due colonne della tabella.

Metodi per la videocamera virtuale

S.No

Metodo

Prototipo

Esempio

Descrizione

HTML Canvas

WebGL

1

getPosition

getPosition(): Object

trace(cameraObj.getPosition().x, cameraObj.getPosition().y,
cameraObj.getPosition().z);
Restituisce l'oggetto con le proprietà x, y, z che specificano la posizione corrente della videocamera.

2

setPosition

setPosition(posX: Number, posY: Number, posZ: Number = 0): void

cameraObj.setPosition(100,100,100);

Sposta la videocamera nella posizione assoluta specificata dai parametri di input. Valore predefinito = 0.

3

moveBy

moveBy(tx: Number, ty: Number, tz: Number = 0): void

cameraObj.moveBy(100,100,100);

Sposta la videocamera in base alla posizione corrente di tx, ty o tz.
Nota: ‘tz' è significativa solo se la profondità del livello è abilitata. Valore predefinito = 0.


4

resetPosition

resetPosition(): void

cameraObj.resetPosition();

Ripristina la posizione originale della videocamera, ovvero (0,0,0).


5

getZoom

getZoom(): Number

trace(cameraObj.getZoom());

Restituisce il valore di zoom corrente della videocamera. L'impostazione predefinita è 100%.


6

setZoom

setZoom(zoom: Number): void

cameraObj.setZoom(120);

Effettua lo zoom della videocamera al valore assoluto specificato dal parametro di input in percentuale.


7

zoomBy

zoomBy(zoom: Number): void

cameraObj.zoomBy(100);

Effettua lo zoom della videocamera in relazione al valore di zoom corrente (percentuale).


8

resetZoom

resetZoom(): void

cameraObj.resetZoom();

Ripristina lo zoom della videocamera al valore di zoom predefinito, ovvero 100%.


9

getRotation

getRotation(): Number

trace(cameraObj.getRotation());

Restituisce l'angolo corrente della videocamera.  

10

setRotation

setRotation(angle: Number): void

cameraObj.setRotation(45);

Ruota la videocamera dell’angolo assoluto specificato dai parametri di input.

11

rotateBy

rotateBy(angle: Number): void

cameraObj.rotateBy(60);

Ruota la videocamera in relazione all’angolo corrente specificato dai parametri di input.

12

resetRotation

resetRotation(): void

cameraObj.resetRotation();

Ripristina l’angolo della videocamera su zero.

13

setTint

setTint(tintColor: uint, tintPercent: Number): void

cameraObj.setTint(0x56FFFF, 68);

Imposta la tinta della videocamera mediante tint color(RGB) e tint percent (percentuale di tinta).

No

14

setTintRGB

setTintRGB(red: uint, green: uint, blue: uint, tintPercent: Number): void

cameraObj.setTintRGB(0xff, 0, 0, 50);

Imposta la tinta della videocamera utilizzando i valori di colore scomposti R, G, B e tintPercent (percentuale di tinta).

No

15

getTint()

getTint(): Object

var tint=cameraObj.getTint();
trace("color:",tint.color,
"percentage:",tint.percent);

Restituisce l'oggetto con due proprietà: “percentuale” e “colore”.

No

16

getTintRGB

getTintRGB(): Object

var tint = cameraObj.getTintRGB();
trace("tint color red:", tint.red,"green:",
tint.green," blue:",tint.blue,"tint percent: ",tint.percent);

Restituisce l'oggetto con quattro proprietà: “percentuale”, “rosso”, “verde” e “blu”.

No

17

resetTint

resetTint()

cameraObj.resetTint();

Rimuove la tinta della videocamera.

No

18

setColorFilter

setColorFilter(brightness: Number, contrast: Number, saturation: Number, hue: Number): void

cameraObj.setColorFilter(100,-50,
50,-100);

Imposta il filtro colore della videocamera utilizzando i valori decomposti di (luminosità, contrasto, saturazione, tonalità).

No

No

19

resetColorFilter

resetColorFilter()

cameraObj.resetColorFilter();

Rimuove il filtro colore.

No

No

20

reset

reset()

cameraObj.reset();

Ripristina tutte le proprietà della videocamera alle impostazioni predefinite.

21

setZDepth

setZDepth(zDepth: Number): void

cameraObj.setZDepth(200);

Imposta il valore di profondità Z della videocamera.

No

22

getZDepth

getZDepth(): Number

trace(cameraObj.getZDepth());

Restituisce il valore di profondità Z corrente della videocamera.

No

23

pinCameraToObject

pinCameraToObject(object:DisplayObject, offsetX:Number=0, offsetY:Number=0, offsetZ=0)

cameraObj.pinCameraToObject
(getChildByName("InstanceName"), 200,50);

La videocamera continua a seguire l’oggetto fornito come parametro di input in fase di riproduzione. Se sono specificati i valori offsetX, offsetY e offsetZ, la videocamera segue l'oggetto (x+offsetX,y+offsetY, z+offsetZ).

24

setPinOffset

setPinOffset(offsetX:Number, offsetY:Number, offsetZ:Number)

cameraObj.setPinOffset(-60,0);

Modifica i valori offsetX e offsetY per bloccare la videocamera sull'oggetto. La videocamera segue l'oggetto sul punto (x+offsetX, y+offsetY, zDepth+z) in fase di riproduzione.

25

unpinCamera

unpinCamera()

cameraObj.unpinCamera();

Rimuove il blocco della videocamera da qualsiasi oggetto.

26

setCameraMask

setCameraMask(maskObj:DisplayObject)

cameraObj.setCameraMask(maskObj);

Imposta maskObj come una maschera sopra la videocamera.

No

No

27

removeCameraMask

removeCameraMask()

cameraObj.removeCameraMask();

Rimuove la maschera dalla videocamera.

No

No

Accedere alla videocamera come oggetto di clip filmato

Tipo Metodo Prototipo Esempio
AS3 getCameraAsMovieClip

getCameraAsMovieClip(container:DisplayObject):MovieClip

var cameraObj=fl.VirtualCamera.getCameraAsMovieClip(root);
HTML Canvas getCameraAsMovieClip
getCameraAsMovieClip(container:DisplayObject):MovieClip var cameraObj=AdobeAn.VirtualCamera.getCamera(exportRoot);
WebGL getCameraAsMovieClip
getCameraAsMovieClip(container:DisplayObject):MovieClip var cameraObj=flwebgl.VirtualCamera.getCameraAsMovieClip(this);

Mascherare gli oggetti in fase di riproduzione (per documenti AS3)

È possibile mascherare gli oggetti in fase di riproduzione utilizzando il seguente codice delle API per videocamera:

import fl.VirtualCamera;
fl.VirtualCamera.getCamera(root).setCameraMask(torch);

Di seguito è riportata una schermata di esempio dall’animazione, per una maschera ovale:

camera-mask

Creazione di animazioni videocamera interattive tramite la procedura guidata per il codice delle azioni

Il diagramma di flusso seguente illustra le varie fasi per la creazione di un’animazione mediante videocamera interattiva. In un documento HTML Canvas potete usare la procedura guidata per il codice delle azioni. 

using-runtime-updated-1

Il video di esempio riportato di seguito illustra l’utilizzo della videocamera interattiva. Osservate come potete cambiare l’inquadratura in fase di riproduzione, portandola sul paracadute, sul jet pack o sul paesaggio urbano a diversi intervalli.

Video che illustra l’utilizzo della videocamera in fase di riproduzione

Video che illustra l’utilizzo della videocamera in fase di riproduzione
Video di esempio che illustra l’utilizzo della videocamera in fase di riproduzione

Ritaglio dell’oggetto sullo stage

Per ritagliare il contenuto al di fuori dallo stage, fate clic sul pulsante Ritaglia il contenuto fuori dallo stage . Dalla vista videocamera e stage, potete visualizzare il contenuto all'interno dei bordi della videocamera.

Questo prodotto è concesso in licenza in base alla licenza di Attribuzione-Non commerciale-Condividi allo stesso modo 3.0 Unported di Creative Commons.  I post su Twitter™ e Facebook non sono coperti dai termini di Creative Commons.

Note legali   |   Informativa sulla privacy online