BÀI 4
TẠO HỌA HÌNH CƠ BẢN
NHẮC LẠI BÀI TRƯỚC
Sử dụng symbol (biểu tượng) và Library
Làm việc với những công cụ nâng cao trong Flash
CS4:
Spray Brush
Mask
Công cụ Deco
Công cụ IK
Sử dụng symbol (biểu tượng) và Library
Làm việc với những công cụ nâng cao trong Flash
CS4:
Spray Brush
Mask
Công cụ Deco
Công cụ IK
Slide 4 - Tạo hoạt hình cơ bản 2
MỤC TIÊU BÀI HỌC
Làm việc với frame, keyframe và Timeline
Các kỹ thuật tạo chuyển động:
Motion Tween
Shape tween
Chuyển động Tween cổ điển
Chỉnh sửa chuyển động với bảng Motion Editor
Motion Guide layer
Tùy chỉnh hoạt cảnh với Onion Skin
Làm việc với frame, keyframe và Timeline
Các kỹ thuật tạo chuyển động:
Motion Tween
Shape tween

Chuyển động Tween cổ điển
Chỉnh sửa chuyển động với bảng Motion Editor
Motion Guide layer
Tùy chỉnh hoạt cảnh với Onion Skin
Slide 4 - Tạo hoạt hình cơ bản 3
LÀM VIỆC VỚI FRAME, KEYFRAME VÀ TIMELINE
FRAME, KEYFRAME VÀ TIMELINE
Bảng Timeline bao gồm 3 phần chính:
Layer
Frame
keyframe
Slide 4 - Tạo hoạt hình cơ bản 5
FRAME, KEYFRAME VÀ TIMELINE
Layer:
Cho phép xếp chồng và tổ chức hình vẽ
Cho phép điều khiển các phần tử trong dự án
Flash cung cấp các layer đặc biệt: layer tweening
(layer tạo hoạt hình tự động), layer mask (lớp mặt
nạ), IK (Inverse Kinematics)
Frame:
Là nơi biểu diễn thời gian, dựa vào tỷ lệ khung hình/
giây
Được hiển thị bởi các ô nhỏ đi ngang qua layer
Tỷ lệ khung hình/ giây mặc định 24fps (frame per
second)
Layer:
Cho phép xếp chồng và tổ chức hình vẽ
Cho phép điều khiển các phần tử trong dự án
Flash cung cấp các layer đặc biệt: layer tweening
(layer tạo hoạt hình tự động), layer mask (lớp mặt

nạ), IK (Inverse Kinematics)
Frame:
Là nơi biểu diễn thời gian, dựa vào tỷ lệ khung hình/
giây
Được hiển thị bởi các ô nhỏ đi ngang qua layer
Tỷ lệ khung hình/ giây mặc định 24fps (frame per
second)
Slide 4 - Tạo hoạt hình cơ bản 6
FRAME, KEYFRAME VÀ TIMELINE
Key frame:
Là nơi đặt đối tượng hoặc thời điểm bắt đầu/ kết thúc
một hành động trên Timeline
Một keyframe có thể kéo dài tùy thuộc vào thời gian
muốn nội dung của keyframe đó được hiển thị
Theo mặc định, mỗi layer mới trong Timeline chứa
một keyframe tại frame 1
Key frame:
Là nơi đặt đối tượng hoặc thời điểm bắt đầu/ kết thúc
một hành động trên Timeline
Một keyframe có thể kéo dài tùy thuộc vào thời gian
muốn nội dung của keyframe đó được hiển thị
Theo mặc định, mỗi layer mới trong Timeline chứa
một keyframe tại frame 1
Slide 4 - Tạo hoạt hình cơ bản 7
FRAME, KEYFRAME VÀ TIMELINE
Chọn frame thứ 15 trên Timeline
Nhấn chuột phải (Windows) chọn Insert Keyframe
Hoặc lựa chọn keyframe thứ 15, nhấn F7
Slide 4 - Tạo hoạt hình cơ bản 8
KỸ THUẬT TẠO CHUYỂN ĐỘNG

MOTION TWEEN
Cơ chế tạo chuyển động trong Flash: khai báo vị trí
bắt đầu và kết thúc của đối tượng trên Stage
3 kiểu chuyển động trong Flash:
Motion tween
Shape tween
Classic tween
Cơ chế tạo chuyển động trong Flash: khai báo vị trí
bắt đầu và kết thúc của đối tượng trên Stage
3 kiểu chuyển động trong Flash:
Motion tween
Shape tween
Classic tween
Slide 4 - Tạo hoạt hình cơ bản 10
MOTION TWEEN
Motion tween
-Là chuyển động trên một symbol instance
-Bao gồm: thay đổi về vị trí, kích thước, hiệu ứng màu, hiệu ứng lọc
-Để tạo Motion Tween:
-Nhấn chuột phải (Windows) lên một keyframe chứa symbol instance
-Chọn menu Create Motion Tween
Slide 4 - Tạo hoạt hình cơ bản 11
MOTION TWEEN
Thực hiện với file fl0602.fla
Tạo motion tween cho layer Airplane
Một chuyển động với 24 frame được tạo ra trong
layer này
Thực hiện với file fl0602.fla
Tạo motion tween cho layer Airplane
Một chuyển động với 24 frame được tạo ra trong

layer này
Slide 4 - Tạo hoạt hình cơ bản 12
MOTION TWEEN
Di chuyển hình vẽ máy bay tới vị trí chính giữa tại
frame 15 trên Timeline
Nhấn và kéo playhead tới frame 15
Trên Stage: kéo hình máy bay đến vị trí chính giữa
1 đường thẳng xuất hiện trên Stage biểu thị cho quỹ
đạo chuyển động của hình vẽ chiếc máy bay-đường
thẳng này được gọi motion path
Di chuyển hình vẽ máy bay tới vị trí chính giữa tại
frame 15 trên Timeline
Nhấn và kéo playhead tới frame 15
Trên Stage: kéo hình máy bay đến vị trí chính giữa
1 đường thẳng xuất hiện trên Stage biểu thị cho quỹ
đạo chuyển động của hình vẽ chiếc máy bay-đường
thẳng này được gọi motion path
Slide 4 - Tạo hoạt hình cơ bản 13
MOTION TWEEN
Slide 4 - Tạo hoạt hình cơ bản 14
MOTION TWEEN
Tiếp theo: di chuyển vị trí máy bay từ điểm giữa tới
điểm cuối cùng
Trên Timeline: nhấn và kéo frame cuối tới frame 30
 mở rộng thời gian chuyển động
Tiếp theo: di chuyển vị trí máy bay từ điểm giữa tới
điểm cuối cùng
Trên Timeline: nhấn và kéo frame cuối tới frame 30
 mở rộng thời gian chuyển động
Slide 4 - Tạo hoạt hình cơ bản 15

MOTION TWEEN
Nhấn chọn frame 30
Trên Stage: kéo hình vẽ máy bay tới điểm cuối
Nhấn Enter (Windows) để xem kết quả ngay trên
Stage
Nhấn Ctrl + Enter (Windows) để xem kết quả trên
cửa sổ riêng (Control > Test Movie)
Nhấn chọn frame 30
Trên Stage: kéo hình vẽ máy bay tới điểm cuối
Nhấn Enter (Windows) để xem kết quả ngay trên
Stage
Nhấn Ctrl + Enter (Windows) để xem kết quả trên
cửa sổ riêng (Control > Test Movie)
Slide 4 - Tạo hoạt hình cơ bản 16
MOTION TWEEN
Quy tắc tạo Motion tween
-Độ dài của một tween span theo mặc định bằng tỷ lệ khung hình/ giây
-Các thành phần (bitmap, văn bản, hình vẽ …) phải được chuyển đổi thành dạng
symbol
-Chỉ có symbol hoặc hình vẽ mới có thể tạo được chuyển động đồng thời
-Các tween span có thể chứa những sự thay đổi: về vị trí, kích thước, hiệu ứng màu,
hiệu ứng lọc
-Độ dài của một tween span theo mặc định bằng tỷ lệ khung hình/ giây
-Các thành phần (bitmap, văn bản, hình vẽ …) phải được chuyển đổi thành dạng
symbol
-Chỉ có symbol hoặc hình vẽ mới có thể tạo được chuyển động đồng thời
-Các tween span có thể chứa những sự thay đổi: về vị trí, kích thước, hiệu ứng màu,
hiệu ứng lọc
Slide 4 - Tạo hoạt hình cơ bản 17
MOTION TWEEN

Để tạo chuyển động cho nhiều hình vẽ: đặt từng
hình vẽ lên từng layer khác nhau
Mỗi thành phần khi được tạo chuyển động sẽ cần
có:
Tween span
Layer tween
Để tạo chuyển động cho nhiều hình vẽ: đặt từng
hình vẽ lên từng layer khác nhau
Mỗi thành phần khi được tạo chuyển động sẽ cần
có:
Tween span
Layer tween
Slide 4 - Tạo hoạt hình cơ bản 18
SHAPE TWEEN
Là kỹ thuật của vẽ hình
Không làm việc với những symbol instance
Yêu cầu phải tạo ra 2 keyframe để chứa nội dung
bắt đầu và nội dung kết thúc
Không có motion path  chuyển động tịnh tiến
Không sử dụng được bảng Motion Editor để chỉnh
sửa
Đặt từng thành phần khởi tạo lên từng layer khác
nhau, và tương đồng nhau
Là kỹ thuật của vẽ hình
Không làm việc với những symbol instance
Yêu cầu phải tạo ra 2 keyframe để chứa nội dung
bắt đầu và nội dung kết thúc
Không có motion path  chuyển động tịnh tiến
Không sử dụng được bảng Motion Editor để chỉnh
sửa

Đặt từng thành phần khởi tạo lên từng layer khác
nhau, và tương đồng nhau
Slide 4 - Tạo hoạt hình cơ bản 19
SHAPE TWEEN
Tạo layer mới có tên Shape Morph trên bảng
Timeline
Kéo playhead về frame 1
Kéo symbol Moon & Bird trong bảng Library ra ngoài
Stage
Chuyển đổi symbol thành artwork: Modify > Break
Apart
Tại frame 1: Nhấn chuột phải chọn Create Shape
Tween
Nhấn Enter để xem chuyển động
Tạo layer mới có tên Shape Morph trên bảng
Timeline
Kéo playhead về frame 1
Kéo symbol Moon & Bird trong bảng Library ra ngoài
Stage
Chuyển đổi symbol thành artwork: Modify > Break
Apart
Tại frame 1: Nhấn chuột phải chọn Create Shape
Tween
Nhấn Enter để xem chuyển động
Slide 4 - Tạo hoạt hình cơ bản 20
SHAPE TWEEN
Slide 4 - Tạo hoạt hình cơ bản 21
TWEEN CỔ ĐIỂN (CLASSIC TWEEN)
Chỉ sử dụng được với symbol instance
Là chuyển động xuất hiện từ những phiên bản trước

của Flash (Flash MX, Flash 8, Flash CS3)
Ở cả 2 keyframe (bắt đầu, kết thúc): sử dụng cùng
1 symbol instance
Chỉ có một đối tượng có thể tạo chuyển động tự
động tại thời điểm xác định trên layer
Thêm được hiệu ứng ( kích thước, chuyển động,
màu sắc, độ trong suốt, …) cho chuyển động cổ
điển
Chỉ sử dụng được với symbol instance
Là chuyển động xuất hiện từ những phiên bản trước
của Flash (Flash MX, Flash 8, Flash CS3)
Ở cả 2 keyframe (bắt đầu, kết thúc): sử dụng cùng
1 symbol instance
Chỉ có một đối tượng có thể tạo chuyển động tự
động tại thời điểm xác định trên layer
Thêm được hiệu ứng ( kích thước, chuyển động,
màu sắc, độ trong suốt, …) cho chuyển động cổ
điển
Slide 4 - Tạo hoạt hình cơ bản 22
TWEEN CỔ ĐIỂN (CLASSIC TWEEN)
Tạo thêm layer Classic Tween trong Timeline
Kéo symbol Cloud từ bảng Library ra Stage
Slide 4 - Tạo hoạt hình cơ bản 23
TWEEN CỔ ĐIỂN (CLASSIC TWEEN)
Chọn frame 30 trên Timeline, nhấn F6
Tại frame 30: kéo vị trí đám mây về bên trái
Slide 4 - Tạo hoạt hình cơ bản 24
TWEEN CỔ ĐIỂN (CLASSIC TWEEN)
Tạo Motion Guide: mục đích để tạo ra đường căn
cho chuyển động

Tạo thêm layer Motion Guide trong bảng Timeline
Chọn công cụ Pencil ( ) và vẽ trong chế độ Object
Drawing
Slide 4 - Tạo hoạt hình cơ bản 25