intTypePromotion=1
zunia.vn Tuyển sinh 2024 dành cho Gen-Z zunia.vn zunia.vn
ADSENSE

Giáo trình hướng dẫn tạo ra các biểu tượng chuyển động Tween animation trên thanh thước timeline p1

Chia sẻ: Trytry Qwerqr | Ngày: | Loại File: PDF | Số trang:8

64
lượt xem
3
download
 
  Download Vui lòng tải xuống để xem tài liệu đầy đủ

Tham khảo tài liệu 'giáo trình hướng dẫn tạo ra các biểu tượng chuyển động tween animation trên thanh thước timeline p1', công nghệ thông tin, đồ họa - thiết kế - flash phục vụ nhu cầu học tập, nghiên cứu và làm việc hiệu quả

Chủ đề:
Lưu

Nội dung Text: Giáo trình hướng dẫn tạo ra các biểu tượng chuyển động Tween animation trên thanh thước timeline p1

  1. 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 Giáo trình hướng dẫn tạo ra các biểu tượng chuyển động Tween AÙCH TAÏO RA CAÙC AÛNH Canimation trên thanh thước timeline 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
  2. . 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
  3. . 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
  4. . 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
  5. . 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
  6. . 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 Sau khi choïn leänh Insert Blank Keyframe 4. Sau ñoù baïn nhaáp chuoät vaøo keyframe thöù nhaát. Taïi ñaây baïn coù theå thöïc hieän moät trong nhöõng böôùc sau ñeå thay ñoåi Instance, Group hoaëc khoái kyù töï taïi frame cuoái cuøng: Di chuyeån ñoái töôïng ñeán vò trí môùi. Thay ñoåi kích thöôùc, höôùng xoay hoaëc keùo xieân ñoái töôïng. Thay ñoåi maøu saéc cuûa ñoái töôïng (chæ coù Instance hoaëc khoái kyù töï). Ñeå thay ñoåi maøu saéc cuûa caùc thaønh phaàn khaùc ngoaøi Instance hoaëc khoái kyù töï, baïn phaûi duøng cheá ñoä chuyeån ñoäng Shape Tweening. 5. Choïn trình ñôn Window > Panels > Frame ñeå xuaát hieän baûng Frame. 6. Ñoái vôùi muïc Tweening, choïn Motion. Sau khi baïn choïn leänh Motion trong muïc Tweening, treân thanh thöôùc Timeline xuaát hieän caùc ñöôøng gaïch treân keyframe 7. Neáu baïn muoán thay ñoåi kích thöôùc cuûa ñoái töôïng nhö trong böôùc 4, baïn haõy choïn leänh Scale trong trình ñôn Modify > Transform ñeå thay ñoåi kích thöôùc cuûa ñoái töôïng ñaõ choïn. TUÛ SAÙCH STK – THEÁ GIÔÙI ÑOÀ HOÏA BIEÂN SOAÏN : KS PHAÏM QUANG HUY 196
  7. . 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 8. Nhaáp chuoät vaøo keùo caùc phím muõi teân keá tieáp choïn giaù trò trong muïc Easing hoaëc nhaäp vaøo giaù trò ñeå hieäu chænh tæ leä thay ñoåi giöõa caùc frame chuyeån ñoäng nhö: Khi baét ñaàu chuyeån ñoäng toác ñoä chaàm chaäm sau ñoù taêng toác höôùng veà phía keát thuùc chuyeån ñoäng, keùo con tröôït leân hoaëc nhaäp vaøo giaù trò töø -1 ñeán -100. Khi baét ñaàu, chuyeån ñoäng coù toác ñoä raát nhanh sau ñoù giaûm toác chuyeån ñoäng höôùng veà ñieåm keát thuùc chuyeån ñoäng, keùo con tröôït xuoáng hoaëc nhaäp vaøo giaù trò döông töø 1 ñeán 100. Theo maëc ñònh, toác ñoä thay ñoåi giöõa caùc frame lieân tuïc. Muïc Easing taïo ra hình daïng ñoái töôïng xuaát hieän nhoû daàn hoaëc lôùn daàn baèng caùch hieäu chænh toác ñoä thay ñoåi cuûa chuùng. 9. Ñeå xoay caùc ñoái töôïng ñöôïc choïn trong khi chuyeån ñoäng, baïn coù theå choïn moät tuøy choïn trong trình ñôn Rotate: Choïn None (cheá ñoä thieát laäp maëc ñònh) khoâng öùng duïng cheá ñoä xoay cho ñoái töôïng. Choïn Auto xoay ñoái töôïng chuyeån ñoäng ít nhaát moät laàn theo höôùng xaùc ñònh. Trong muïc Rotate choïn Clockwise (CW) hay Counterclockwise (CCW) ñeå xoay ñoái töôïng theo höôùng ñöôïc xaùc ñònh vaø sau ñoù nhaäp vaøo goùc ñoä xoay. Chuù yù : Höôùng xoay naøy theâm vaøo baát kyø höôùng xoay naøo baïn öùng duïng vaøo frame cuoái cuøng trong böôùc 4. 10. Neáu baïn ñang duøng moät ñöôøng daãn chuyeån ñoäng (Motion Path), choïn muïc Orient to Path ñeå ñònh höôùng ñöôøng bieân chuyeån ñoäng vaøo ñöôøng Motion Path. TUÛ SAÙCH STK – THEÁ GIÔÙI ÑOÀ HOÏA BIEÂN SOAÏN : KS PHAÏM QUANG HUY 197
  8. . 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 11. Choïn muïc Synchronization ñeå ñaûm baûo Instance dieãn hoaït laëp ñi laëp laïi ñuùng trong ñoaïn phim. Duøng leänh Synchronize neáu soá frame quaù trình chuyeån ñoäng beân trong Symbol thaäm chí khoâng nhieàu hôn soá frame maø Instance Graphic giöõ trong ñoaïn phim. 12. Neáu baïn ñang duøng moät ñöôøng Motion Path, choïn Snap ñeå gaén caùc thaønh phaàn chuyeån ñoäng vaøo ñöôøng Motion Path theo ñieåm khai baùo (Registration Point). 13. Cuoái cuøng nhaáp chuoät vaøo keyframe cuoái cuøng vaøo keùo ñoái töôïng ñeán vò trí xaùc ñònh ñieåm döøng chuyeån ñoäng ñeå taïo ra ñöôøng Motion Tween. Baïn coù theå xem ví duï nhö hình beân döôùi. 14. Ñoái töôïng ñaõ taïo xong vaø baïn coù theå nhaán phím Enter ñeå dieãn hoaït ñoaïn phim vöøa taïo. Luùc naøy baïn seõ thaáy kyù töï “Flash” seõ chuyeån ñoäng töø traùi sang phaûi. Ñoaïn phim ñang dieãn hoaït TUÛ SAÙCH STK – THEÁ GIÔÙI ÑOÀ HOÏA BIEÂN SOAÏN : KS PHAÏM QUANG HUY 198
ADSENSE

CÓ THỂ BẠN MUỐN DOWNLOAD

 

Đồng bộ tài khoản
2=>2