Share
In questo tutorial, ti mostrerò come imitare le foto create dalla fotocamera Lytro. Il risultato finale ti permetterà di creare le tue immagini dinamiche e interessanti da mostrare sul web, permettendo agli spettatori di modificare il punto focale! Non è necessaria alcuna telecamera speciale: puoi utilizzare qualsiasi videocamera che consenta la messa a fuoco manuale (che include la maggior parte delle fotocamere del telefono).
Diamo un'occhiata al risultato finale su cui lavoreremo:
Fai clic su una chitarra per concentrarti su di essa.
Prima di iniziare, assicurati di avere una fotocamera in grado di selezionare manualmente un punto di messa a fuoco. In questo tutorial non è possibile utilizzare il metodo di blocco della messa a fuoco per modificare i punti di messa a fuoco. Una DSLR sarebbe meglio quando si fa questo tutorial, ma una fotocamera compatta con controlli manuali decenti andrà bene! Assicurati anche di avere un treppiede robusto.
Innanzitutto, imposta la videocamera su un treppiede. Assicurati che sia sicuro e che non cada o non si muova in alcun modo perché non vogliamo che la composizione cambi affatto tra uno scatto e l'altro.
Assicurati che il tuo soggetto rimanga statico durante la ripresa delle immagini, altrimenti nel risultato finale, le tue immagini sembreranno muoversi, e non sarebbe affatto bello!
Per ottenere un'immagine veramente efficace, è necessario impostare la fotocamera su una modalità in cui è possibile controllare l'apertura. Ciò ti consentirà di impostare un'apertura ampia (numero f piccolo) e far sfocare lo sfondo (o il primo piano) sfocato. Ricorda, più basso è il numero f, maggiore è la sfocatura!
La modalità Priorità apertura (A / Av su Canon) è una modalità eccezionale che ti consente di impostare l'apertura e la fotocamera sceglierà tutte le altre impostazioni per te. Sebbene sia avvisato, questa modalità può produrre due immagini con esposizioni leggermente diverse, e ciascuna potrebbe avere un colore leggermente diverso, quindi fai attenzione!
La modalità manuale (M) sarebbe migliore perché è possibile comporre le impostazioni di esposizione e mantenere coerenti i tuoi scatti. Le impostazioni manuali del bilanciamento del bianco sono anche una buona idea per mantenere coerenti i colori delle immagini.
Per questo tutorial, consiglierei ovunque intorno a f1 - f5.6, a seconda della distanza dal soggetto e dalla fotocamera.
Ora con un'ampia apertura selezionata sulla tua fotocamera (numero f piccolo), sposta il tuo indicatore AF sul soggetto in primo piano utilizzando il pad direzionale sul retro della fotocamera. Lascia che la fotocamera si concentri e poi scatta. Senza muovere la fotocamera, selezionare un nuovo punto AF sullo sfondo, mettere a fuoco e quindi scattare come mostrato nella figura sopra.
Un consiglio utile se hai una DSLR in cui andare modalità di visualizzazione live. Qui puoi selezionare qualsiasi punto sullo schermo, consentendo una maggiore flessibilità nella scelta dei punti di messa a fuoco. Se si dispone di una fotocamera compatta, utilizzare il control pad per selezionare il punto di messa a fuoco.
Ora dovresti avere due immagini che sono esattamente le stesse, a parte il punto focale. Continua a scattare finché non sei soddisfatto della tua composizione e profondità di campo. Quindi trasferisci le foto sul tuo computer e inizia a utilizzare Flash!
Per prima cosa impostare una cartella di progetto opportunamente denominata. Mi piace sempre mantenere i progetti in cartelle con nomi chiari in modo da poterli trovare se ho bisogno di guardare indietro a quello che ho fatto in un secondo momento. Qui manterrai le tue immagini originali, le immagini ridimensionate e i tuoi file Flash / ActionScript.
Per rendere le immagini sicure, dobbiamo ridimensionarle. Apri il tuo editor di immagini preferito e ridimensiona le foto in base alle dimensioni appropriate che ritieni appropriate. Qui, li ho ridimensionati entrambi a 600x400px, ma puoi usare qualsiasi dimensione desideri e assicurarti che la casella 'vincoli proporzioni' sia spuntata.
Quindi, salva le immagini come JPEG di alta qualità. Questo è importante perché Flash comprimerà l'intero file in un secondo momento, quindi perdere la qualità dell'immagine in questa fase è inutile.
Avvia Flash e apri un nuovo documento ActionScript 3.0. Fai clic sul pulsante di modifica sotto la scheda delle proprietà e ridimensiona lo stage in base alle dimensioni delle immagini; Ho scelto 600x400px.
Quindi, crea due livelli sul tuo palco; nominare il livello inferiore? Foto ?, e il livello superiore? Pulsanti ?. Aggiungi un altro fotogramma chiave su? Foto? strato, ma assicurati sui? pulsanti? strato, basta aggiungere un altro frame. Guarda l'immagine qui sopra.
Successivamente, importa entrambe le tue foto nella libreria, quindi trascinali e rilascialo entrambi dalla cartella del progetto nel pannello della libreria. Ora assicurati di avere entrambe le tue foto su un fotogramma chiave diverso.
Il livello di foto è ora completo!
Ora, dobbiamo fare i pulsanti su cui gli utenti cliccheranno per cambiare il punto focale. Per fare questo, maschereremo le aree sfocate di entrambe le immagini, le riempiremo e le renderemo invisibili.
Innanzitutto, seleziona il primo fotogramma sui pulsanti? strato. Usa lo strumento penna e maschera la forma delle aree fuori fuoco e completa il percorso. Non è necessario essere troppo precisi qui; assicurati di avere la forma generale dell'oggetto.
Quindi, seleziona lo strumento secchiello e riempi i percorsi appena creati. Elimina il tratto nero attorno ai bordi se necessario.
Quindi, seleziona le forme e vai a Modifica> Converti in simbolo (F8). Assicurati che il tipo di simbolo sia un pulsante e chiama ciò che ti piace. Ho chiamato la mia forma "Guitar1".
Fai doppio clic sul tuo nuovo pulsante e poi entrerai nella modalità di isolamento del pulsante. Qui puoi modificare gli stati del pulsante.
In questo caso, vogliamo renderlo invisibile, quindi fai clic e trascina dallo stato 'SU' e rilascia lo stato 'HIT'.
Quindi torna alla timeline originale e la tua forma dovrebbe avere una maschera trasparente. Congratulazioni! Hai appena fatto un pulsante invisibile!
Il prossimo passo è nominare questo pulsante. Mentre è selezionato, sul pannello di destra, sotto la scheda delle proprietà, assegna un nome al pulsante 'btn_back'.
Quindi, fai clic sul prossimo fotogramma sui tuoi? Pulsanti? strato sulla seconda immagine, quindi l'altra parte dell'immagine è sfocata. Questo rende solo più chiaro vedere dove mascherare.
Ora fai esattamente la stessa cosa di prima:
Ora, dai il nome a questo nuovo pulsante, 'btn_fore'.
Ora dovresti avere due pulsanti trasparenti che si estendono su entrambe le immagini come mostrato. Possono sovrapporsi leggermente, ma questo non importa troppo. Il livello dei pulsanti è ora completo!
La parte finale è creare il codice che farà funzionare i pulsanti. Questo passaggio prevede l'uso di classi di documenti, quindi utilizza questo tutorial per aiutarti a capire se sei nuovo o se desideri semplicemente un aggiornamento.
Innanzitutto, individua la casella 'Classe' nel tuo file FLA sotto il pannello delle proprietà. Qui, scrivi Principale. Questo è ora il nome della classe del documento e sarà il nome del file ActionScript che verrà creato successivamente.
Successivamente, vai su File> Impostazioni ActionScript. È necessario deselezionare la casella che dice 'Dichiarare automaticamente le istanze di stage'. Ciò significa che devi ora dichiarare manualmente i due pulsanti nel codice, che è ciò che vogliamo. (La posizione di questa finestra di dialogo potrebbe essere diversa nelle versioni precedenti di Flash, quindi se non riesci a trovarla, utilizza un motore di ricerca.)
Successivamente è il momento di creare il file ActionScript in cui è contenuto tutto il codice. Fare clic su File> Nuovo> file ActionScript.
Ora salva questo come Main.as, e assicurarsi che sia tenuto all'interno della stessa directory del file FLA. Ora, i file FLA e ActionScript sono collegati!
Innanzitutto, utilizza questo codice come base:
package import flash.display.MovieClip; public class Main estende MovieClip public function Main (): void // Function // Class // Package
Ho incluso una dichiarazione di importazione per Un filmato per cominciare, ma aggiungeremo altre affermazioni mentre procediamo.
Per iniziare, devi dichiarare i tuoi 2 pulsanti come variabili. Questi vanno in mezzo la classe pubblica Main estende MovieClip e prima funzione pubblica Main ():
public var btn_back: SimpleButton; public var btn_fore: SimpleButton;
Per far capire a Flash cosa SimpleButton è, è necessario aggiungere questo con l'altra dichiarazione di importazione in alto:
import flash.display.SimpleButton;
Dopo averlo fatto, il tuo codice dovrebbe assomigliare a questo:
package import flash.display.MovieClip; import flash.display.SimpleButton; public class Main estende MovieClip public var btn_back: SimpleButton; public var btn_fore: SimpleButton; funzione pubblica Main (): void // Function // Class // Package
Il prossimo passo è assicurarsi che la clip si fermi sulla prima foto. Per fare ciò, aggiungi semplicemente a Stop() comando all'interno del funzione pubblica Main ()
funzione pubblica Main (): void stop (); //Funzione
Il prossimo passo è aggiungere i listener di eventi. Questi entrano funzione pubblica Main (), e sotto il Stop(); comando che hai appena aggiunto. Devi avere un listener di eventi per entrambi i pulsanti; btn_back e btn_fore, quindi prima crearne uno per il pulsante Indietro:
btn_back.addEventListener (MouseEvent.CLICK, onClickBackground);
Ora crea un altro listener di eventi per il pulsante successivo. Devi semplicemente cambiare il nome di entrambi i pulsanti e il nome della funzione:
btn_fore.addEventListener (MouseEvent.CLICK, onForeBackground);
Innanzitutto, sto facendo riferimento al nome del pulsante btn_back. Quindi aggiungo il listener di eventi via .addEventListener. Tra parentesi, MouseEvent.CLICK sta semplicemente dicendo di ascoltare per un clic sul pulsante. Alla fine diciamo che, quando si fa clic sul pulsante, dovrebbe chiamare onClickBackground () -- creeremo questa funzione in seguito.
Ora, poiché abbiamo usato gli eventi del mouse, abbiamo bisogno di mettere una dichiarazione di importazione in alto insieme alle altre istruzioni per far capire a Flash qual è. Aggiungi questa linea sotto le altre importazioni:
import flash.events.MouseEvent;
Il tuo codice dovrebbe ora apparire come questo:
package import flash.display.MovieClip; import flash.display.SimpleButton; import flash.events.MouseEvent; public class Main estende MovieClip public var btn_back: SimpleButton; public var btn_fore: SimpleButton; funzione pubblica Main (): void stop (); btn_back.addEventListener (MouseEvent.CLICK, onClickBackground); btn_fore.addEventListener (MouseEvent.CLICK, onClickForeground); // Funzione // Classe // Pacchetto
Infine, è necessario creare due funzioni pubbliche per dire ai pulsanti che abbiamo creato cosa fare. Aggiungi questi all'interno del la classe pubblica Main estende MovieClip, ma sotto il funzione pubblica Main (): void.
I nomi delle funzioni devono corrispondere ai nomi nei listener di eventi. Quindi in questo caso onClickBackground, e onClickForeground:
funzione pubblica onClickBackground (evt: MouseEvent): void gotoAndStop (2); public function onClickForeground (evt: MouseEvent): void gotoAndStop (1);
All'interno della funzione, dobbiamo dire a Flash quale frame andare quando viene cliccato il pulsante. Il metodo più semplice è quello di usare gotoAndStop (). Il numero tra parentesi indica il numero di fotogramma a cui Flash andrà. Basta aggiungere il numero 2 per il onClickBackground funzione e il numero 1 per il onClickForeground funzione.
Di seguito è riportato un esempio completo del codice per aiutarti a comprendere il codice ActionScript completo:
package import flash.display.MovieClip; import flash.display.SimpleButton; import flash.events.MouseEvent; public class Main estende MovieClip public var btn_back: SimpleButton; public var btn_fore: SimpleButton; funzione pubblica Main (): void stop (); btn_back.addEventListener (MouseEvent.CLICK, onClickBackground); btn_fore.addEventListener (MouseEvent.CLICK, onClickForeground); // Funzione public function onClickBackground (evt: MouseEvent): void gotoAndStop (2); public function onClickForeground (evt: MouseEvent): void gotoAndStop (1); // Class // Package
L'unica cosa che resta da fare ora è testare il film, quindi vai su Controllo> Prova filmato> Prova (o premi Ctrl + Invio). Dovrebbe funzionare perfettamente! Ora tutto ciò che resta da fare è pubblicarlo e condividerlo sul web!
Ora hai realizzato un'animazione fotografica in stile Lytro! Questo è solo un esempio di come utilizzare questa tecnica per imitare le immagini della fotocamera Lytro. Usa questa tecnica per creare composizioni ed effetti personali per il tuo portfolio, sito web o blog!
Per fare un ulteriore passo avanti, è possibile creare i propri effetti e transizioni tra i frame per dare al tuo progetto un tocco personale.
Grazie per la lettura, e spero che questo tutorial ti sia piaciuto. Fatemi sapere cosa ne pensate! Ora vediamo alcuni dei tuoi. Inserisci un collegamento nei commenti sottostanti!
Accentsconagua