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.
- Guida utente di Adobe Animate
- Introduzione ad Animate
- Animazione
- Concetti di base sulle animazioni in Animate
- Come utilizzare i fotogrammi e i fotogrammi chiave in Animate
- Animazione fotogramma per fotogramma in Animate
- Come lavorare con le animazioni interpolate classiche in Animate
- Strumento Pennello
- Guida di movimento
- Interpolazione di movimento e ActionScript 3.0
- Informazioni sull’animazione con interpolazione di movimento
- Animazioni con interpolazione di movimento
- Creazione di un’animazione con interpolazione di movimento
- Utilizzo dei fotogrammi chiave di proprietà
- Animare la posizione con un'interpolazione
- Come modificare le interpolazioni di movimento con l'Editor movimento
- Modifica del tracciato di movimento di un’animazione con interpolazione
- Manipolazione delle interpolazioni di movimento
- Aggiunta di andamenti personalizzati
- Creazione e applicazione di preimpostazioni di movimento
- Impostazione delle estensioni di interpolazione per l’animazione
- Operazioni con le interpolazioni di movimento salvate come file XML
- Interpolazioni di movimento e classiche a confronto
- Interpolazione di forme
- Utilizzare lo strumento di animazione Osso in Animate
- Utilizzare il rigging dei personaggi in Animate
- Come utilizzare i livelli maschera in Adobe Animate
- Come utilizzare le scene in Animate
- Interattività
- Come creare pulsanti con Animate
- Convertire progetti Animate in altri formati di tipi di documenti
- Creare e pubblicare documenti HTML5 Canvas in Animate
- Aggiungere interattività con gli snippet di codice in Animate
- Creazione di componenti HTML5 personalizzati
- Utilizzo dei componenti in HTML5 Canvas
- Creazione di componenti personalizzati: esempi
- Snippet di codice per componenti personalizzati
- Best practice - Pubblicità con Animate
- Creazione e pubblicazione di contenuti in realtà virtuale
- Area di lavoro e flusso di lavoro
- Creazione e gestione dei pennelli artistici
- Utilizzo di Google Fonts nei documenti HTML5 Canvas
- Utilizzo di Creative Cloud Libraries con Adobe Animate
- Utilizzare il pannello Strumenti e Stage per Animate
- Flusso di lavoro e area di lavoro di Animate
- Utilizzo di font Web nei documenti HTML5 Canvas
- Linee temporali e ActionScript
- Operazioni con più linee temporali
- Impostare le preferenze
- Uso dei pannelli di creazione di Animate
- Creare livelli della linea temporale con Animate
- Esportare animazioni per dispositivi mobili e motori grafici
- Spostamento e copia degli oggetti
- Modelli
- Trova e sostituisci in Animate
- Annulla, Ripeti e il pannello Cronologia
- Scelte rapide da tastiera
- Come utilizzare la linea temporale in Animate
- Creazione di estensioni HTML
- Opzioni di ottimizzazione per immagini e GIF animati
- Impostazioni per l’esportazione di immagini e file GIF
- Pannello Risorse in Animate
- File multimediali e video
- Trasformazione e combinazione di oggetti grafici in Animate
- Creazione e utilizzo di istanze di simboli in Animate
- Ricalco immagine
- Come utilizzare l’audio in Adobe Animate
- Esportazione di file SVG
- Creare file video da utilizzare in Animate
- Come aggiungere un video in Animate
- Disegnare e creare oggetti con Animate
- Rimodellare linee e forme
- Tratti, riempimenti e gradienti con Animate CC
- Utilizzo di Adobe Premiere Pro e After Effects
- Pannelli per il colore in Animate CC
- Apertura di file Flash CS6 con Animate
- Utilizzare il testo classico in Animate
- Inserimento di grafica in Animate
- Bitmap importate in Animate
- Grafica 3D
- Utilizzo dei simboli in Animate
- Disegnare linee e forme con Adobe Animate
- Utilizzare le librerie in Animate
- Esportazione di suoni
- Selezione degli oggetti in Animate CC
- Utilizzare i file AI di Illustrator in Animate
- Applicazione di metodi di fusione
- Disposizione degli oggetti
- Automazione delle operazioni con il menu Comandi
- Testo in più lingue
- Utilizzo della funzione Videocamera di Animate
- Filtri grafici
- Suono e ActionScript
- Preferenze di disegno
- Disegno con lo strumento Penna
- Piattaforme
- Convertire progetti Animate in altri formati di tipi di documenti
- Supporto piattaforme personalizzato
- Creare e pubblicare documenti HTML5 Canvas in Animate
- Creazione e pubblicazione di un documento WebGL
- Come creare pacchetti di applicazioni per AIR per iOS
- Pubblicazione di applicazioni AIR for Android
- Pubblicazione per Adobe AIR per desktop
- Impostazioni di pubblicazione ActionScript
- Procedure ottimali - Organizzazione del codice ActionScript in un’applicazione
- Come utilizzare ActionScript con Animate
- Accessibilità dell’area di lavoro di Animate
- Creazione e gestione di script
- Abilitazione del supporto per piattaforme personalizzate
- Panoramica di Supporto piattaforme personalizzate
- Operazioni con i plug-in di Supporto piattaforme personalizzate
- Debug di ActionScript 3.0
- Abilitazione del supporto per piattaforme personalizzate
- Esportazione e pubblicazione
- Come esportare i file da Animate CC
- Pubblicazione OAM
- Esportazione di file SVG
- Esportazione di elementi grafici e video con Animate
- Pubblicazione di documenti AS3
- Esportare animazioni per dispositivi mobili e motori grafici
- Esportazione di suoni
- Best practice - Suggerimenti per la creazione di contenuti per dispositivi mobili
- Best practice - Convenzioni per i contenuti video
- Best practice - Linee guida per la creazione di applicazioni SWF
- Best practice - Strutturazione dei file FLA
- Best practice per ottimizzare i file FLA per Animate
- Impostazioni di pubblicazione ActionScript
- Specificare le impostazioni di pubblicazione per Animate
- Esportazione di file proiettore
- Esportare immagini e GIF animati
- Modelli di pubblicazione HTML
- Utilizzo di Adobe Premiere Pro e After Effects
- Condividere e pubblicare rapidamente le animazioni
- Risoluzione dei problemi
Scopri come utilizzare la funzione videocamera di Animate.
La funzione Videocamera di Animate 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: 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.
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
-
-
Per zoomare nella scena, modificate i valori di zoom o selezionate la barra di scorrimento nella parte inferiore dello stage.
-
Per ingrandire il contenuto, spostate il cursore verso il lato + e spostatelo verso il lato - per ridurre lo zoom.
-
Per consentire un livello infinito di valori di zoom su ogni lato, rilasciate il cursore così che torni al centro.
Rotazione della videocamera
-
Utilizzate i controlli di zoom disponibili nella schermata per ruotare l'oggetto oppure impostate i valori di rotazione nel pannello Proprietà della videocamera.
-
Per specificare l'effetto di rotazione su ciascun livello, modificate i valori di rotazione o utilizzare i cursori di rotazione per manipolare la rotazione.
-
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
-
Fate clic sul riquadro di delimitazione e trascinate su un punto qualsiasi nel livello della videocamera sullo stage.
-
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.
-
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
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à.
Applicazione della tinta a un livello videocamera
-
Selezionate il pannello Videocamera > Proprietà. Per abilitare o disabilitare l'effetto della tinta, selezionate la casella di spunta Tinta.
-
Modifica il valore di tinta (percentuale) e il colore tinta RGB per il fotogramma corrente.
Questa funzione è supportata per i tipi di documento AS3 e WebGL.
Regolazione dei filtri colore su un livello videocamera
-
Nel pannello delle proprietà della videocamera, selezionate la casella di controllo Regola colore per abilitare o disabilitare l'effetto del filtro.
-
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°.
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, 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.
-
Create più oggetti su livelli diversi in Animate.
-
Aggiungete profondità diverse a ciascun livello.
-
Aggiungete il livello videocamera facendo clic sullo strumento videocamera.
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
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.
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:
Figura che illustra un'animazione quando il livello non è associato alla videocamera:
Potete anche associare e dissociare tutti i livelli dalla videocamera, facendo clic sull'icona di associazione della videocamera nella linea temporale.
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. |
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():Oggetto |
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. | Sì |
Sì |
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. | Sì |
Sì |
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. |
Sì |
Sì |
4 |
resetPosition |
resetPosition():void |
cameraObj.resetPosition(); |
Ripristina la posizione originale della videocamera, ovvero (0,0,0). |
Sì |
Sì |
5 |
getZoom |
getZoom(): Number |
trace(cameraObj.getZoom()); |
Restituisce il valore di zoom corrente della videocamera. L'impostazione predefinita è 100%. |
Sì |
Sì |
6 |
setZoom |
setZoom(zoom: Number): void |
cameraObj.setZoom(120); |
Effettua lo zoom della videocamera al valore assoluto specificato dal parametro di input in percentuale. |
Sì |
Sì |
7 |
zoomBy |
zoomBy(zoom: Number): void |
cameraObj.zoomBy(100); |
Effettua lo zoom della videocamera in relazione al valore di zoom corrente (percentuale). |
Sì |
Sì |
8 |
resetZoom |
resetZoom(): void |
cameraObj.resetZoom(); |
Ripristina lo zoom della videocamera al valore di zoom predefinito, ovvero 100%. |
Sì |
Sì |
9 |
getRotation |
getRotation(): Number |
trace(cameraObj.getRotation()); |
Restituisce l'angolo corrente della videocamera. |
Sì |
Sì |
10 |
setRotation |
setRotation(angle: Number): void |
cameraObj.setRotation(45); |
Ruota la videocamera dell’angolo assoluto specificato dai parametri di input. |
Sì |
Sì |
11 |
rotateBy |
rotateBy(angle: Number): void |
cameraObj.rotateBy(60); |
Ruota la videocamera in relazione all’angolo corrente specificato dai parametri di input. |
Sì |
Sì |
12 |
resetRotation |
resetRotation():void |
cameraObj.resetRotation(); |
Ripristina l’angolo della videocamera su zero. |
Sì |
Sì |
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 |
Sì |
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 |
Sì |
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 |
Sì |
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 |
Sì |
17 |
resetTint |
resetTint() |
cameraObj.resetTint(); |
Rimuove la tinta della videocamera. |
No |
Sì |
18 |
setColorFilter |
setColorFilter(brightness: Number, contrast: Number, saturation: Number, hue: Number): void |
cameraObj.setColorFilter(100,-50, |
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. |
Sì |
Sì |
21 |
setZDepth |
setZDepth(zDepth: Number): void |
cameraObj.setZDepth(200); |
Imposta il valore di profondità Z della videocamera. |
Sì |
No |
22 |
getZDepth |
getZDepth(): Number |
trace(cameraObj.getZDepth()); |
Restituisce il valore di profondità Z corrente della videocamera. |
Sì |
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). |
Sì |
Sì |
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. |
Sì |
Sì |
25 |
unpinCamera |
unpinCamera() |
cameraObj.unpinCamera(); |
Rimuove il blocco della videocamera da qualsiasi oggetto. |
Sì |
Sì |
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:
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.
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
Ritaglio dell’oggetto sullo stage
Adobe XD consente di impilare o sovrapporre contenuti su un’altra tavola da disegno per simulare effetti di scorrimento interattivi, ad esempio elenchi a discesa, tastiere a scorrimento o effetti per scatole luminose. Con le sovrapposizioni potete riutilizzare più volte una tavola da disegno senza duplicare il contenuto della sovrapposizione per ogni tavola.
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.