GIAÙO TRÌNH THIEÁT KEÁ WEB : PHAÀN LYÙ THUYEÁT - TÖÏ HOÏC MACROMEDIA FLASH 5.0 BAÈNG HÌNH AÛNH CHÖÔNG 9
CAÙCH TAÏO RA CAÙC AÛNH
CHUYEÅN ÑOÄNG ANIMATION
TOÅNG QUAN VEÀ CAÙCH TAÏO RA CAÙC ANIMATION
Baïn taïo ra caùc Animation baèng caùch thay ñoåi noäi dung cuûa frame lieân tieáp nhau. Baïn coù
theå taïo ñoái töôïng di chuyeån ngang qua vuøng Stage, thay ñoåi kích thöôùc, höôùng xoay, maøu saéc,
hình daïng vaø caùch laøm cho ñoái töôïng vaøo hay ra môø daàn (Fade In hay Fade Out). Nhöõng thay
ñoåi naøy coù theå xaûy ra ñoäc laäp nhau hoaëc keát hôïp vôùi nhöõng söï thay ñoåi khaùc. Ví duï, baïn coù theå
taïo cho ñoái töôïng xoay vaø khi noù di chuyeån vaøo ngang qua vuøng Stage môø daàn.
Coù hai caùch ñeå taïo ra moät ñoái töôïng Animation chuyeån ñoäng lieân tieáp trong Flash:
chuyeån ñoäng Animation theo frame-by-frame vaø Tweened Animation. Trong caùch chuyeån ñoäng
Animation theo frame-by-frame, baïn phaûi taïo ra aûnh trong moãi frame. Trong caùch chuyeån ñoäng
theo Tweened Animation, baïn coù theå taïo ra frame baét ñaàu vaø frame keát thuùc vaø cho pheùp Flash
taïo ra nhieàu frame trong khoaûng giöõa frame ñaàu vaø frame cuoái naøy. Flash thay ñoåi kích thöôùc,
höôùng xoay, maøu saéc hoaëc caùc thuoäc tính khaùc ngang nhau giöõa frame ñaàu vaø frame cuoái ñeå taïo
ra aûnh thay ñoåi chuyeån ñoäng veà hình daùng.
Caùch chuyeån ñoäng theo Tweened Animation laø moät caùch coù hieäu quaû ñeå taïo ra aûnh
chuyeån ñoäng vaø thay ñoåi lieân tuïc trong khi ñoù kích thöôùc file raát nhoû. Trong caùch chuyeån ñoäng
Tweened Animation naøy, Flash chæ löu laïi caùc giaù trò thay ñoåi giöõa caùc frame. Trong caùch
chuyeån ñoäng Animation theo frame-by-frame, Flash löu laïi caùc giaù trò cho moãi frame keát thuùc.
Ñeå bieát theâm caùch höôùng daãn taïo ra aûnh chuyeån ñoäng Animation naøy, baïn haõy tham
khaûo theâm taøi lieäu “GIAÙO TRÌNH THIEÁT KEÁ WEB : PHAÀN THÖÏC HAØNH - TÖÏ HOÏC MACROMEDIA FLASH 5.0
BAÈNG HÌNH AÛNH” cuøng taùc giaû.
Chuù yù : Ngoaøi ra baïn cuõng coù theå taïo aûnh chuyeån ñoäng Animation baèng caùch duøng Set Property
action. Baïn coù theå xem muïc ActionScript Help ñeå bieát theâm chi tieát.
CAÙCH TAÏO RA CAÙC KEYFRAME
Moät keyframe laø moät frame maø nôi ñoù baïn thay ñoåi quaù trình chuyeån ñoäng Animation.
Khi baïn taïo ra aûnh chuyeån ñoäng Animation theo caùch frame-by-frame, moãi frame laø moät
keyframe. Trong keyframe chuyeån ñoäng theo caùch Tweened Animation, baïn phaûi xaùc ñònh taïi
nhöõng ñieåm quan troïng trong quaù trình chuyeån ñoäng vaø cho pheùp Flash taïo ra noäi dung giöõa caùc
frame. Flash hieån thò caùc frame boå sung cuûa cheá ñoä Tweened Animation nhö caùc maøu xanh
nhaït, xanh ñaäm coù muõi teân veõ giöõa caùc keyframe. Flash seõ veõ laïi hình daùng cuûa ñoái töôïng trong
moãi keyframe. Baïn chæ neân taïo ra caùc keyframe taïi nhöõng ñieåm ñoù trong aûnh thay ñoåi.
Caùc Keyframe ñöôïc xaùc ñònh trong thanh thöôùc Timeline : moät keyframe coù moät voøng
troøn ñaët treân ñoù cho bieát keyframe ñoù ñang chöùa döõ lieäu vaø moät keyframe troáng theå hieän moät
ñöôøng thaúng ñöùng tröôùc moät frame. Caùc frame theâm vaøo sau ñoù treân cuøng moät layer seõ coù cuøng
moät döõ lieäu nhö keyframe.
TUÛ SAÙCH STK – THEÁ GIÔÙI ÑOÀ HOÏA BIEÂN SOAÏN : KS PHAÏM QUANG HUY
191
Quá trình hình thành giáo trình animation
trong phương pháp tạo ra các chuyển
động frame by frame
GIAÙO TRÌNH THIEÁT KEÁ WEB : PHAÀN LYÙ THUYEÁT - TÖÏ HOÏC MACROMEDIA FLASH 5.0 BAÈNG HÌNH AÛNH CHÖÔNG 9
Keyframe coù chöùa döõ lieäu
Keyframe troáng
Caùch taïo ra moät keyframe, baïn coù theå choïn moät trong nhöõng böôùc sau ñaây:
• Choïn moät frame trong thanh thöôùc Timeline vaø choïn treân trình ñôn Insert >
Keyframe.
• Nhaáp phaûi chuoät (trong Windows) hoaëc nhaáp Control (trong Macintosh) taïi moät
frame trong thanh thöôùc Timeline vaø choïn leänh Insert Keyframe coù trong trình
ñôn.
CAÙC BIEÅU TÖÔÏNG CHUYEÅN ÑOÄNG ANIMATION TREÂN THANH THÖÔÙC TIMELINE
Flash phaân bieät cheá ñoä chuyeån ñoäng Tweened Animation vôùi cheá ñoä chuyeån ñoäng
frame-by-frame trong thanh thöôùc Timeline nhö sau:
Caùc keyframe chuyeån ñoäng theo cheá ñoä Tweening laø Motion ñöôïc xaùc ñònh baèng
daáu chaám ñen vaø caùc frame Tween ôû giöõa lieân tuïc vaø hai ñaàu coù muõi teân maøu ñen
cuøng vôùi neàn Background coù maøu xanh nhaït.
Caùc Keyframe chuyeån ñoäng theo cheá ñoä Tweening laø Shape ñöôïc xaùc ñònh baèng
daáu chaám ñen vaø caùc frame Tween ôû giöõa lieân tuïc vaø hai ñaàu coù muõi teân maøu ñen
cuøng vôùi neàn Background coù maøu xanh laù caây.
TUÛ SAÙCH STK – THEÁ GIÔÙI ÑOÀ HOÏA BIEÂN SOAÏN : KS PHAÏM QUANG HUY
192
GIAÙO TRÌNH THIEÁT KEÁ WEB : PHAÀN LYÙ THUYEÁT - TÖÏ HOÏC MACROMEDIA FLASH 5.0 BAÈNG HÌNH AÛNH CHÖÔNG 9
Moät ñöôøng gaïch cho bieát caùc keyframe cuoái cuøng ñang bò thieáu.
Moät keyframe ñôn ñoäc ñöôïc xaùc ñònh baèng moät daáu chaám ñen. Caùc frame coù maøu
xaùm saùng sau moät keyframe coù chöùa cuøng döõ lieäu vaø coù moät ñöôøng maøu ñen, moät
hình chöõ nhaät nhoû roãng ôû frame cuoái cuøng.
Moät chöõ a nhoû chæ ra raèng frame ñoù ñaõ ñöôïc gaùn moät Action (haønh ñoäng) trong
baûng Actions.
Moät laù côø maøu ñoû cho bieát frame ñoù coù lôøi chuù thích vaø frame ñoù coù teân.
CAÙC LAYER TRONG ANIMATION
Moãi Scene trong Flash movie coù theå goàm coù nhieàu Layer. Khi baïn taïo aûnh chuyeån ñoäng,
baïn duøng caùc Layer ñeå saép xeáp caùc thaønh phaàn cuûa moät trình töï chuyeån ñoäng vaø taùch bieät caùc
ñoái töôïng chuyeån ñoäng vì vaäy chuùng khoâng xoaù, keát noái hoaëc phaân raõ laãn nhau. Neáu baïn laøm
Flash chuyeån ñoäng nhieàu nhoùm hoaëc caùc Symbol cuøng luùc, moãi ñoái töôïng phaûi ôû treân töøng
Layer ñoäc laäp. Ñaëc bieät, Layer Background laø moät aûnh tónh, caùc Layer boå sung chæ chöùa moät ñoái
töôïng chuyeån ñoäng ñoäc laäp vôùi nhau.
Caùc Layer xuaát hieän thaønh haøng trong thanh thöôùc Timeline
Khi moät ñoaïn phim coù nhieàu Layer, Track vaø hieäu chænh caùc ñoái töôïng trong moät hay
nhieàu Layer trôû neân raát khoù khaên. Coâng vieäc naøy trôû neân deã daøng neáu baïn laøm vieäc vôùi treân
moät döõ lieäu trong töøng Layer taïi luùc naøo ñoù.
TOÁC ÑOÄ FRAME
Moät toác ñoä frame quaù chaäm coù theå laøm cho aûnh chuyeån ñoäng khoâng lieân tuïc. Ñoái vôùi toác
ñoä frame quaù nhanh coù theå laøm môø chi tieát chuyeån ñoäng. Moät toác ñoä frame 12 frame treân moät
giaây (fps) thöôøng cho keát quaû toát nhaát khi xuaát ñoaïn phim treân trang Web. Ñoaïn phim
QuickTime vaø AVI movies coù moät toác ñoä chung laø 12 fps trong khi ñoù toác ñoä aûnh chuyeån ñoäng
chuaån laø 24 fps. Ñoä chuyeån ñoäng phöùc taïpï vaø toác ñoä cuûa maùy tính ñeàu aûnh höôûng ñeán toác ñoä
phaùt laïi cuûa ñoaïn phim. Kieåm tra ñoaïn phim chuyeån ñoäng cuûa baïn treân nhieàu maùy khaùc nhau ñeå
xaùc ñònh toác ñoä toái öu cho caùc frame.
Vì baïn chæ xaùc ñònh moät toác ñoä frame cho toaøn ñoaïn phim Flash Movie, ñoù laø moät caùch
thieát laäp tæ leä toát nhaát tröôùc khi baïn baét ñaàu taïo ra aûnh chuyeån ñoäng.
MÔÛ ROÄNG AÛNH
Khi baïn taïo ra moät aûnh neàn Background chuyeån ñoäng, ñieàu ñoù raát caàn thieát cho vieäc taïo
ra moät aûnh tónh trong nhieàu frame. Vieäc theâm vaøo caùc frame môùi (khoâng phaûi laø keyframe) vaøo
moät Layer seõ laøm taêng kích thöôùc döõ lieäu cuûa frame cuoái trong taát caû caùc frame môùi.
TUÛ SAÙCH STK – THEÁ GIÔÙI ÑOÀ HOÏA BIEÂN SOAÏN : KS PHAÏM QUANG HUY
193
GIAÙO TRÌNH THIEÁT KEÁ WEB : PHAÀN LYÙ THUYEÁT - TÖÏ HOÏC MACROMEDIA FLASH 5.0 BAÈNG HÌNH AÛNH CHÖÔNG 9
Môû roäng aûnh trong nhieàu frame:
1. Taïo moät aûnh trong keyframe ñaàu tieân cuûa ñoaïn
phim.
2. Choïn moät frame beân phaûi, taïi vò trí frame cuoái maø
baïn muoán theâm vaøo.
3. Choïn trình ñôn Insert > Frame.
Duøng moät Shortcut ñeå môû roäng aûnh:
4. Taïo moät aûnh trong keyframe ñaàu tieân.
5. Nhaán phím Alt vaø nhaáp chuoät vaøo keyframe sang phaûi. Ñieàu naøy seõ taïo ra moät
vuøng môû roäng môùi maø khoâng caàn moät keyframe môùi taïi ñieåm cuoái.
TOÅNG QUAN VEÀ CHEÁ ÑOÄ CHUYEÅN ÑOÄNG TWEENED ANIMATION
Flash coù theå taïo ra 2 loaïi chuyeån ñoäng cuûa Tweened Animation.
Cheá ñoä Motion Tweening, baïn phaûi xaùc ñònh caùc thuoäc tính nhö vò trí, kích thöôùc
vaø höôùng xoay cho moät Instance, Group hoaëc khoái kyù töï taïi moät ñieåm vaø sau ñoù
baïn thay ñoåi caùc thuoäc tính naøy taïi moät ñieåm khaùc.
Cheá ñoä Shape Tweening, baïn phaûi veõ ñoái töôïng taïi moät ñieåm vaø sau ñoù baïn thay
ñoåi hình daïng hoaëc veõ moät ñoái töôïng khaùc taïi moät ñieåm khaùc. Flash seõ theâm vaøo
caùc giaù trò hoaëc hình daïng cho caùc frame giöõa, taïo ra chuyeån ñoäng.
TAÏO CHUYEÅN ÑOÄNG (TWEEN) CHO CAÙC INSTANCE, NHOÙM (GROUP) VAØ KYÙ TÖÏ
(TYPE)
Ñeå laøm thay ñoåi caùc thuoäc tính cuûa caùc Instance, nhoùm vaø kyù töï, baïn söû duïng cheá ñoä
chuyeån ñoäng Motion Tweening. Flash coù theå thay ñoåi vò trí, kích thöôùc, höôùng xoay vaø keùo xieân
caùc Instance, nhoùm hoaëc kyù töï. Ngoaøi ra, Flash coù theå thay ñoåi maøu cuûa Instance vaø kyù töï, taïo
ra söï chuyeån ñoåi maøu töø töø hoaëc taïo ra moät Instance ôû cheá ñoä vaøo hoaëc ra môø daàn.
Ñeå thay ñoåi maøu cuûa caùc nhoùm hoaëc kyù töï, baïn phaûi taïo cho chuùng trôû thaønh caùc
Symbol. Baïn coù theå xem muïc “Caùch taïo ra caùc Symbol” ñeå bieát theâm chi tieát.
Neáu baïn thay ñoåi soá frame giöõa hai keyframe hoaëc di chuyeån nhoùm hoaëc Symbol trong
keyframe, Flash seõ töï ñoäng tween caùc frame naøy moät laàn nöõa.
Baïn coù theå taïo ra cheá ñoä chuyeån ñoäng Motion Tweening duøng moät trong hai caùch sau:
Caùch Thöù Nhaát : Taïo ra keyframe ñaàu vaø
keyframe keát thuùc cho quaù trình chuyeån
ñoäng vaø duøng tuøy choïn Motion trong muïc
Tweening töø baûng Frame Properties.
TUÛ SAÙCH STK – THEÁ GIÔÙI ÑOÀ HOÏA BIEÂN SOAÏN : KS PHAÏM QUANG HUY
194
GIAÙO TRÌNH THIEÁT KEÁ WEB : PHAÀN LYÙ THUYEÁT - TÖÏ HOÏC MACROMEDIA FLASH 5.0 BAÈNG HÌNH AÛNH CHÖÔNG 9
Caùch Thöù Hai : Taïo ra keyframe chuyeån ñoäng ñaàu tieân vaø sau ñoù choïn treân trình
ñôn Insert > Create Motion Tween vaø di chuyeån ñoái töôïng ñeán vò trí môùi trong
vuøng. Flash seõ töï ñoäng taïo ra keyframe keát thuùc.
Khi thay ñoåi vò trí, baïn coù theå taïo cho ñoái töôïng di chuyeån doïc theo moät ñöôøng daãn phi
tuyeán (Nonlinear Path).
AÛnh ví duï con ong taïi frame thöù hai, ba vaø thöù tö laø keát quaû chuyeån ñoäng töø keyframe ñaàu
ñeán keyframe cuoái cuøng
Taïo moät aûnh chuyeån ñoäng Motion Tween duøng tuøy choïn Motion trong muïc Tweening:
1. Nhaáp chuoät vaøo teân cuûa Layer ñeå kích hoaït noù trôû thaønh Layer hieän haønh vaø sau ñoù
choïn moät Keyframe troáng trong Layer nôi baïn muoán taïo vuøng chuyeån ñoäng baét ñaàu.
2. Taïo moät Instance, nhoùm hay moät khoái kyù töï trong vuøng Stage hoaëc keùo moät Instance
cuûa moät Symbol trong cöûa soå thö vieän Library. Ñeå chuyeån ñoäng ñoái töôïng ñaõ veõ, baïn
phaûi chuyeån ñoåi ñoái töôïng ñoù trôû thaønh moät Symbol.
3. Taïo keyframe thöù hai (keyframe keát thuùc), nôi baïn muoán vuøng chuyeån ñoäng keát thuùc
baèng caùch duøng chuoät nhaáp vaøo xaùc ñònh vò trí frame cuoái cuøng. Sau ñoù baïn nhaáp
phaûi chuoät choïn leänh Insert Blank Keyframe coù trong trình ñôn ñeå theâm vaøo caùc
keyframe troáng cho ñoaïn phim.
Xaùc ñònh vò trí
frame cuoái
Choïn leänh Insert Blank Keyframe
TUÛ SAÙCH STK – THEÁ GIÔÙI ÑOÀ HOÏA BIEÂN SOAÏN : KS PHAÏM QUANG HUY
195
