Post Pic

Μασκες στο Flash

Στο Flash υπάρχει η δυνατότητα δημιουργίας εφέ με την βοήθεια των επιπέδων, layers. Είδαμε σε προηγούμενο άρθρο, για παράδειγμα, πως μπορούμε να δημιουργούμε κίνηση με χρήση του guide layer. Σε αυτό το άρθρο θα δούμε τον τρόπο δημιουργίας μάσκας πάλι με χρήση των επιπέδων όπως επίσης και εφαρμογή κίνησης στην μάσκα.

Εισαγωγή

Στο εφέ της μάσκας χρησιμοποιούμε ένα σχήμα, σε ένα επίπεδο, μέσα από το οποίο μπορούμε να δούμε ένα άλλο σχήμα το οποίο βρίσκεται ακριβώς κάτω από το επίπεδο της μάσκας, σε ένα άλλο επίπεδο.

Στο παράδειγμά μας, θα χρησιμοποιήσουμε ένα τοπίο και κιάλια μέσα από τα οποία θα βλέπουμε τμήματα του τοπίου. Τα τμήματα αυτά θα είναι σχήματα-κύκλοι στο επίπεδο που θα χρησιμοποιηθεί ως μάσκα. Για τον λόγο αυτό μπορείτε να χρησιμοποιήσετε το αρχείο mask.fla.

Δημιουργία επιπέδου μάσκας

Στο αρχείο mask.fla υπάρχουν έτοιμα τα αντικείμενα του τοπίου και της μάσκας στα αντίστοιχα επίπεδα. Αυτό που χρειαζόμαστε είναι το επίπεδο της μάσκας. Ξεκινάμε φτιάχνοντας ένα νέο επίπεδο το οποίο ονομάζουμε mask και το οποίο τοποθετούμε πάνω από το επίπεδο photo.

Εικόνα 1 – Το επίπεδο της μάσκας

Εικόνα1

Κύκλοι στην μάσκα

Για λόγους ασφαλείας, καλό είναι να κλειδώσουμε τα επίπεδα photo και binoculars έτσι ώστε να μην πειράξουμε κατά λάθος τα αντικείμενα που βρίσκονται εκεί.

Στην συνέχεια, επιλέγουμε το καρέ κλειδί του επιπέδου της μάσκας και φτιάχνουμε 2 κύκλους με μέγεθος 120 pixels, λίγο μεγαλύτερο μέγεθος από το άνοιγμα των κιαλιών και τους τοποθετούμε στο άνοιγμα τους. Ο σκοπός είναι οι κύκλοι αυτοί να λειτουργήσουν ως μάσκα μέσα από τους οποίους θα φαίνεται η εικόνα.

Εικόνα 2 – Οι κύκλοι στο επίπεδο της μάσκας

Εικόνα2

Αλλαγή ιδιοτήτων των επιπέδων

Για να αλλάξουμε την ιδιότητα του επιπέδου mask σε μάσκα, κάνουμε δεξί κλικ στο επίπεδο της μάσκας και επιλέγουμε mask. Με την ενέργεια αυτή, το σχήμα του επιπέδου mask λειτουργεί ως μάσκα για το σχήμα το οποίο είναι στο αμέσως από κάτω επίπεδο δηλαδή το photo.

Εικόνα 3 – Αλλαγή της ιδιότητας του επιπέδου

Εικόνα3

Εικόνα 4 – Το επίπεδο mask ως μάσκα και το photo ως masked επίπεδο

Εικόνα4

Για να δούμε το εφέ μπορούμε είτε να τρέξουμε την ταινία επιλέγοντας από το μενού Control > Test Movie ή είτε να κλειδώσουμε τα δύο αυτά επίπεδα.

Εικόνα 5 – Το εφέ της μάσκας

Εικόνα5

Όπως μπορείτε να καταλάβετε, τα κιάλια παίζουν διακοσμητικό ρόλο αφού δεν ενεργούν στο εφέ αυτό.

Κίνηση

Στην συνέχεια θα δώσουμε κίνηση στα κιάλια και στους κύκλους της μάσκας. Επειδή οι κύκλοι είναι σχήματα, πρέπει να μετατραπούν σε σύμβολα προκειμένου να προσδώσουμε σε αυτούς κίνηση. Για να το κάνουμε αυτό, τους επιλέγουμε και από το μενού Modify επιλέγουμε Convert to Symbol. Επιλέγουμε Movie Clip αποδεχόμαστε το όνομα που μας δίνει το Flash και πατάμε ΟΚ.

Εικόνα 6 – Τα σχήματα της μάσκας ως σύμβολο

Εικόνα6

Η κίνηση που θέλουμε να δώσουμε είναι στο πάνω μέρος της εικόνας, από αριστερά προς δεξιά και το αντίθετο. Για να γίνει αυτό, επιλέγουμε τα αντικείμενα της μάσκας και των κιαλιών και τα μετακινούμε πάνω αριστερά στο σκηνικό. Προκειμένου να τα επιλέξουμε κλειδώνουμε το επίπεδο photo και επιλέγουμε όλα τα υπόλοιπα.

Για τις λεπτομέρειες όσον αφορά την κίνηση, έχει γίνει μνεία σε προηγούμενο άρθρο στο οποίο μπορείτε να ανατρέξετε.

Η κίνηση που θα δώσουμε θέλουμε να είναι συνεχής, για τον σκοπό αυτόν το πρώτο και το τελευταίο καρέ κλειδί της κίνηση μας πρέπει να είναι ίδιο. Για να το κάνουμε αυτό, επιλέγουμε όλα τα καρέ κλειδιά της 1ης θέσης, κάνουμε δεξί κλικ, επιλέγουμε copy frames επιλέγουμε τις θέσεις στην θέση 30 της λωρίδας χρόνου και με δεξί κλικ επιλέγουμε paste frames.

Εικόνα 7 – Αντιγραφή καρέ κλειδιών

Εικόνα7

Για να δώσουμε την κίνηση κάπου ενδιάμεσα, χρειαζόμαστε καρέ κλειδιά σε μια ενδιάμεση θέση, έστω στην θέση 15. Επιλέγουμε τα καρέ των επιπέδων mask και binoculars και με δεξί κλικ επιλέγω Convert to Keyframes. Με τον τρόπο αυτόν μπορούμε να μετακινήσουμε τα αντικείμενα σε άλλη θέση.

Εικόνα 8 – Θέση αντικειμένων στην θέση 15 της λωρίδας χρόνου

Εικόνα8

Τελευταία ενέργεια είναι να θέσουμε τα ενδιάμεσα καρέ ανάμεσα στα καρέ κλειδιά ως tween. Για να γίνει αυτό, επιλέγουμε ένα οποιοδήποτε ενδιάμεσο καρέ και από την παλέτα Properties και το μενού Tween επιλέγουμε Motion.

Εικόνα 9 – Εφαρμογή Motion Tween

Εικόνα9

Επαναλαμβάνουμε την ίδια διαδικασία και για τις υπόλοιπες ενδιάμεσες θέσεις και το αποτέλεσμα φαίνεται στην εικόνα 10.

Εικόνα 10 – Motion tween και στις υπόλοιπες θέσεις

Εικόνα10

Τέλος, για να δούμε την κίνηση στο Flash Player επιλέγουμε από το μενού Control > Test Movie.

Τελικό Αποτέλεσμα



Μπορείτε να κατεβάσετε τα αρχεία του βοηθήματος απο εδώ.

membersdownload1

Λογισμικό που χρησιμοποιήθηκε

Adobe Flash CS3

Trackbacks - Pingbacks

Αφήστε ένα σχόλιο

* Το όνομα σας, το Email, και το σχόλιο είναι απαιτούμενα

Γραφτείτε στις Email Ενημερώσεις

Εισάγετε το email σας:

Powered by FeedBurner

Log In

Register

Lost your Password?

Tag Cloud

Οι Φίλοι μας στο Twitter

lennondtps
FORADA
papaki
gegenos
jsclavos
tophostGR
gkapraras
wdfgr
nfountas
zouri9
Th3Ag3nt
ThodorisV
thevoyager
techfansGR
wp2blog
St0iK
andreas_m68
herath72
Dimitraakis
silve992
kymagr
papano
amorphis_
g_argyrakis
gstam78
nikos171984
gkatsampirhs
GamesHellasGR
kalliophhhh
dimsim7
giorgioret
Zoitsa_2010
ultrathunder
Weird_AL
fotisk
payne4life
splusgr
Chrysanthospro
Serderides
LewisHowes
bartvii
hambos227
ideodoxeio
BeBestT
gamosgamos
Φίλοι: 271 Μας ακολουθούν: 221

To GreekTuts Στο Διαδύκτιο

Bookmark & Share

Γίνε Συνδρομητής Στο GreekTuts


Κερδίστε πρόσβαση σε επιπλέον υλικό και άρθρα, αλλά και πολλές άλλες παροχές και προσφορές αγοράζοντας μία απο τις συνδρομές που σας προσφέρει το GreekTuts.

Γράψτε Για Το GreekTuts


Θέλετε και εσείς να γράψετε άρθρα για το GreekTuts; Διαβάστε περισσότερα εδώ. Οποιοσδήποτε μπορεί να στείλει, γι'αυτό αδράξτε την ευκαιρία και στείλτε μας και εσείς.