Giáo trình Script và kĩ thuật hoạt hình (Phần 1)

ĐẶNG NGỌC HOÀNG THÀNH 
SCRIPT VÀ KĨ 
THUẬT HOẠT HÌNH 
(Giáo trình giảng dạy trên Flash CS5 và ActionScript 3.0) 
- 2 - 
Blank Page 
- 3 - 
LỜI NÓI ĐẦU 
dobe Flash là một phần mềm chuyên nghiệp để tạo c|c thước phim 
hoạt hình, c|c trò chơi, thiết kế giao diện web (RIA – Rich Internet 
Application) Flash có một ứng dụng to lớn trong thế giới Internet 
nói chung và trong công nghệ giải trí nói riêng. Dù rằng nhiều công 
nghệ mới ra đời đang cố gắng cạnh tranh với Flash, nhưng Flash vẫn 
chiếm thị phần cao hơn hẳn. Có khá nhiều giáo trình về Flash được biên soạn, 
nhưng đại đa số đều dựa trên phiên bản MacroMedia Flash MX 2004 tương đối 
cũ. Với 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. Cuốn giáo trình này gồm có ba phần: 
 Phần 1. Thiết kế dành riêng cho những độc giả không chuyên muốn tìm 
hiểu cách sử dụng công cụ vẽ và tạo hoạt hình bằng các công cụ có sẵn của Flash. 
Phần 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 giả muốn tìm hiểu về 
ActionScript 3.0 – một ngôn ngữ lập trình có cấu trúc gần giống với Java được sử 
dụng để tăng cường sức mạnh cho Flash. 
 Phần 3. Mang tính chất tổng hợp. Gồm c|c chương 6 v{ 7. Phần này giúp 
bạn đọc hoàn thiện c|c thước phim hoạt hình bằng c|c kĩ thuật nâng cao. Chúng 
tôi còn cung cấp thêm các kiến thức để làm việc với hình ảnh, âm thanh và video. 
Đồng thời, chúng tôi còn giới thiệu gói thư viện mở PaperVision3D để làm việc 
với đồ họa 3D trong Flash – một điều mà hầu như chưa có một gi|o trình n{o đề 
cập đến. 
Khi biên soạn gi|o trình n{y, tôi đ~ cố gắng hoàn thiện nó. Tuy nhiên, không thể 
tránh khỏi sai sót. Tôi rất mong nhận được sự đóng góp ý kiến quý báu của các 
bạn độc giả cũng như c|c bạn đồng nghiệp. Mọi thư từ đóng góp xin gửi về các địa 
chỉ email sau [email protected] hoặc [email protected]. 
 Hueá, thaùng 08/2010 
Chaân thaønh caûm ôn ! 
A 
- 4 - 
Blank Page 
- 5 - 
PHỤ LỤC 
LỜI NÓI ĐẦU ............................................................................................................................................ 3 
CHƯƠNG 1. GIỚI THIỆU VỀ FLASH ............................................................................................ 10 
1.1. Sơ lược về đồ họa vector và lịch sử ra đời của Flash ......................................... 10 
1.2. So sánh Flash với Silverlight và JavaFx .................................................................... 13 
1.3. C{i đặt Adobe Flash CS5 ................................................................................................ 14 
1.4. Giới thiệu về Adobe Flash CS5 ..................................................................................... 17 
1.4.1. Các chế độ tùy biến giao diện ............................................................................... 19 
1.4.2. Tạo mới dự án cho desktop và mobile ............................................................. 20 
1.4.3. Layer, Frame, Scene và Movie ............................................................................. 22 
1.4.4. Vùng thanh công cụ Tools ..................................................................................... 25 
1.4.5. Vùng thuộc tính Properties ................................................................................... 25 
1.4.6. Vùng soạn thảo ActionScript ................................................................................ 26 
1.4.7. Các vùng chức năng kh|c ....................................................................................... 28 
Tổng kết chương 1 ............................................................................................................................. 35 
CHƯƠNG 2. CÁC CÔNG CỤ VẼ CƠ BẢN ..................................................................................... 37 
2.1. Các công cụ Pencil, Brush và Erase ............................................................................ 37 
2.2. Công cụ vẽ hình cơ bản ................................................................................................... 39 
2.3. Công cụ Text ......................................................................................................................... 48 
2.4. Công cụ chọn Selection và Lasso................................................................................. 50 
2.5. Các công cụ đổ màu Paint Bucket, Ink Bottle và bắt màu EyeDropper ..... 51 
2.6. Công cụ Free Transform và Gradient Transform ................................................ 53 
2.7. Các công cụ làm việc với đường Bezier ................................................................... 56 
- 6 - 
2.8. Làm việc với c|c đối tượng ........................................................................................... 59 
Tổng kết chương 2 ............................................................................................................................. 62 
CHƯƠNG 3. CÁC BIỂU TƯỢNG TRONG FLASH ..................................................................... 64 
3.1. Biểu tượng Graphic ........................................................................................................... 64 
3.2. Biểu tượng Button ............................................................................................................. 66 
3.3. Biểu tượng MovieClip ...................................................................................................... 68 
3.4. Làm việc với Library ........................................................................................................ 69 
Tổng kết chương 3 ............................................................................................................................. 70 
CHƯƠNG 4. TẠO HOẠT CẢNH ...................................................................................................... 72 
4.1. Tìm hiểu về TimeLine ...................................................................................................... 72 
4.2. Classic Tween ...................................................................................................................... 79 
4.3. Shape Tween ....................................................................................................................... 81 
4.4. Motion Tween ..................................................................................................................... 83 
4.5. Công cụ Bone và Bind ...................................................................................................... 88 
4.6. Công cụ Deco ....................................................................................................................... 92 
4.7. Công cụ 3D Translation và 3D Rotation ............................................................... 104 
Tổng kết chương 4 .......................................................................................................................... 107 
CHƯƠNG 5. LẬP TRÌNH VỚI ACTIONSCRIPT ..................................................................... 109 
5.1. Các kiểu dữ liệu ............................................................................................................... 111 
5.2. Biến và Hằng ..................................................................................................................... 112 
5.3. Toán tử và Biểu thức ..................................................................................................... 113 
5.4. Các cấu trúc lệnh điều khiển ...................................................................................... 121 
5.4.1. Câu lệnh if .................................................................................................................. 121 
5.4.2. Câu lệnh switch ....................................................................................................... 122 
- 7 - 
5.4.3. Các câu lệnh lặp for, while v{ dowhile ...................................................... 123 
5.4.4. Các lệnh continue, break và return ................................................................ 126 
5.5. Hàm ....................................................................................................................................... 127 
5.6. Lớp v{ Đối tượng ............................................................................................................ 130 
5.6.1. Xây dựng lớp ............................................................................................................ 130 
5.6.2. Làm việc với đối tượng ........................................................................................ 134 
5.6.3. Sự kiện chuột ............................................................................................................ 137 
5.6.4. Sự kiện bàn phím .................................................................................................... 138 
5.7. Đưa một đối tượng vào ActionScript ..................................................................... 139 
5.8. Làm việc với XML ........................................................................................................... 141 
5.9. Vùng chức năng Code Snippets ................................................................................ 143 
Tổng kết chương 5 .......................................................................................................................... 170 
CHƯƠNG 6. CÁC HIỆU CHỈNH NÂNG CAO .......................................................................... 172 
6.1. Xử lý âm thanh, hình ảnh và video .......................................................................... 172 
6.2. Tạo kĩ xảo điện ảnh với Flash .................................................................................... 177 
6.3. Tạo thước phim Flash tựa 3D ................................................................................... 181 
6.4. Ghép nối nhiều hoạt cảnh ........................................................................................... 188 
6.5. Kĩ thuật mặt nạ mask .................................................................................................... 188 
6.6. Tạo các nút nhấn điều khiển ...................................................................................... 196 
6.7. Xuất bản một Movie ....................................................................................................... 198 
6.8. Xuất bản một tập tin Flash trong suốt trên trình duyệt ................................ 202 
Tổng kết chương 6 .......................................................................................................................... 207 
CHƯƠNG 7. THƯ VIỆN PAPERVISION3D ............................................................................ 209 
7.1. Giới thiệu về PaperVision3D và Adobe Flex Builder ...................................... 209 
- 8 - 
7.2. Cấu hình v{ c{i đặt PaperVision3D cho Adobe Flex Buider ........................ 213 
7.3. Chương trình Hello, PaperVision3D ! .................................................................... 216 
7.4. C|c đối tượng trong PaperVision3D ...................................................................... 220 
7.4.1. C|c đối tượng hình thể ............................................................................................. 220 
7.4.2. Đối tượng Material - Phối màu cho hình thể .................................................. 228 
7.4.3. Đối tượng Lights - Hiệu ứng ánh sáng ............................................................... 232 
7.4.4. Đối tượng Shader - Hiệu ứng đổ bóng ............................................................... 233 
7.4.5. Đối tượng ShadedMaterial ..................................................................................... 233 
7.4.6. Đối tượng CompositeMaterial .............................................................................. 233 
7.4.7. Đối tượng MaterialsList ........................................................................................... 234 
7.5. Import một mô hình 3D ............................................................................................... 234 
Tổng kết chương 7 .......................................................................................................................... 236 
BÀI TẬP THỰC HÀNH .................................................................................................................... 238 
BÀI THỰC HÀNH SỐ 1 ............................................................................................................... 238 
BÀI THỰC HÀNH SỐ 2 ............................................................................................................... 239 
BÀI THỰC HÀNH SỐ 3 ............................................................................................................... 240 
BÀI THỰC HÀNH SỐ 4 ............................................................................................................... 240 
BÀI THỰC HÀNH SỐ 5 ............................................................................................................... 242 
BÀI THỰC HÀNH SỐ 6 ............................................................................................................... 243 
TÀI LIỆU THAM KHẢO THÊM .................................................................................................... 246 
- 9 - 
Blank Page 
CHƯƠNG 1. GIỚI THIỆU VỀ FLASH 
CHƯƠNG 1. GIỚI THIỆU VỀ FLASH 
1.1. Sơ lược về đồ họa vector và lịch sử ra đời của Flash 
Sơ lược về đồ họa vector 
Đồ họa máy tính được chia làm ba dạng cơ bản: 
Đồ họa điểm: cơ sở của nó l{ c|c điểm ảnh (pixel). Mỗi bức ảnh của đồ họa điểm 
là một ma trận điểm, mà mỗi điểm ảnh được x|c định bởi một mẫu màu theo 
chuẩn phổ biến là RGB (Red-Green-Blue). Mỗi tham số m{u được phân bố từ 0 
cho đến 2n -1 (ảnh dạng n bit màu). Khi phóng to bức ảnh của đồ họa điểm, bạn sẽ 
thấy rõ từng điểm ảnh. Hãy quan sát ví dụ đối với bức ảnh sau 
Hình 1 – Đồ họa điểm 
CHƯƠNG 1. GIỚI THIỆU VỀ FLASH 
- 11 - 
Đồ họa Fractal: sử dụng thuật toán đệ quy. Nếu quan t}m đến dạng đồ họa này, 
hãy tham khảo thêm trong các tài liệu liên quan đến đồ họa Fractal hay hình học 
Fractal. 
Hình 2 – Đồ họa Fractal 
Đồ họa vector: cơ sở của nó là vector và đường cong Bezier. Nó có nhiều ưu 
điểm so với đồ họa điểm. Một trong những ưu điểm lớn nhất của nó là không bị 
“vỡ hạt” khi phóng to bức ảnh. C|c chương trình đồ họa vector nổi tiếng bao gồm 
Adobe Illustrator, Corel Draw, Một bức ảnh dưới dạng đồ họa vector bao giờ 
cũng mịn m{ng hơn so với đồ họa điểm. 
Không có nhiều định dạng đồ họa điểm hỗ trợ chế độ transparent (hay chế độ 
màu alpha). Nhưng với đồ họa vector, thì những tính năng n{y được hỗ trợ một 
cách hoàn hảo. Với đồ họa vector, c|c chương trình chỉnh sửa và thiết kế đồ họa 
luôn hỗ trợ chế độ lớp Layer, nhưng với đồ họa điểm, chỉ có một v{i định dạng 
mới hỗ trợ lớp Layer n{y (như psd của photoshop). Hãy quan sát một số đối 
tượng đồ họa được tạo bởi Adobe Illus ...  gian khi IK Bone trở lại vị trí dừng của nó). Đ}y l{ một tính năng 
mới đối với công cụ này trong phiên bản Flash CS5 n{y, m{ Adobe đ~ bổ sung vào. 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 92 - 
Công cụ Bind 
Công cụ này phải dùng kết hợp với công cụ Bone. Khi sử dụng công cụ Bone trong 
trường hợp 1, ta có thể kết hợp với công cụ Bind. Với công cụ Bind, bạn có thể ép 
buộc các thanh nối phụ thuộc lẫn nhau. Khi sử dụng công cụ Bind, và bấm vào 
một thanh nối, sẽ hiện ra bốn điểm điều khiển đối với thanh nối đó (trong hình 
minh họa bên dưới, đó l{ c|c nút được đ|nh dấu vàng). 
Hình 86 – Công cụ Bind 
Tương ứng với c|c điểm điều khiển này là các viền của phần đối tượng được điều 
khiển bởi thanh nối. Để cho mỗi mối nối liên kết với một mối nối khác, ta sử dụng 
công cụ Bind, bấm chọn c|c nút điều khiển này và kéo thả vào vị trí thanh nối 
khác (thanh nối m{ c|c điểm này phụ thuộc vào). 
4.6. Công cụ Deco 
Là công cụ trang trí nghệ thuật. Với công cụ này, ta có ba hiệu ứng tùy chọn: Vine 
Fill, Grid Fill, Symmetry Brush, 3D Brush, Building Brush, Decorated Brush, Fire 
Animation, Flame Brush, Flower Brush, Lightning Brush, Particle System, Smoke 
Animation và Tree Brush. 
Hiệu ứng Vine Fill 
Tạo hiệu ứng nghệ thuật dạng cây nho. Khi bấm chọn dạng biểu tượng này, sẽ 
xuất hiện bảng thuộc tính sau 
 Leaf: biểu tượng tương ứng với biểu tượng lá. Nếu bạn muốn thay đổi, bạn 
chỉ việc nhấp vào Edit và chọn dạng symbol tương ứng. Nếu bạn muốn đổi 
màu lá, bạn nhấp vào biểu tượng Color tương ứng với Leaf. Nếu muốn sử 
dụng hình mặc định, bạn bấm chọn Default Shape. 
 Flower: ho{n to{n tương tự nhưng nó tương ứng với biểu tượng hoa. Nếu 
bạn muốn thay đổi màu hoa, bạn nhấp vào biểu tượng Color tương ứng với 
Flower. Nếu muốn sử dụng hình mặc định, bạn bấm chọn Default Shape. 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 93 - 
 Advanced Option: Branch Angle (góc xoay của các cành nho), Color (màu của 
cành nho), Pattern Scale (kéo giãn mẫu c{nh nho) v{ Segment Length (độ dài 
của các cành nho). 
 Animate Pattern: xây dựng một nhóm lên một Frame. Chức năng n{y giúp tạo 
hiệu ứng động. Bạn có thể hiệu chỉnh tốc độ nhờ vào Frame Step. 
Hình 87 – Công cụ Deco với hiệu ứng Vine Fill 
Hiệu ứng Grid Fill 
Khi bấm chọn hiệu ứng Grid Fill, trong bảng thuộc tính có các thuộc tính sau: 
 Fill: nhấp chọn edit để thay đổi biểu tượng. Bấm vào biểu tượng color để đổi 
màu cho biểu tượng. Bấm v{o Default Shape để chọn hình mặc định. 
 Advanced Options: Horizontal Spacing (khoảng cách theo chiều ngang), 
Vertical Spacing (khoảng cách theo chiều dọc) v{ Pattern Scale (độ phóng to 
của biểu tượng). 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 94 - 
Hình 88 – Công cụ Deco với hiệu ứng Grid Fill 
Hiệu ứng Symmetry Brush 
Khi bấm chọn hiệu ứng Symmetry Brush, trong bảng thuộc tính sẽ hiện ra các 
thuộc tính sau đ}y: 
Hình 89 – Công cụ Deco với hiệu ứng Symmetry Brush 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 95 - 
 Module: bấm edit để thay đổi biểu tượng. Bấm color để đổi màu cho biểu 
tượng. Chọn Default Shape để chọn hình mặc định. 
 Advanced Options: Reflect Across Line (tạo cặp điểm đối xứng qua đường 
chuẩn), Reflect Across Point (tạo cặp điểm đối tứng qua điểm chuẩn), 
Rotate Around (tạo c|c điểm dạng vòng), Grid Translation (tạo một mảng 
c|c điểm). 
 Test Collisions: cho phép tránh hiện tượng các biểu tượng va chạm vào 
nhau. 
Hiệu ứng 3D Brush 
Hiệu ứng 3D Brush được sử dụng để tạo các kiểu phối màu từ nhiều đối tượng. 
Mỗi một thao tác phun màu bằng hiệu ứng này cần sử dụng tối đa 4 đối tượng. 
Hình 90 – Công cụ Deco với hiệu ứng 3D Brush 
Với hiệu ứng n{y, c|c đối tượng sẽ được phun theo hiệu ứng 3D (đối tượng gần, 
biểu tượng xa). Để thay đổi c|c đối tượng, bạn chỉ việc nhấp vào nút Edit, và 
chọn một đối tượng kh|c để thay thế. C|c đối tượng để thay thế phải là các biểu 
tượng của Flash (movieclip, button hoặc graphic). C|c tính năng trong mục 
Drawing Effect n{y ho{n to{n tương tự trong hiệu ứng Vine và Grid. 
Trong mục Advanced Options có các tùy chọn sau đ}y: 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 96 - 
 Max objects: số lượng đối tượng được tạo cực đại trong mỗi lần phun. 
 Spray area: vùng được phun (tính theo pixel). 
 Perspective: cho phép tạo hiệu ứng phối cảnh hay không. 
 Distance scale: độ kéo giãn theo khoảng cách (độ phóng to – zoom). 
 Random scale range: Tỉ lệ kéo giãn ngẫu nhiên (bao nhiêu trong số các biểu 
tượng đó chịu t|c động của độ kéo giãn ngẫu nhiên). 
 Random rotation range: tạo các góc quay ngẫu nhiên cho các biểu tượng. 
Hiệu ứng Building Brush 
Với hiệu ứng Building Brush, bạn có thể tạo dựng các tòa nhà cao tầng. Công cụ 
này rất hữu ích trong các tác vụ muốn xây dựng một đô thị sầm uất. 
Hình 91 – Công cụ Deco với hiệu ứng Building Brush 
Trong mục Advanced Options, có hai chức năng: 
 Tùy chọn thả xuống: cho phép bạn lựa chọn các mẫu nhà cao tầng. Bạn có 4 
lựa chọn mẫu nhà cao tầng – skyscraper 1, skyscraper 2, skyscraper 3 và 
skyscraper 4. Nếu bạn muốn tạo các mẫu nhà ngẫu nhiên, bạn có thể chọn 
Radom Building. 
 Building size: kích thước (theo chiều ngang) của tòa nhà. 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 97 - 
Khi xây dựng các tòa nhà, bạn cần lưu ý: sau khi chọn công cụ Deco và chọn mẫu 
nhà, bạn hãy nhấp chuột và kéo dọc theo hướng lên phía trên. Nếu độ cao của tòa 
nh{ đ~ phù hợp, bạn thả chuột. 
Với hiệu ứng này bạn có thể dễ dàng tạo dựng các ngôi nhà cao tầng. Bạn lưu ý 
rằng, các ngôi nhà cao tầng n{y được tạo bằng cách lắp ghép các phần lại với nhau 
để tạo nên một tòa nhà hoàn chỉnh. Nếu bạn muốn tạo hiệu ứng cho một đối 
tượng ngôi nhà hoàn chỉnh, bạn cần nhóm các phần của ngôi nhà thành một đối 
tượng. 
Hiệu ứng Decorated Brush 
Với công cụ Decorated Brush, bạn có thể tạo c|c đường viền nghệ thuật theo các 
mẫu được cung cấp sẵn. 
Hình 92 – Công cụ Deco với hiệu ứng Decorated Brush 
Trong mục tùy chọn Advanced Option, bạn có 3 tùy chọn: 
 Tùy chọn thả xuống: có 20 dạng nghệ thuật đường viền cho bạn chọn lựa. 
 Pattern color: chọn m{u cho đường viền nghệ thuật. 
 Pattern size: kích thước của biểu tượng nghệ thuật. 
 Pattern width: độ rộng của biểu tượng nghệ thuật. 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 98 - 
Hiệu ứng Fire Animation 
Hiệu ứng Fire Animation sẽ tạo ra một ngọn lửa cháy sáng. Nó rất hữu dụng trong 
các tác vụ cần tạo dựng ngọn lửa. 
Đối với hiệu ứng này, mục Advanced Options có các tùy chọn sau: 
 Fire size: kích thước ngọn lửa. 
 Fire speech: tốc độ cháy của lửa. 
 Fire duration: hiệu ứng động của lửa sẽ diễn ra trong bao nhiêu frame. Bạn 
sẽ thấy đó chính l{ số keyframe hiển thị trên thanh TimeLine. Nhưng điều 
này chỉ đúng trong trường hợp tùy chọn End Animation không được chọn. 
 End Animation: ngọn lửa tàn dần (nếu được chọn), hoặc diễn tiến mãi mãi 
(nếu không được chọn). 
 Flame color: màu phía rìa ngoài của ngọn lửa. 
 Flame core color: màu của lõi ngọn lửa. 
 Fire spark: số ngọn lửa. 
Hình 93 – Công cụ Deco với hiệu ứng Fire Animation 
Thông thường, khi tạo dựng một hoạt cảnh có sử dụng đến ngọn lửa, bạn nên kết 
hợp với hiệu ứng tạo khói (Smoke Animation) mà chúng ta sẽ tìm hiểu ở phần 
tiếp theo. 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 99 - 
Hiệu ứng Flame Brush 
Hiệu ứng này giúp tạo dựng các phun màu theo hình dáng ngọn lửa. 
Trong mục Advanced Options có 2 tùy chọn: 
 Flame size: kích thước của ngọn lửa. 
 Flame color: màu của ngọn lửa. 
Hiệu ứng n{y tương đối đơn giản. Nó không có nhiều ứng dụng trong các dự án 
thiết kế phim hoạt hình. 
Hình 94 – Công cụ Deco với hiệu ứng Flame Brush 
Hiệu ứng Flower Brush 
Hiệu ứng này quả thật rất thú vị. Nhờ vào nó, chúng ta có thể tạo các cành hoa. 
Với mục Advanced Options, ta có các tùy chọn sau: 
 Tùy chọn thả xuống: cho phép bạn chọn lựa các loại hoa sau: Garden 
Flower, Rose, PoinSettia và Berry. 
 Flower color: màu cho hoa. 
 Flower size: kích thước của hoa. 
 Leaf color: màu cho lá. 
 Leaf size: kích thước của lá. 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 100 - 
Hình 95 – Công cụ Deco với hiệu ứng Flower Brush 
 Fruit color: màu của quả. 
 Tùy chọn branch: cho phép hiển thị cành cây hay không. Nếu tùy chọn này 
được kích hoạt, bạn có thể chọn hiệu ứng ngay dưới đ}y. 
 Branch color: màu của cành cây. 
Hiệu ứng Lightning Brush 
Hiệu ứng Lightining dùng để tạo c|c tia s|ng. Nó được ứng dụng trong việc tạo 
các tia sét, hoặc các hiệu ứng phóng điện khác. 
Với mục Advanced Options, bạn có các tùy chọn sau đ}y: 
 Lightning color: màu của tia sáng. 
 Lightning scale: độ kéo giãn của tia sáng. 
 Tùy chọn Animation: nếu muốn tạo hiệu ứng động cho tia sáng. 
 Beam width: độ rộng của tia sáng. 
 Complexity: độ rối (độ phức tạp) của chùm tia sáng. 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 101 - 
Hình 96 – Công cụ Deco với hiệu ứng Lightning Brush 
Hiệu ứng Particle System 
Hiệu ứng này tạo một chùm hạt được phóng ra từ một nguồn phát. Bạn sẽ thấy nó 
cũng rất hữu ích trong nhiều tác vụ: phun bong bóng nước, phun các hạt bụi. 
Hình 97 – Công cụ Deco với hiệu ứng Particle System 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 102 - 
Mục Drawing Effect có hai tùy chọn cho các loại hạt. Bạn có thể thay đổi chúng 
như đối với hiệu ứng vine, grid và 3D brush. 
Mục Advanced options có các tùy chọn sau: 
 Total length: diễn tiến h{nh động trên bao nhiêu frame. 
 Particle generation: nguồn phát các hạt sẽ diễn ra trên bao nhiêu frame. 
 Rate per frame: tốc độ trên mỗi frame. 
 Life span: mỗi một hạt sẽ có thời gian tồn tại trên bao nhiêu frame. 
 Initial speech: tốc độ khởi tạo. 
 Initial size: kích thước khởi tạo. 
 Min initial direction: góc phun nhỏ nhất. 
 Max initial direction: góc phun lớn nhất. 
 Gravity: trọng lượng của hạt. 
 Rotation rate: tốc độ quay vòng của hạt. 
Hiệu ứng Smoke Animation 
Hiệu ứng n{y tương tự với hiệu ứng Fire Animation. Nó dùng để tạo hiệu ứng bóc 
khói. Thường hiệu ứng này sử dụng kết hợp với hiệu ứng Fire Animation. 
Hình 98 – Công cụ Deco với hiệu ứng Smoke Animation 
Trong mục Advanced options có các tùy chọn sau đ}y: 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 103 - 
 Smoke size: kích thước của khói. 
 Smoke speed: tốc độ khói. 
 Smoke duration: diễn tiến của hiệu ứng khói trên bao nhiêu frame. Cũng 
tương tự Fire Animation, số keyframe trên Timeline sẽ chính là giá trị của 
Smoke duration trong trường hợp tùy chọn End Animation không được 
chọn. 
 End Animation: hiệu ứng khói bốc lên và tan biến vào không khí (nếu tùy 
chọn n{y được chọn) và không tan biến vào không khí (trong trường hợp 
tùy chọn này không được chọn). 
 Smoke color: màu của khói. 
 Background color: màu của khói khi khói dần tan vào không khí. 
Hiệu ứng Tree Brush 
Hiệu ứng này sử dụng để tạo các loại cây khác nhau. Flash cung cấp cho ta khá 
nhiều dạng c}y để sử dụng. 
Hình 99 – Công cụ Deco với hiệu ứng Tree Brush 
Trong mục Advanced options có các tùy chọn sau đ}y: 
 Tùy chọn thả xuống: cho phép bạn chọn lựa các loại cây. Flash cung cấp sẵn 
cho chúng ta 20 loại cây khác nhau. 
 Tree scale: độ kéo giãn của cây. 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 104 - 
 Branch color: màu của cành cây. 
 Leaf color: màu của lá cây. 
 Flower/Fruit color: màu của hoa hoặc quả. 
Với công cụ Deco, bạn thả sức để sáng tác các kịch bản cho c|c thước phim hoạt 
hình của bạn cũng như cho game. Dù rằng công cụ Deco n{y đ~ có trong phiên 
bản CS4, nhưng với phiên bản CS5 này, công cụ n{y đ~ ho{n thiện hơn, cung cấp 
cho ta nhiều tùy chọn hơn để sáng tác. Mục tiêu của Adobe đặt ra qua mỗi phiên 
bản l{ l{m sao để đơn giản hóa công việc thiết kế cho người dùng, để mở rộng 
phạm vi đối tượng sử dụng – không chỉ d{nh cho người dùng chuyên nghiệp mà 
còn hướng đến người dùng phổ thông. 
4.7. Công cụ 3D Translation và 3D Rotation 
Công cụ 3D Translation 
Công cụ này cho phép chúng ta có thể tạo chuyển động 3D cho đối tượng. Như ta 
đ~ thảo luận ở trên, công cụ này chỉ hoạt động đối với đối tượng được tạo Motion 
Tween. 
Ví dụ sau đ}y sẽ minh họa cho việc sử dụng công cụ 3D Translation. Trong ví dụ 
này, ta sẽ tạo một mặt phẳng và cho phép nó chuyển động trong không gian 3 
chiều. Để l{m được điều này, chúng ta sẽ thao t|c theo c|c bước sau đ}y: 
- Bước 1. Trên Layer 1, bạn hãy một hình bình hành (sử dụng công cụ hình chữ 
nhật và công cụ Free Transform) để tượng trưng cho mặt phẳng và trên Layer 2 
bạn hãy tạo một hệ tọa độ Descartes 3 chiều như hình minh họa. 
- Bước 2. Chọn hình bình hành, kích chuột phải và chọn Create Motion Tween Sau 
đó, bấm chọn công cụ 3D Translation. Bạn có thể sử dụng công cụ n{y để di chuyển 
mặt phẳng theo các chiều x (trục ngang), y (trục đứng) v{ z (điểm chấm trung 
tâm). 
- Bước 3. Để đảm bảo rằng trục tọa độ mà ta tạo tồn tại song song với các layer 
của mặt phẳng, ta hay chọn Frame trên TimeLine của nó tương ứng với Frame cuối 
cùng của TimeLine mặt phẳng. Sau đó nhấn phím F5. 
- Bước 4. Nhấn tổ hợp Ctrl+Enter để kiểm tra kết quả. 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 105 - 
Hình 100 – Công cụ 3D Translation 
Công cụ 3D Rotation 
Công cụ này cho phép chúng ta có thể xoay chuyển 3D cho đối tượng. Như ta đ~ 
thảo luận ở trên, công cụ n{y cũng chỉ hoạt động đối với đối tượng được tạo 
Motion Tween. 
Bạn thao t|c ho{n to{n tương tự ví dụ sau trên. Nhưng ở đ}y, mặt phẳng sẽ xoay 
chuyển 3D trong không gian. Để l{m được điều này, chúng ta sẽ thao tác theo các 
bước sau đ}y: 
- Bước 1. Trên Layer 1, bạn hãy một hình bình hành (sử dụng công cụ hình chữ 
nhật và công cụ Free Transform) để tượng trưng cho mặt phẳng và trên Layer 2 
bạn hãy tạo một hệ tọa độ Descartes 3 chiều như hình minh họa. 
- Bước 2. Chọn hình bình hành, kích chuột phải và chọn Create Motion Tween Sau 
đó, bấm chọn công cụ 3D Rotation. Bạn có thể sử dụng công cụ n{y để xoay chuyển 
mặt phẳng theo các chiều x (trục ngang), y (trục đứng) và z (vòng tròn bên trong) . 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 106 - 
Hình 101 – Công cụ 3D Rotation 
- Bước 3. Để đảm bảo rằng trục tọa độ mà ta tạo tồn tại song song với các layer 
của mặt phẳng, ta hay chọn Frame trên TimeLine của nó tương ứng với Frame cuối 
cùng của TimeLine mặt phẳng. Sau đó nhấn phím F5. 
- Bước 4. Nhấn tổ hợp Ctrl+Enter để kiểm tra kết quả. 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 107 - 
Tổng kết chương 4 
Trong chương n{y, chúng ta đ~ tìm hiểu cách tạo chuyển động cho c|c đối tượng. 
Ở đ}y, chúng ta đ~ cùng nhau tìm hiểu về kĩ thuật Frame by Frame, kĩ thuật 
Tween, các công cụ tạo hoạt hình như Bone, Bind, 3D, Deco. 
Kĩ thuật Frame by Frame tuy đ~ cũ, nhưng nó vẫn rất hữu ích trong nhiều tác vụ. 
Kĩ thuật Tween được chia làm ba loại: Classic Tween, Motion Tween và Shape 
Tween. Mỗi công cụ đều có những nét đặc trưng riêng. Classic Tween v{ Motion 
Tween tuy có nhiều điểm tương đồng, nhưng chúng không phải lúc n{o cũng có 
thể thay thế cho nhau: Classic Tween hỗ trợ Action Frame còn Motion Tween thì 
không; Motion Tween không cần tạo KeyFrame nên đơn giản hơn, hiệu quả hơn 
Classic Tween; Motion Tween hỗ trợ các hiệu ứng 3D còn Classic Tween thì 
không. 
Các công cụ tạo hoạt hình như Bone, Bind, 3D v{ Deco cũng rất hữu ích. Chúng có 
thể sử dụng độc lập hay kết hợp với kĩ thuật Tween. Nhờ những công cụ mới này, 
việc tạo hoạt hình cho đối tượng trở nên đơn giản hơn rất nhiều. 
CHƯƠNG 4. TẠO HOẠT CẢNH 
- 108 - 
Blank Page