Giáo trình Script và kỹ thuật hoạt hình

ĐẶNG NGỌC HOÀNG THÀNH  
SCRIPT VÀ KĨ  
THUẬT HOẠT HÌNH  
(Giáo trình ging dy trên Flash CS5/CS6và ActionScript 3.0)  
Blank Page  
- 2 -  
LỜI NÓI ĐẦU  
dobe Flash là mt phn mm chuyên nghiệp để tạo các thước phim  
hot hình, các trò chơi, thiết kế giao din web (ư  
thuat RIA – Rich Internet Application)… Flash có mt ng dng to ln  
trong thế gii Internet nói chung và trong công nghgii trí nói riêng.  
́ ng dụ ng trong kı̃  
̣
̂
A
Dù rng nhiu công nghmới ra đời đang cố gng cnh tranh vi  
Flash, nhưng Flash vẫn chiếm thphần cao hơn hẳn. Có khá nhiu giáo trình về  
Flash được biên soạn, nhưng đại đa số đều da trên phiên bn MacroMedia Flash  
MX 2004 tương đối cũ. Vi phiên bản CS5, Adobe đã bổ sung vào những tính năng  
mới giúp người dùng thiết kế và lập trình đơn giản hơn. Cun giáo trình này gm  
có ba phn:  
Phần 1. Thiết kế dành riêng cho những độc gikhông chuyên mun tìm  
hiu cách sdng công cvvà to hot hình bng các công ccó sn ca Flash.  
Phn này bao gồm các chương 1, chương 2, chương 3, chương 4.  
Phần 2. Gồm chương 5. Dành cho các độc gimun tìm hiu về  
ActionScript 3.0 – mt ngôn nglp trình có cu trúc gn ging vi Java được sử  
dng để tăng cường sc mnh cho Flash.  
Phần 3. Mang tính cht tng hp. Gồm các chương 6 và 7. Phn này giúp  
bạn đọc hoàn thiện các thước phim hot hình bằng các kĩ thuật nâng cao. Chúng  
tôi c u  
Ben ca  
(trong dư  
như chưa có một giáo trình ve Flash nào đề cập đến.  
Khi biên son giáo trình này, c h u n g tôi đã cố gng hoàn thin nó. Tuy nhiên,  
không thtránh khi sai sót. Chung tôi rt mong nhận được sự đóng góp ý kiến  
̃
n g cung cp thêm các kiến thức để làm vic vi hình nh, âm thanh và video.  
nh đo, chúng tôi còn gii thiu gói thư viện ma nguon mPaperVision3D  
n cung ten) để làm vic với đồ họa 3D trong Flash – một điều mà hu  
̂
̣
́
̃
̣
á  
̀
̂
́
́
quý báu ca các bạn độc giả cũng như các bạn đồng nghip. Mọi thư từ đóng góp  
xin gi vcác địa chemail sau dnhthanh@hueic.edu.vn hoc  
Trong giáo trình này, chúng tôi còn bsung thêm mt số tính năng mới mà Adobe  
đưa vào cho phiên bản Flash CS6.  
Huế 2012  
Tác giả  
- 3 -  
 
Blank Page  
- 4 -  
PHỤ LỤC  
- 5 -  
- 6 -  
- 7 -  
- 8 -  
- 9 -  
Blank Page  
- 10 -  
CHƯƠNG 1. GIỚI THIỆU VỀ FLASH  
1.1. Sơ lược về đồ ha vector và lch sử ra đời ca Flash  
Sơ lược về đồ họa vector  
Đo ho  
tien. Mo  
phương tie  
̣
a ma  
t trong như  
n multimedia. Đồ ha máy tính co  
́
y tın  
́
h la  
̀
mo  
̂
t trong như  
̃
ng lın  
̃
h vư  
ng ti  
the  
̣
c co  
m na  
được chia làm ba dạng cơ bản:  
́
nhieu ư  
́
ng du  
̣
ng lơ  
́
n trong thư  
̣ c  
̂
̃
ng lın  
̃
h vưc ư  
̣
́
ng du  
̣
̆
ng đo  
́
la lın  
̀
̃
h vư  
̣
c giai trı đa  
̉
́
̂
́
Đồ họa điểm: cơ sở của nó là các điểm nh (pixel). Mi bc nh của đồ họa điểm  
là mt ma trận điểm, mà mỗi điểm ảnh được xác định bi mt mu màu theo  
chun phbiến là RGB (Red-Green-Blue). Mi tham số màu được phân bt0  
cho đến 2n -1 (nh dng n bit màu). Khi phóng to bc nh của đồ họa điểm, ta sẽ  
thy rõ từng điểm nh. Hãy quan sát ví dụ đối vi bc nh sau đây:  
Hình 1 Đồ họa điểm  
   
Đồ họa Fractal: sdng thut toán đệ quy. Mo  
fractal se la mot hınh anh thu nho cua chınh đoi tươ  
quan trong va co nhi u ưng dung trong thưc tien. Nếu quan tâm đến dạng đồ ha  
này, đoc gia co the tham kho thêm trong các tài liệu liên quan đến đồ ha Fractal  
hay hình hc Fractal.  
̂
t bo  
̂
pha  
̣
̂
n na  
̀
o đo  
́
tre  
̂
n đoi tượ ng  
̃
̀
̂
̀
̉
̉
̉
́
̣
ng đo  
́
. Đay la  
̂
̀
mo  
̂
t da  
̣
ng đ ho  
̣a  
̣
̀
́
́
̣
̣
̂
̉
́
Hình 2 – Đồ ha Fractal  
Đồ họa vector: cơ sở ca nó là vector và đường cong Bezier. Da  
có nhiều ưu điểm so với đồ họa điểm. Mt trong những ưu điểm ln nht ca nó  
là không khong co sư giơi han khi phong to bưc anh. Thong thương, cac anh dang  
hoa điem se b“vht” khi phóng to. Sư vơ hat nay con tuy vao đo phan gia  
a cac bưc anh. Anh cang min (đươc chup bơi cac may anh co zoom so lơn) thı  
cho phep kha nang phong to lơn hơn. Con đoi vơi anh dang vector, thı se khong  
bao giơ xay ra tınh trang nay. Cung vı lı do nay, ma u het cac nha thiet ke thıc  
sư dung chương trınh xư lı hoa vector hơn la hoa điem (bơi chung thươ  
đươc in tren cac kho giay co kıch thươc khac nhau bao gom ca n h ư  
kıch thươc lơ  
̣
ng đo họa vector  
̂
́
̣
́
̣
́
́
̉
̂
̀
́
̉
̣
đ
̣
̃
̣
̃
̣
̀
̀
̀
̀
̂
̂
̉i  
cu  
̉
́
́
̉
̀
̣
̣
̣
̉
́
́
̉
́
́
̀
́
̉
̆
́
́
̀
́
̉
̣
̀
̃
̂
̀
̉
̀
̣
̀
̃
̀
́
̀
̀
h
́
̀
́
h
̉
̣
̀
̉
́
đ
̣
̀
đ
̣
̉
́
̀
ng  
̣
̂
́
́
́
́
́
̉
̃ n g kho giay có  
́
́
́
n). Các chương trình đồ ha vector ni tiếng bao gm Adobe  
- 12 -  
Illustrator, Corel Draw,… Mt bc ảnh dưới dng đồ ha vector bao giờ cũng mịn  
màng hơn so với đồ họa điểm.  
Đoi vớ i đ � họa điem, không có nhiu định dng htrchế độ transparent (hay  
chế độ màu alpha). Nhưng với đồ ha vector, thì những tính năng này được hỗ  
trmt cách hoàn ho. Với đồ họa vector, các chương trình chnh sa và thiết kế  
đồ ha luôn htrchế độ lớp Layer, nhưng với đồ họa điểm, chcó một vài định  
dng mi htrlớp Layer này (như đin  
photopaint,…). Ban hãy quan sát mt số đối tượng đồ họa được to bi Adobe  
Illustrator sau đây:  
̣ h dạng photoshop, định dạng corel  
̣
Hình 3 Đồ ha vector  
n g c u a Flash (swf) mà chúng ta slàm quen ở đây cũng  
Định dng ta  
̣
̂
p tin cuoi c u  
̀
̉
thuộc vào đồ ha vector. Flash thường được sdụng để to ra các hiu ứng động.  
Xét mt phạm trù nào đó, nó có nhiều điểm tương đồng với kĩ thuật to video  
(kĩ thuật 24 hình/giây). Nhưng nó có ưu điểm là phim được to bi Flash không  
bvht khi phóng to (trừ trường hp phim có chứa các đối tượng đồ họa điểm).  
Một đieu đặc bit mà Flash đượ c ưa chuộng và sử dụ ng rộng rãi trên internet là  
- 13 -  
kích thước phim to bi Flash rt nhgn so với các định dng phim khác va  
thương đươc sư dung đe truy n tai tren world wide web.  
Lịch sử ra đời của Flash  
Flash là một kĩ thuật to các hiu ứng động, các thước phim hot hình, thiet ke  
giao dien ngươi dung cho cac ưng dung web… Flash được gii thiệu đầu tiên bi  
̀
̀
̣
̉
̣
̉
̂
̂
̀
̀
́
́
̣
công ty MacroMedia vào năm 1999. Đến năm 2005, công ty này đã được Adobe  
mua li với giá 3.4 tỉ đôla. Từ khi ra đời cho đến này, Flash đã có rất nhiều bước  
phát triển đáng chú ý. Nhiều tính năng mới đã liên tục được cp nhp trong các  
phiên bn ca nó, ktcác phiên bản Macromedia Flash cho đến Adobe Flash  
hin nay.  
Vi phiên bản Adobe Flash CS4, công ty Adobe đã bổ sung vào cho Flash nhng  
tính năng mạnh m: htrnhiều định dng import dliu; bsung các công cụ  
to hot hình mnh mẽ như Bone, Bind, 3D Translation, 3D Rotation,…  
Phiên bn mi nht ca Flash là CS5.5 (cho đến đau năm 2012). Hin nay, Adobe  
cũng đã tạo ra mt n bản mã nguồn mở cho Flash đó là công nghệ Flex. Mt  
trong nhng công nghệ ra đời sm nht htrto giao din cho ư  
tınh tương tac cao vơi ngươi dung – RIA. Flex là mt công nghha hẹn đem lại  
nhiu li nhun cho Adobe (nhvào trình phát trin Adobe Flex Buider). Nó là  
một đối thln khi so sanh vơi công nghSilverlight ca Microsoft và JavaFx ca  
́ ng dụ ng web có  
́
́
́
̀
̀
́
́
Sun (nay được mua li bi Oracle).  
1.2. So sánh Flash vi Silverlight và JavaFx  
Ngày nay, xu thế thương mại điện tử hóa đang ngày càng len lỏi vào các ngóc  
ngách xã hội. Các website kho  
̂
ng chı  
̉
là nơi cung cấp thông tin mà nờ i sử dụ ng  
internet con sư dung no đe trao đổi tho  
̀
̉
̣
́
̂
ng tin, mua ban, chia se... Do đó, giao diện  
́
̉
website đẹp mt, thiết kế thun tin là mt li thế. Chính vì lẽ đó, rất nhiu nhà  
phát trin chú ý đến điều này. Các hãng phần mm ln như Microsoft, Adobe,  
Sun,… đa  
trcông nghRIA no  
̃
phát trin các công nghhtrợ để chiếm lĩnh thị trường phn mm hỗ  
i trên. Tính vtuổi đời phát trin ca các công nghhtrợ  
́
RIA, Adobe tỏ ra là người tiên phong.  
Flash/Flex ca Adobe, Silverlight ca Microsoft và JavaFx ca Sun là nhng công  
nghệ đáng chú ý nhất. Mi trong số chúng đều có ưu điểm noi tro  
̣̂i riêng. Một ưu  
điểm chung của chúng là đồ ha rất đẹp và chuyển động rt mm mi.  
Flash/Flex có tuổi đời khá cao, với lượng người dùng đông đảo, hu hết các nhà  
phát triển đã quá quen thuộc vi Flash. Flash cũng hỗ trlập trình hướng đối  
tượng. Nó cũng tương thích với hu hết các ngôn nglp trình web hin nay.  
Flash htrhu hết trên các hệ điều hành: Windows, Linux, MacOS và rt nhiu  
mu Mobile ca nhiều hãng khác nhau. Để phát trin mt ng dng Flash, các nhà  
- 14 -  
 
phát trin có thsdng trình biên tp Adobe Flash Professional hoa  
Flash Builder. Cac trình biên tp này hoạt động tt trên đa số hệ điều hành:  
Windows và MacOS. Mt yêu cầu để trình khách (vı du như trınh duyet web) có  
thchạy được Flash là cần cài đặt mt plugin Flash nhgn (khoang 2 Mb); hỗ  
trmt phiên bn Flash Lite (cho các dòng điện thoi); Adobe Flash Player,  
Adobe Shockwave, Adobe AIR (cho ca PC, Laptop, smartphone, tablet,…).  
̣̆c Adobe  
́
́
̣
̀
̣̂  
̉
̉
Silverlight mc dầu ra đời sau Flash, nhưng với shu thun ca mt tập đoàn  
lớn như Microsoft, nó cũng đang dần có mt vthế đáng kể. Ngoài ra, Silverlight  
được phát trin trên nn .NET, các lp trình viên có thsdng VB.NET hoc C# -  
mt ngôn nglp trình mnh m- để phát trin. Nhược điểm ca nó là chỉ tương  
thích trên Windows, MacOS và các mẫu điện thoi Windows Mobile. Để phát trin  
ng dng trên Silverlight, các nhà phát trin chcó thsdng Visual Studio vn  
chdành cho hệ điều hành Windows. Trình khách mun chạy được Silverlight cn  
cài đặt Plugin Silverlight (khong 5 Mb).  
JavaFx ra đời sau cùng, nhưng nó có nhiều ưu điểm: mã nguồn m, htrnhiu  
hệ điều hành – Windows, Linux, MacOS và ha hn hoạt động tt trên nhiu mu  
Mobile, trình khách không cần cài đặt plugin htr. Để son thảo JavaFx, người  
dùng có thsdng Eclipse hoc NetBean. Chai trình biên dịch này đều hot  
động tt trên Windows, Linux và MacOS. Nhưng một điều đáng tiếc là JavaFx li  
ra đời quá mun màng.  
Vi tuổi đời cao, lượng người dùng có kinh nghim ln, các lp trình viên và các  
nhà phát triển đã quá quen thuộc vi Flash. Flash vẫn đang và sẽ phát trin trong  
mt khong thi gian dài nữa. Flash có ba định hướng trng tâm: phát trin RIA  
cho web, to các chương trình ứng dng cha  
Windows, MacOS, Linux, Android, iOS…) và các thưc phim trình din cha  
Flash Player, Shockwave, Flash Plugin, Flash Lite. Trong năm 2010, W3C đã đưa  
ra chun mi cho cac ưng dung web – cong nghe HTML 5 – ha hn ssoán ngôi  
̣
y tre  
̂
n Adobe Air (tương thıć h vớ i  
̣
y trên  
́
́
̣
̂
̣̂  
RIA ca Flash, Silverlight và JavaFx. Dù sau này, vthế trong vic phát trin RIA  
cho web có thay đổi, thì những định hướng còn li ca Flash vn là những định  
hướng phát trin quan trng, đảm bo sự trường tn cho công nghnày.  
1.3. Cài đặt Adobe Flash CS5  
Yêu cu cấu hình cài đặt: hệ điều hành Windows XP Pack 3 hoặc cao hơn  
(MacOS X hoặc cao hơn), 1Gb Ram hoặc cao hơn, Pentium IV hoặc cao hơn.  
Mc du mục đích chính của chúng ta là sdụng chương trình Adobe Flash  
Professional CS5, tuy nhiên các bn có thsdng thêm mt số chương trình  
đính kèm như: Photoshop dùng để hiu chnh nh, Dreamweaver thiết kế giao  
diện web đồng thời chèn các phim Flash vào, son tho ActionScript chuyên  
- 15 -  
 
nghiệp hơn với Flash Buider 4, hiu chnh âm thanh, video… Chính vì lý do này,  
tôi đề nghcác bn nên chn btrn gói Adobe Master CS5 (hoac CS5.5).  
Chúng ta có thti trc tiếp tAdobe va có 30 ngày để dùng th. Sau khi ti v,  
̣̆  
̀
hãy tiến hành gii nén tp tin, khi đó ta sẽ thu được một thư mục chính.  
Nếu ta sdng một đĩa cài đặt DVD, thì hãy đưa đĩa DVD vào ổ đĩa DVD trên máy  
tính. Chúng ta có thsdng chế độ AutoRun ca nó, hoc mở đĩa DVD này ra.  
Trong cả hai trường hợp nêu trên, thư mục chính s4 thư mục con và mt tp  
Set-up.exe. Cấu trúc thư mục có dng như sau:  
Hình 4 – Cấu trúc thư mục bên trong đĩa DVD cài đặt Flash CS5  
Hãy nhấp đôi chuột vào tp tin Set-up.exe, khi đó, sẽ có ca sổ sau đây hiện ra  
Hình 5 – Màn hình chào đón khi cài đặt Adobe Master CS5  
- 16 -  
Hãy đọc qua các điều khon sdng phn mm, nếu đồng ý thì các bn chvic  
nhấp Accept. Ngược lại, hãy chọn Quit để hy bviệc cài đặt.  
Sau khi nhp vào Accept, ca sổ sau đây sẽ xut hin.  
Hình 6 – Ca sSerial Number  
Trong ca snày, chúng ta có thể điền serial vào – tương ng vi Provide a serial  
number (nếu đã có một số serial), ngược lại, hãy chọn Install this product as a  
trial (nếu các bn mun sdng thử 30 ngày). Nếu mun chn ngôn nghin th,  
hãy chọn Select Language. Sau đó, bạn nhp Next. Adobe Master không htrợ  
tiếng vit. Nó chhtrmt vài ngôn ngữ như tiếng anh, tiếng nht… Nếu số  
serial điền vào đúng, thì sẽ xut hin mt du tích mầu xanh. Ngược li, nếu số  
serial sai, dấu nhân màu đỏ sxut hin. Nếu số serial đúng, ta có thể nhp Next  
để tiếp tục quá trình cài đặt. Nếu không có số serial, hãy chọn chế độ dùng th.  
Khi cài đặt chế độ dùng th, Adobe sẽ thường xuyên đưa ra thông báo để nhc  
nhvsngày dùng thcòn li và nó stự động chm dt khả năng dùng thử  
sau 30 ngày. Ta cũng có thể sdng chế độ cài đặt này nếu đã có số serial. Và số  
serial sẽ được bsung sau.  
Sau khi nhp next, ca sAdobe ID shin ra. Sau đó là cửa sInstall Options.  
Trong ca snày, cho phép ta chn la các thông số cài đặt.  
- 17 -  
Hình 7 – Ca sInstall Options  
Chúng ta có thchn la các phn mm cần cài đặt bằng cách đánh dấu tích vào  
các phn mềm tương ứng. Nếu mun hc Flash CS5, hãy chọn – Flash  
Professional. Ngoài ra, tôi khuyến nghị hãy chn thêm các phn mm sau:  
Photoshop (xử lý đồ họa điểm), Flash Buider (thiết kế RIA cho web, lp trình  
ActionScript chuyên nghiệp…), SoundBooth (xử lý âm thanh). Ngoài ra, nếu quan  
tâm đến các lĩnh vực đồ ha khác, ta có thể cài đặt thêm các phn mềm như  
Illustrator là phn mm chuyên xử lí đồ họa vector, Fireworks cũng là phần mm  
chuyên xử lí đồ họa điểm, Adobe Premier chuyên xử lý phim, After Effect chuyên  
tạo kĩ xảo điện nh. Ba  
ph n m m SoundBooth ra kho  
xư ly m thanh khi chon bo ca  
Adobe Audition khong tıch hơp trong bo  
rieng. Ban co the tai no va dung thư 30 nga  
̣
n cu  
̃
ng c  
n lưu y  
i bo cai đa  
i đat CS5.5, thı  
cai đa  
y như đo  
́
ra  
ng, trong phie  
t. Neu ban muo  
ban co the  
t CS5.5 ma  
i vơi bo  
̂
n ba  
n tım  
dung Adobe Audition.  
no la mot phan mem  
cai đat CS5.5.  
̉
n CS5.5, Adobe đa  
̃ loại  
̉
̂
̀
̣
̆
̣
̀
mot chương trın  
̂
̀ h  
̉
́
â  
̣
̂
̀
̣
̆
̀
̣
́
̀
̂
́
̣
̂
̀
̣
̆
̀
́
̀
̣̂  
̂
̣
́
̉
́
̀
̀
̉
̀
́
̂
̀
̣
̆
mục Location bên dưới, bạn hãy chọn vtrí mà bn sẽ cài đặt. Theo mặc định,  
nó sẽ cài đặt vào thư mục C:\Program Files\Adobe. Bạn cũng cần lưu ý dung  
lượng ổ đĩa dành cho việc cài đặt. Bn cần luôn đảm bo rằng dung lượng để cài  
đặt – Total install phi luôn nhỏ hơn dung lượng ổ đĩa còn trống – Available.  
Sau đó, hãy nhp vào nút Install và chờ đợi cho quá trình cài đặt hoàn tt. Để kết  
thúc quá trình cài đặt, hãy nhấp vào nút Finish để đóng cửa sổ cài đặt li.  
- 18 -  
1.4. Gii thiu vAdobe Flash CS5/CS5.5  
Khởi động Adobe Flash Professional CS5/CS5.5: để khởi động Adobe Flash  
Professional CS5/CS5.5, ta có thbm chn biểu tượng ca nó trên màn hình  
Desktop, hoc tiến hành các bước sau:  
- Vào Start > All Programs  
- Chn Adobe Master Collection CS5/CS5.5.  
- Chn Adobe Flash Professional.  
Hình 8 – Khởi động Adobe Flash Professional CS5/CS5.5  
Khi đó, màn hình Splash – màn hình chào đón của Adobe Flash Professional sẽ  
hin ra  
Hình 9 Mành hình chào đón của Adobe Flash Professional CS5/CS5.5  
Sau khi quá trình khởi động hoàn tt, bn sthy giao diện sau đây  
- 19 -  
 
Tải về để xem bản đầy đủ
pdf 330 trang Thùy Anh 04/05/2022 5420
Bạn đang xem 20 trang mẫu của tài liệu "Giáo trình Script và kỹ thuật hoạt hình", để tải tài liệu gốc về máy hãy click vào nút Download ở trên

File đính kèm:

  • pdfgiao_trinh_script_va_ky_thuat_hoat_hinh.pdf