Cách tạo ra các ảnh chuyển động animation
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (1.41 MB, 32 trang )
GIÁO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYấT - Tự HỌC MACROMEDIA FLASH 5.0 BANG HÌNH ẢNH
-t a
m
CHƯƠNG 9
s'
CÁCH TẠO RA CÁC ẢNH
CHUYỂN ĐỘNG ANIMATION
TỔNG QUAN VỀ CÁCH TẠO RA CÁC ANIMATION
Bạn tạo ra các Animation bằng cách thay đổi nội dung của frame liên tiếp nhau. Bạn có
thể tạo đối tượng di chuyển ngang qua vùng Stage, thay đổi kích thước, hướng xoay, màu sắc,
hình dạng và cách làm cho đối tượng vào hay ra mờ dần (Fade In hay Fade Out). Những thay
đổi này có thể xảy ra độc lập nhau hoặc kết hợp với những sự thay đổi khác. Ví dụ, bạn có thể
tạo cho đối tượng xoay và khi nó di chuyển vào ngang qua vùng Stage mờ dần.
Có hai cách để tạo ra một đối tượng Animation chuyển động liên tiếp trong Flash:
chuyển động Animation theo frame-by-frame và Tweened Animation. Trong cách chuyển động
Animation theo frame-by-frame, bạn phải tạo ra ảnh toong mỗi frame. Trong cách chuyển động
theo Tweened Animation, bạn có thể tạo ra frame bắt đầu và frame kết thúc và cho phép Flash
tạo ra nhiều frame trong khoảng giữa frame đầu và frame cuối này. Flash thay đổi kích thước,
hướng xoay, màu sắc hoặc các thuộc tính khấc ngang nhau giữa frame đầu và frame cuối để tạo
ra ảnh thay đổi chuyển động về hình dáng.
Cách chuyển động theo Tweened Animation là một cách có hiệu quả để tạo ra ảnh
chuyển động và thay đổi liên tục trong khi đó kích thước file rất nhỏ. Trong cách chuyển động
Tweened Animation này, Flash chỉ lưu lại các giá tộ thay đổi giữa các frame. Trong cách
chuyển động Animation theo frame-by-frame, Flash lưu lại các giá tri cho mỗi frame kết thúc.
Để biết thêm cách hướng dẫn tạo ra ảnh chuyển động Animation này, bạn hãy tham
k h ả o t h ê m t à i l i ệ u “ GIÁO TRÌNH THIẾT KẾ WEB : PHAN THựC
hành
- T ự HỌC MACROMEDIA FLASH 5.0
BẰNG HÌNH ẢNH” c ù n g t á c g iả .
Chủ V : Ngoài ra bạn cũng có thể tạo ảnh chuyển động Animation bằng cách dùng Set Property
action. Bạn có thể xem mục ActionScript Help để biết thêm chi tiết.
CÁCH TẠO RA CÁC KEYFRAME
Một keyframe là một frame mà nơi đó bạn thay đổi quá trình chuyển động Animation.
Khi bạn tạo ra ảnh chuyển động Animation theo cách frame-by-frame, mỗi frame là một
keyframe. Trong keyframe chuyển động theo cách Tweened Animation, bạn phải xác định tại
những điểm quan trọng trong quá trình chuyển động và cho phép Flash tạo ra nội dung giữa các
frame. Flash hiển thị các frame bổ sung của chế độ Tweened Animation như các màu xanh
nhạt, xanh đậm có mũi tên vẽ giữa các keyframe. Flash sẽ vẽ lại hình dáng của đối tượng trong
mỗi keyframe. Bạn chỉ nên tạo ra các keyframe tại những điểm đó toong ảnh thay đổi.
Các Keyframe được xác định trong thanh thước Timeline : một keyframe có một vòng
tròn đặt trên đó cho biết keyframe đó đang chứa dữ liệu và một keyframe trống thể hiện một
đường thẳng đứng trước một frame. Các frame thêm vào sau đó trên cùng một layer sẽ có cùng
một dữ liệu như keyframe.
TỦ SÁCH STK - THẾ GIỚI Đồ HỌA
191
BIÊN SOẠN: KS PHẠM QUANG HUY
GIÁO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BANG HĨNH ẢNH
r
1
»
Layer 2
- lJ
*
1
a
□
1
*
D
-»
CHƯƠNG 9
\ r-
“f 5
20
I/ ^
1Ị
Keyframe có chứa dữ liệu
V
10
*
• 4¥ m
15
2 0
-
\k
Static
Keyframe trong
□ Cách tạo ra một keyframe, bạn có thể chọn một trong những bước sau đây:
•
Chọn một frame trong thanh thước Timeline và chọn trên tành đơn Insert >
Keyframe.
•
Nhấp phải chuột (trong Windows) hoặc nhấp Control (trong Macintosh) tại một
frame trong thanh thước Timeline và chọn lệnh Insert Keyframe có trong trình
đơn.
Ú
25
30
\r
C ie đ te M o tio n T w e e n
In se rt Frame
Remove Flames
I M
S
ifli
In se rt B la n k K eyliam
epliame
e
C leai K.ẹyfi
CÁC BIỂU TƯỢNG CHUYỂN ĐỘNG ANIMATION TRÊN THANH THƯỚC TIMELINE
Flash phân biệt chế độ chuyển động Tweened Animation với chế độ chuyển động
frame-by-frame trong thanh thước Timeline như sau:
■ Các keyframe chuyển động theo chế độ Tweening là Motion được xác định bằng
dấu chấm đen và các frame Tween ở giữa liên tục và hai đầu cổ mũi tên màu đen
cùng với nền Background có màu xanh nhạt.
Các Keyframe chuyển động theo chế độ Tweening là Shape được xác định bằng
dấu chấm đen và các frame Tween ở giữa liên tục và hai đầu cổ mũi tên màu đen
cùng với nền Background có màu xanh lá cây. ----TỦ SÁCH STK - THẾ GIỚI Đồ HỌA
192
—
BIÊN SOẠN: KS PHẠM QUANG HUY
GIÁO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BANG HĨNH ẢNH
CHƯƠNG 9
Một đường gạch cho biết các keyframe cuối cùng đang bị thiếu.
Một keyframe đơn độc được xác định bằng một dấu chấm đen. Các frame có màu
xám sáng sau một keyframe có chứa cùng dữ liệu và cổ một đường màu đen, một
hình chữ nhật nhỏ rỗng ở frame cuối cùng. -----------Một chữ a nhỏ chỉ ra rằng frame đổ đã được gán một Action (hành động) trong
bảng Actions.
Một lá cờ màu đỏ cho biết frame đó có lời chú thích và frame đó có tên.
I* animation
CÁC LAYER TRONG ANIMATION
Mỗi Scene trong Flash movie có thể gồm có nhiều Layer. Khi bạn tạo ảnh chuyển động,
bạn dùng các Layer để sắp xếp các thành phần của một trình tự chuyển động và tách biệt các
đối tượng chuyển động vì vậy chúng không xoá, kết nối hoặc phân rã lẫn nhau. Nếu bạn làm
Flash chuyển động nhiều nhóm hoặc các Symbol cùng lúc, mỗi đối tượng phải ở trên từng
Layer độc lập. Đặc biệt, Layer Background là một ảnh tĩnh, các Layer bổ sung chỉ chứa một đối
tượng chuyển động độc lập với nhau.
Các Layer xuất hiện thành hàng trong thanh thước Timeline
Khi một đoạn phim có nhiều Layer, Track và hiệu chỉnh các đối tượng trong một hay
nhiều Layer trở nên rất khó khăn. Công việc này trở nên dễ dàng nếu bạn làm việc với trên
một dữ liệu trong từng Layer tại lúc nào đó.
TỐC ĐỘ FRAME
Một tốc độ frame quá chậm có thể làm cho ảnh chuyển động không liên tục. Đối với tốc
độ frame quá nhanh có thể làm mờ chi tiết chuyển động. Một tốc độ frame 12 frame trên một
giây (fps) thường cho kết quả tốt nhất khi xuất đoạn phim trên trang Web. Đoạn phim
QuickTime và AVI movies có một tốc độ chung là 12 fps trong khi đó tốc độ ảnh chuyển động
chuẩn là 24 fps. Độ chuyển động phức tạp và tốc độ của máy tính đều ảnh hưởng đến tốc độ
phát lại của đoạn phim. Kiểm tra đoạn phim chuyển động của bạn trên nhiều máy khác nhau để
xác định tốc độ tối ưu cho các frame.
Vì bạn chỉ xấc định một tốc độ frame cho toàn đoạn phim Flash Movie, đó là một cách
thiết lập tì lệ tốt nhất trước khi bạn bắt đầu tạo ra ảnh chuyển động.
MỞ RỘNG ẢNH
Khi bạn tạo ra một ảnh nền Background chuyển động, điều đó rất cần thiết cho việc tạo
ra một ảnh tĩnh trong nhiều frame. Việc thêm vào các frame mới (không phải là keyframe) vào
một Layer sẽ làm tăng kích thước dữ liệu của frame cuối trong tất cả cấc frame mới.
TỦ SÁCH STK - THẾ GIỚI Đồ HỌA
193
BIÊN SOẠN: KS PHẠM QUANG HUY
GIÁO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BANG HĨNH ẢNH
CHƯƠNG 9
> Mở rộng ảnh trong nhiều frame:
K
1. Tạo một ảnh toong keyframe đầu tiên của đoạn
phim.
1
5
"bo '
K .1
2. Chọn một frame bên phải, tại vị trí frame cuối mà
l
b ạ n m u ố n th ê m v ào .
3. Chọn trình đơn Insert > Frame.
> Dùng một Shortcut để mở rộng ảnh:
4. Tạo một ảnh trong keyframe đầu tiên.
5. Nhấn phím Alt và nhấp chuột vào keyframe sang phải. Điều này sẽ tạo ra một
vùng mở rộng mới mà không cần một keyframe mới tại điểm cuối.
TỔNG QUAN VỀ CHẾ ĐỘ CHUYEN đ ộ n g TWEENED ANIMATION
Flash có thể tạo ra 2 loại chuyển động của Tweened Animation.
■ Chế độ Motion Tweening, bạn phải xác định các thuộc tính như vị trí, kích thước
và hướng xoay cho một Instance, Group hoặc khối ký tự tại một điểm và sau đó
bạn thay đổi các thuộc tính này tại một điểm khác.
■ Chế độ Shape Tweening, bạn phải vẽ đối tượng tại một điểm và sau đó bạn thay
đổi hình dạng hoặc vẽ một đối tượng khác tại một điểm khác. Flash sẽ thêm vào
các giá trị hoặc hình dạng cho các frame giữa, tạo ra chuyển động.
TẠO CHUYỂN ĐỘNG (TWEEN) CHO CÁC INSTANCE, NHÓM (GROUP) VÀ KÝ Tự
(TYPE)
Để làm thay đổi các thuộc tính của các Instance, nhóm và ký tự, bạn sử dụng chế độ
chuyển động Motion Tweening. Flash có thể thay đổi vị trí, kích thước, hướng xoay và kéo xiên
các Instance, nhóm hoặc ký tự. Ngoài ra, Flash có thể thay đổi màu của Instance và ký tự, tạo
ra sự chuyển đổi màu từ từ hoặc tạo ra một Instance ở chế độ vào hoặc ra mờ dần.
Để thay đổi màu của các nhóm hoặc ký tự, bạn phải tạo cho chúng trở thành các
Symbol. Bạn có thể xem mục “Cách tạo ra các Symbol” để biết thêm chi tiết.
Nếu bạn thay đổi số frame giữa hai keyframe hoặc di chuyển nhóm hoặc Symbol trong
keyframe, Flash sẽ tự động tween các frame này một lần nữa.
□
Bạn cố thể tạo ra chế độ chuyển động Motion Tweening dùng một trong hai cách sau:
■ Cách Thứ N h ấ t: Tạo ra keyframe đầu và
keyframe kết thúc cho quá trình chuyển
động và dùng tùy chọn Motion trong mục
Tweening từ bảng Frame Properties.
I
Flame
m
f i 3 ln s tl Ỉ G F l a m e ] Ị j j < f S o u |T jE F (e< j ( ? )
1
1 T w e e n in g :| M o tio n
E a s in g : |o
’ 1
^ 1 III
1
I 'r f r K .
O lie n tto p a th
S y n c h ro n iz e | 7
194
S c-ìle
-rj
R o t a t e : ! A u to
O p tio n s ; Ị-
TỦ SÁCH STK - THẾ GIỚI Đồ HỌA
J
Label: I ”
Snap
J
BIÊN SOẠN: KS PHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
■ Cách Thứ Hai ỉ Tạo ra keyframe chuyển động đầu tiên và sau đổ chọn trên trình
đơn Insert > Create Motion Tween và di chuyển đối tượng đến vị trí mới trong
vùng. Rash sẽ tự động tạo ra keyframe kết thúc.
Khỉ thay đổi vị trí, bạn cố thể tạo cho đối tượng di chuyển dọc theo một đường dẫn phỉ
tuyến (Nonlinear Path).
Ảnh ví dọ con ong tại frame thứ hai, ba và thứ tư là kết quả chuyển động từ key&ame đầu
đến keyframe cuối cùng
□ Tạo một ảnh chuyển động Motion Tween dùng tùy chọn Motion trong mục Tweening:
1. Nhấp chuột vào tên của Layer để kích hoạt nố ưở thành Layer hiện hành và sau đố
chọn một Keyframe trống trong Layer nơi bạn muốn tạo vùng chuyển động bắt đầu.
1—1
31 s □ 1
.j f l EI
1
IK
IUa BsiiM 1
0©
©
II
r 1—1-1 1
11
ỉ I □! n * |
2. Tạo một Instance, nhóm hay một khối ký tự trong vùng Stage hoặc kểo một Instance
của một Symbol trong cửa sổ thư viện Library. Để chuyển động đối tượng đã vẽ, bạn
phải chuyển đổi đối tượng đó trở thành một Symbol.
3. Tạo keyframe thứ hai (keyframe kết thúc), nơi bạn muấn vùng chuyển động kết thúc
bằng cách dùng chuột nhấp vào xác định vị trí frame cuối cùng. Sau đó bạn nhấp
phải chuột chọn lệnh Insert Blank Keyframe có trong trình đơn để thêm vào các
keyframe trống cho đoạn phim.
5
10
15
20
25
30
35
40
J —LJL-LJL- LJL-LJL-I—UJLJ-JL
ũ? Layer 1
□
■
0 Jj
C re a te M o tio n T w e e n
Xác định vị
frame cuối
ỉn s e it Fram e
R em o v e Fram es
'□ [ □ I jo ]
|l2-0
In se ll Key flam e
In se it B lank K eyiiam e
Cl&ar Kejiliam e
Chọn lệnh Insert Blank Keyframe
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
195
BIÊN SOẠN: KS PHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
ạ* a
V ' ' 5' 1
□
LJ
1C
1 •
U) Layer 1
*
•
ị
ũl
¡1
□
m
S Ẽ ?
-.5
ỉ 1
Lầm
* 1 i-]|f 20 [ĨM ÍPS
Sau khi chọn lệnh Insert Blank Keyframe
4. Sau đố bạn nhấp chuột vào keyframe thứ nhất. Tại đây bạn cố thể thực hiện một
trong những bước sau để thay đổi Instance, Group hoặc khối ký tự tại frame cuối
cùng:
■ Di chuyển đối tượng đến vị trí mới.
■ Thay đổi kích thước, hướng xoay hoặc kéo xiên đối tượng.
■ Thay đổi màu sắc của đối tượng (chỉ có Instance hoặc khối ký tợ).
■ Để thay đổi màu sắc của các thành phần khác ngoài Instance hoặc khếi ký tự,
bạn phải dùng chế độ chuyển động Shape Tweening.
5. Chọn trình đơn Window > Panels > Frame để xuất hiện bảng Frame.
6. Đối với mục Tweening, chọn Motion.
Sau khi bạn chọn lệnh Motion
trong mục Tweening, trên thanh
thước Timeline xuất hiện các
đường gạch trên keyframe
151 j lr' gt-j ~ i^J Fiam e| ' [ j f f i S c u p CJ E(fe<| !. j )
©©
L d tip l:
( ý - lc u h
T'#«riirig;j Motiori
3 w Seal*
Easing:|o ”
Rotate: | Au(0 ~T3 F “ rims«
O p t i o n s : J”
if ”
O rie n t t o
p a th
Synchronise
Snap
7. Nếu bạn muốn thay đổi kích thước của đối tượng như trong bước 4, bạn hãy chọn
lệnh Scale trong trình đơn Modify > Transform để thay đổi kích thước của đối tượng
đã chọn.
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
196
BIÊN SOẠN: KSPHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
8. Nhấp chuột vào kéo các phím mũi tên kế tiếp chọn giá trị trong mục Easing hoặc
nhập vào giá tậ để hiệu chỉnh tỉ lệ thay đổi giữa các frame chuyển động như:
JÚ
F ía m e
1
[S Q in stiỊE Q Fr
SouỊ i 7 ] EFFecj! Ỷ
Ir
Label; 1“
T weening: 1 Moti
Easing: |ij
s í
''
R otate: ị Auto
Options;
O
F
" 1
Seal*
<
^
| ~
,¡™
co p-ath
3 ị, _ _ ronize
Snap
■ Khi bắt đầu chuyển động tốc độ chầm chậm sau đó tãng tốc hướng về phía
kết thúc chuyển động, kéo con trượt lến hoặc nhập vào giá trị từ -1 đến -100.
■ Khi bắt đầu, chuyển động có tốc độ rất nhanh sau đố giảm tốc chuyển động
hướng về điểm kết thức chuyển động, kéo con trượt xuếng hoặc nhập vào giá
trị dương từ 1 đến 100.
■ Theo mặc định, tấc độ thay đổi giữa các frame liên tục. Mục Easing tạo ra
hình dạng đếi tượng xuất hiện nhỏ dần hoặc lớn dần bằng cách hiệu chỉnh tấc
độ thaỵ đổi của chứng.
9. Để xoay các đấi tượng được chọn trong khi chuyển động, bạn cố thể chọn một tùy
chọn trong trình đơn Rotate:
■ Chọn None (chế độ thiết lập mặc định)
không ứng dụng chế độ xoay cho đấỉ
tượng.
F ra m e
0
f s Q l n s c } ; Q F ra m e ! B £ s o u [ ¡ G e M
L abel:
■ Chọn Auto xoay đối tượng chuyển động ít
nhất một lần theo hướng xác định.
▼1
|7
S c a le
r
E a s in g :
R o t a te : 1A u to
□ p lio n s :
i
►
n
T w ee n in g : 1M o tio n
■ Trong mục Rotate chọn Clockwise (CW)
hay Counterclockwise (CCW) để xoay đối
tượng theo hướng được xác định và sau đố
nhập vào gổc độ xoay.
®
_V ]
lo
t im e s
ïHSŒÜIt'l th
A u t o ..............H i
cw
DCV
_ J
¡7
S nap
Chủ V : Hướng xoay này thêm vào bất kỳ hướng xoay nào bạn ứng dụng vào frame cuối cùng
trong bước 4.
10. Nếu bạn đang dừng một đường dẫn chuyển động (Motion Path), chọn mục Orient to
Path để đinh hướng đường biên chuyển động vào đường Motion Path.
F ram e
B Í
i S G l n s l ĩ * 2 FramefkJili: S a u [ ỉ£ ] Eítecị
□
L-ãbel. Ị
1 Tweenirg:| M otion
1
JN1
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
Scale
Easing: |ij
R otate: 1Auto
^ O p tio n s; [ 7
1
T 1 |7
ỊÕ
tirris-j
p iie n f l CO p a th !
[ 7 Bjrtchrortise Is? Snap
197
J
BIÊN SOẠN: KSPHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
11. Chọn mục Synchronization để đảm bảo Instance diễn hoạt lặp đi lặp lại đứng trong
đoạn phim. Dùng lệnh Synchronize nếu so frame quá trình chuyển động bên ưong
Symbol thậm chí không nhiều hơn sấ frame mà Instance Graphic giữ trong đoạn
phim.
12. Nếu bạn đang dùng một đường Motion Path, chọn Snap để gắn các thành phần
chuyển động vào đường Motion Path theo điểm khai báo (Registration Point).
13. Cuối cùng nhấp chuột vào keyframe cuối cùng vào kéo đối tượng đến vị trí xác định
điểm dừng chuyển động để tạo ra đường Motion Tween. Bạn cố thể xem ví dụ như
hình bên dưới.
1
©
E
D ? Layer 1
©
la
« s
ã
□
*
*
□
m
i?
1
I- I
*
t
>
ĩ
ì
i
15
\ l
ị
'■ I
ị
I
□
Layer 1
C
10
5
>
&
1
h
5
í
1 } 1 m
1ũ
15
' T 35
\
f
n | % \ [■ :!
" ] ã ' / \ 25 ' ' ' 30
13 112.0 fps I 1.5s
i]
-------------------------------►
(^
I tụ h ,
14. Đối tượng đã tạo xong và bạn cố thể nhấn phím Enter để diễn hoạt đoạn phim vừa
tạo. Lúc này bạn sẽ thấy ký tự “Flash” sẽ chuyển động từ trái sang phải.
Đoạn phim đang diễn hoạt
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
198
BIÊN SOẠN: KSPHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB ; PHAN LỶ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h ả n h ________ CHƯƠNG 9
□ Tạo một Motion Tween dùng lệnh Create Motion Tween:
1. Chọn một keyframe trống và vẽ đối tượng
trong vùng Stage hoặc kéo một Instance của
một Symbol trong cửa sổ Library. Nếu vẽ một
Instance thì sau khỉ vẽ phải chọn tất cả đối
tượng đố.
2. Chọn trình đơn Insert > Create Motion Tween.
Nếu bạn vẽ một đối tượng trong bước một, Hash sẽ tự động chuyển đổi đối tượng
thành một Symbol và gán nó với tến là Tween 1. Nếu bạn vẽ nhiều đối tượng, các
đối tượng thêm vào cổ các tên là Tween2, Tween3 và v.v. Bây giờ bạn sẽ thấy xuất
hiện dấu cộng trên đối tượng. Đố là điểm khai báo cho Motion Tween.
11
12.0 Fps
'
G
te
Đối tượng trước và sau khỉ chọn lệnh Create Motion Tween
3. Nhấp chuột vào số frame mà bạn muốn vùng chuyển động kết thức và chọn trên
trình đơn Insert > Frame. Sau đố nhấp chuột phải chọn lệnh Insert Keyframe cố
trong txình đơn xổ xuống. Lúc này bạn sẽ thấy đường Motion Tween xuất hiện.
m
ã
1
n
tó
ir
2fi
»
Ịjj
an
*
40
C r e a t e M o tio n T w e e n
/
z
I
1
\
\ l n s e r t F ram e
R e n o v e F ram e s
S B
'— ■■■■■
□
- W
/
W S................................................
S H M C lP
In s e rt K ey fram e
k
In s ftrt B la n k IC e y fiS n e
C l e j i K e ji f r a m e
Î
]
S c h ü l A ll
C u l F la m e s
C opy F ram e s
P a s t e F la m e ?
Chọn lệnh Insert Keyframe trong trình đơn sễ thấy xuất hiện đường Motion Tween
TỦ SẨCM STK - THẾ g iớ i Đ ồ HỌA
199
BIÊN SOẠN : KS PHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
4. Di chuyển đối tượng Instance hoặc khối ký tợ trong vùng Stage đến vị trí frame cuối
cùng mong muến. Hiệu chỉnh kích thước của cắc đấi tượng nếu bạn muến chứng
chuyển động thay đổi kích thước của nó. Hiệu chinh hướng xoay nếu bạn muốn nó
chuyển động xoay. Bỗ chọn đấỉ tượng khỉ bạn đã hiệu chỉnh xonr
m J j lĩĩ%1 ® [M]]~ặõ~irĩEõFp7
*
5. Nhấp chuột vào keyframe cuối của quá trình chuyển động Motion Tween và chọn
trên trình đơn Window> Panels > Frame. Chế độ Motion Tweemng sẽ được chọn
một cách tự động trong bảng Frame.
6. Nếu bạn muấn thay đổi kích thước của đối tượng giếng như trong bước 4, bạn hãy
chọn lệnh Scale trong trình đơn Modffy > Transform.
7. Nhấp chuột và kểo vào mũi tên để chọn giá trị bên cạnh mục £asing hoặc nhập giá
trị vào để thaỵ đổi tốc độ chuyển động giữa các frame.
■ Khỉ bắt đầu chuyển động tốc độ chầm chậm sau đố tăng tốc hướng về phía
kết thúc chuyển động, kéo con trượt lên hoặc nhập vào giá trị từ -1 đến 100.
■ Khỉ bất đầu chuyển động tốc độ rất nhanh sau đố giảm tốc chuyển động
hướng về điểm kết thúc chuyển động, kéo con trượt xuống hoặc nhập vào
giá trị dương từ 1 đến 100.
■ Theo mặc định, tốc độ thay đổi giữa các frame liến tục. Mục Easing tạo ra
hình dạng đếi tượng xuất hiện nhỏ dần hoặc lớn dần bằng cách hiệu chỉnh
tốc độ thay đổi của chứng.
8. Để xoay các đối tượng trong lức chuyển động, bạn cố thể chọn một ưong các chế độ
chọn cố trong trình đơn Rotate như sau:
■ Chọn None (chế độ thiết lập mặc định) không ứng dụng chế độ xoay cho
đếi tượng.
■ Chọn Auto xoay đối tượng chuyển động ít nhất một lần theo hướng xác
định.
■ Chọn Clockwise (CW) hay Counterclockwise (CCW) xoay đối tượng
theo hướng được xác định và sau đố nhập vào gốc độ xoaỵ.
Chứ V : Hướng xoay này thêm vào bất kỳ hướng xoay nào bạn ứng dụng vào frame cuối cùng
trong bước 4.
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
200
BIÊN SOẠN: KSPHẠM QUANG HUY
GIÁO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BANG HĨNH ẢNH
9. Nếu bạn đang dùng một đường chuyển
động (Motion Path), chọn mục Orient to
Path để định hướng đường biên chuyển
động vào đường Motion Path.
CHƯƠNG 9
Easing: |o
times
R otate: I A uto
Options: ĩ? jöriennö pâịiiị
1^ SynJrt^ni
10. Chọn mục Synchronization để đảm bảo Instance diễn hoạt lặp đi lặp lại đúng trong
đoạn phim. Dùng lệnh Synchronize nếu số frame quá trình chuyển động bên trong
Symbol thậm chí không nhiều hơn số frame mà Instance Graphic giữ trong đoạn
phim.
11. Nếu bạn đang dùng một đường Motion Path, chọn Snap để gắn các thành phần
chuyển động vào đường Motion Path theo điểm khai báo (Registration Point).
a □
u
Lạya 2
□
ữ
_L| %!*] *1 M Hi [T2.0Fps I 2.?s
J_u
±
Đoạn phim đang cho chuyển động
CHUYỂN ĐỘNG (TWENNING MOTION) DỌC THEO ĐƯỜNG DAN
Các Motion Guide Layer (Layer hướng dẫn chuyển động) cho phép bạn vẽ các đường
dẫn trong đó các Instance, group hoặc khối ký tự có thể chuyển động dọc theo các Motion
Guide Layer. Bạn có thể kết nối nhiều Layer vào một Motion Guide Layer cho nhiều đối tượng
theo cùng một đường dẫn. Một layer bình thường được kết nối đến một Motion Guide Layer sẽ
trở thành một Guided Layer.
Ảnh trong ví dụ này, là hai đối tượng trên 2 Layer độc lập được gắn trên cùng một Motion Path
□
Tạo ra một đường Motion Path cho một ảnh chuyển động Tweened Animation:
TỦ SÁCH STK - THẾ GIỚI Đồ HỌA
201
BIÊN SOẠN: KS PHẠM QUANG HUY
GIÁO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BANG HĨNH ẢNH
CHƯƠNG 9
1. Tạo một đường chuyển động Motion-Tweened Animation như đã mô tả trong
phần “Tạo chuyển động các Instance, Group và Ký tự ” để biết thêm chi tiết.
Nếu bạn chọn mục kiểm Orient to Path, đường cơ bản của đối tượng chuyển động
sẽ hướng vào đường chuyển động Motion Path. Nếu bạn chọn mục Snap, điểm
khai báo của đối tượng chuyển động sẽ bắt dính vào đường Motion Path.
2. Sau đó bạn thực hiện một trong những thao tác sau:
■ Chọn Layer có chứa đối tượng chuyển động và chọn trên trình đơn Insert
> Motion Guide.
■ Nhấp phải chuột (trong Windows) hoặc nhấp phím Control (trong
Macintosh) vào Layer có chứa ảnh chuyển động và chọn lệnh Add Motion
Guide toong trình đơn dọc.
S h o w AM
L o c k CMheis
Hide Otheis
Insert Layei
D elete L a y «
Properties...
Guide
Add Motion Guide
Mask
•a»
0
L ỡ L ayer 1
•
n
•
□
, )■........................................ — ...........................» , I
S h o w M a sk in g
Flash tạo ra một Layer mới bên trên Layer được chọn với biểu tượng Motion
Guide bên trái của tên Layer.
3. Dùng công cụ Pen, Pencil, Line, Circle, Rectangle hoặc Brush để vẽ đường dẫn
mong muốn.
4. Lúc này tâm của đối tượng sẽ bắt dính vào điểm đầu tiên của đường Guide trong
frame thứ nhất và điểm kết thúc đường Guide trong frame cuối cùng.
Chứ Ý: Kéo Symbol bằng cách kéo điểm khai báo trên đối tượng để có được kết quả bắt dính
vào đường Guide tốt nhất.
TỦ SÁCH STK - THẾ GIỚI Đồ HỌA
202
BIÊN SOẠN : KS PHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
5. Bạn có thể dấu Layer Motion Guide và đường chuyển động để chí cho xuất hiện
các đếi tượng chuyển động trong khi bạn làm việc. Bạn hãy nhấp chuột vào cột
biểu tượng con mắt Eye trong Layer Motion Guide.
ms
I- Guide: Layer 1
m
u
H
1
*
□
0
1
5
a* a
*
tỉ Guide: Layei 1
i l m
!? ’ Layer 1
m
© |g i
ỉ 1
hC
/*■
© ©
*
□
1
□
'1
•
5
*
m
O .lH
Nhấp chuột vào cột con mắt để dấu Layer Motion Guide
Đối tượng là Group hoặc Symbol cố thể chuyển động tbeo một đường dẫn kbi bạn diễn hoạt chúng
Bài tập ví dụ mẫu sau cũng cố cho phần tạo chuyển động cho các instance - group - type
và mục chuyển động theo đường dẫn Motion Path : Bây giờ bạn có thể làm một ví dụ nhỏ với
ảnh là mũi tên bay xung quanh qũy đạo như sau:
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
203
BIÊN SOẠN: KSPHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
1. Trước hết bạn hãy mở file Flash mới. Sau đố cho hỉển thị lưới để vẽ hình như bên
dưới tại keyframe thứ nhất trong Layer 1.
2. Sau đó chọn công cụ Arrow để chọn mũi tên này và chọn trên trình đơn Modify >
Group để nhóm tất cả các thành phần rời tạo thành hình mũi tên lại với nhau.
Transfaim
Arrange
Flames
Gioup
Ungioup
B re a k A p a rt
Ciil+Shĩlí+G
Clih-B
-
Bây giờ bạn sẽ thấy xung quanh mũi tên cố bao bọc đường viền màu xanh nhạt. Nhớ
tắt lưới di. Sau đố chọn trên trình đơn Modify > Frame để hiển thị bảng Frame. Tại
đây trong mục Tweening chọn Motion, mục Easing chọn là 0, mục Rotate chọn
None và đánh dấu vào các tùy chọn cổ trong mục Options như Orient to path,
Synchronize và Snap.
m
a
□
[
|—I 'T~ r i * 5
^
1C
t 1 í
15
20
ỊIH ỉnstỊgẸ] Fr-3mef'Ị^rSouỊ'ĩ,~l
Label:
2
f'.
Ị-
Twee-ning; I Motion
3
F
Scale-
E-55Ìn<Ị; | d "" »I
R o ta te : I M a rie “
H
r
Options: |7] □lientiQpaih
E
Synohronree- [ ?
S na p
4. Sau đó bạn tạo thêm một Layer mới tên là Layer2. Sau chép ảnh mũi tên này và
dán vào Layer2 để cổ thêm một mũi tên nữa trong Layer2. lúc này hai mũi tên này
độc lập với nhau. Bạn cố thể đổi màu cho mũi tên trên Layer 2 nàỵ để phân biệt
Layerl và Layer2.
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
204
BIÊN SOẠN: KSPHẠM QUANG HUY
GIẨO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BẰNG h ỉn h Ản h
i 11 111
30
Bây giờ bạn lặp lại bước 3 cho mũi tên
trong Layer2 này. Sau đó nhấp chuột vào
keyframe thứ nhất trên Layerl. Sau đó
xác định sế vị trí keyframe cuối cùng.
Trong ví dụ chọn keyframe cuối cùng là
35.
35
r
/
1
45
Cie-ate Motion
A
'1
40
chương
50
9
55
T w een
^ ^ n s e r t Fíame
Rem ove Frames
Insert Keyframe
Insert Blank K e y f ia m e
Clew Keyfiame
k
6. Bây giờ bạn sẽ thấy đường Motion Tween xuất hiện trong thanh thước Timeline
trong Layerl và lặp lại bước chọn số keyframe cuối cùng như bước 5 cho Layer2.
i» i □ 1
ũ? Laụer 1
ị© ®
5
10
15
20
26
30
3E
................................................................ 1
□ • -----------------------------------------------ft
♦i b N |%| Hi 3* 112.0Fps 2.8s i 1
7. Bây giờ bạn nhấp chuột vào Layer2 và nhấp phải chuột chọn lệnh Add Motion
Guide để tạo Layer Motion Guide.
Hide Others
TỦ SÁCH STK-THẾ GIỚI ĐÒ HỢA
205
BIÊN SOẠN: KS PHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
8. Tiếp đến bạn nhấp chuột vào keyframe đầu tiên trong Layer Guide và dùng công cụ
Pencil Tool hoặc công cụ Cừcle Tool để vẽ đường quỹ đạo.
I
» a n l l ũ yp
Guide: Layer 2
1 Ũ? Layer 2
1ũ ? L a y e r 1
■
1® ©
15
1!
m m o K
*
' □ K M ________
•
' □
20
25
30
3Ĩ
...........................................
a II111Ỉ * M ■&! Ễ-ill
1
12.0 fps
1
c.ữs
1
9. Nhấp chuột vào keyframe cuối cùng trong Layerl và kéo mũi tên trên Layer này để
xác định điểm ngừng chuyển động và để tạo ra đường Motion Tween. Bạn cũng làm
tương tợ như vậy cho mũi tên trong Layer2.
1
5
10
15
20
25
50
Ịs
•
í
/1
m 5---------------------------------------------------------------------------------------- * [
* >---------------------------------------------------------------------------------------- + «
.
34
12 .d ip s
¿.is
i I
\ |
I
Đường chuyển động Motion Tween
10. Sau đố bạn chọn keyframe thứ nhất trong Layer1 và nhấp phải chuột chọn lệnh
Create Motion Tween trong trình đơn dọc để tạo điểm khai báo chuyển động cho
mũi tên trong Layerl. Còn lại Layer2, bạn lặp lại bước 10 này tương tự cho Layer2.
a* s
tỉ
Guide: Layer 2
Ũ? Layer 2
f s 1 HP
□
*
*
*
■» □
□
m
ĩ|
V
10 ’ ' ' 15 ’ ’
20 ’
' 25 '
30
o
D
II )----------------------------------------------------------------- > •
1
----------------- * *
í 1 C re a te M otion Tw e e n
L
111n fp il1 Fm
1 lum
l l lpt
5 i 1'
1
R e m o v e F lam es
11. Vì bạn muến hai mũi tên trong Layerl và Layer2 cùng chạy trên một qũy đạo theo
hai hướng ngược nhau. Do đó bây giờ bạn nhấp chuột vào Layerl và chọn lệnh
Rotate trong trình đơn Modify > Transform để hiệu chỉnh hướng đi của mũi tên
trong Layerl này nằm trên đường quỹ đạo.
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
206
BIÊN SOẠN: KSPHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB ; PHAN LỶ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h ả n h ________ CHƯƠNG 9
Sau khi hiệu chỉnh hướng xoay cho mũi tên trong Layerl
12. Trên từng keyframe bạn phải xác định từng điểm chạy và chọn lệnh Rotate trong
trình đơn Modify > Transform sau đố xoay mũi tên sao cho nố nằm ngay trên đường
quỹ đạo bạn cứ tiếp tục thực hiện cho đến keyframe cuối cùng vị trí mũi tên nằm
ngay vị trí xuất phát đầu tiên.
Xoaỵ mũi tên sao cho nố nằm gom trên đường quỹ đạo
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
207
BIÊN SOẠN: KSPHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
Chu V : Khi đếi tượng đến các chỗ cong bạn phải dùng công cụ xoay Rotate này lần nữa để
hiệu c h ìn h cho mũi tên nằm trên đường quỹ đạo như h ìn h trang trước
13. Bạn cố thể chia các keyframe không đều nhau tùy thuộc vào đường đỉ đến chỗ khúc
cong của quỹ đạo mà chia cho phù hợp YỚi đếi tượng.
Guide: Lạyei 2
Q? Layei 2
I?1 Layei 1
14. Bạn thực hiện tương tợ từ bước 11 cho đến bước 13 cho mũi tên trong Layer2. Sau đó
bạn sẽ có kết quả như hình bên dưới.
Keyítame cuấi cùng đối tượng dừng lại tại ví ưí bắt đầu
15. Cuối cùng trước khi diễn hoạt chuyển động
bạn muốn làm ẩn đường Motỉon Guide
trong vùng Stage, bạn hãy nhấp chuột vào
cột bên dưới con mắt ưong Layer Motìon
Guide.
«
ũ ? Laver 2
^
Ũ? Layer 1
*
E
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
208
Ẽ3
â
*
□
1
□
« >— ►• >------ ?■ị
□
• j---- * • :>------ + (
m
5
II
BIÊN SOẠN: KSPHẠM QUANG HUY
1
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
Để diễn hoạt chuyển động, bạn hãy nhấn phím Ctrl + Enter để diễn hoạt ảnh trong
môi trường Debug.
Hai đối tượng đang chuyển động trong Flash Player
□ Kết nối cắc Layer vào một Layer Motion Guide, bạn cố thể thực hiện một trong những cách
sau:
■ Kéo Layer đang tồn tại bên dưới Layer Motion Guide. Bây giờ Layer này sẽ thục
vào trong bên dưới Layer Motion Guide. Tất cả các đối tượng trong Layer này sẽ
tự động bắt dính vào đường Motion Path.
Tạo một Layer mới bên dưới Layer Motion Guide. Các đối tượng bạn chuyển
động trong Layer này sẽ tự động chuyển động dọc theo đường Motion Path.
Chọn một Layer bên dưới Layer Motion Guide. Chọn trên tành đơn Modify >
Layer và chọn mục Guided trong hộp thoại Layer Properties.
Layei Properties
OK
Name: iLaj-'er 3
|7 Show
yjpe;
r
Lock
Normal
Cancel
H elp
o GiUtte
Guided
Masked
Outline Color:
1“
Laụet Height:
View layer as outlines
100%
■ Nhấn phím Alt và nhấp chuột (trong Windows) hoặc nhấn phím Option và nhấp
chuột (trong Macintosh) vào Layer muốn liên kết với Layer Motion Guide.
□ Tháo bỏ các liên kết Layer từ một Layer Motion Guiđeỉ
■ Chọn Layer bạn muốn bỏ liên kết.
■ Sau đó bạn có thể thực hiện một trong những thao tác sau:
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
209
BIÊN SOẠN: KS PHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
■ Kéo Layer bên dưới Layer Motion Guide.
■ Chọn trên bình đơn Modify > Layer và chọn Normal trong mục chọn Type ưong
hộp thoại Layer Properties.
Layei Properties
Name:
K
1Layer 1
OK.
Ịv» Show
r
Lock
1
Cancel
Help
/ T y p e : i* -Norma!
TO*)»
r
c
G u id ed
oM
dsfc:
c Masked
Outline Color: j
f-
\
V ie w layer a s outlines
Layer Height: ị 1ũũ%
•
^
Nhấn phím Alt và nhấp chuột (trong Windows) hoặc nhấn phím Option và nhấp
chuột (trong Macintosh) vào Layer muốn bỏ liên kết với Layer Motion Guide.
CHUYỂN ĐỘNG BIEN d ạ n g
chế độ
Tw e e n in g
sh a p e
Vổi chế độ chuyển động Tweening Shape, bạn có thể tạo ra một hiệu ứng tương tợ như
hiệu ứng Morphing (viết tắt của từ Metamorphosing), một kỹ thuật tạo các hiệu ứng đặc biệt
trong kỹ xảo hoạt hình, tạo cho một ảnh xuất hiện thay đổi liên tục thành một ảnh khác (biến
hình). Ngoài ra Flash cũng làm chuỵển động vị trí, kích thước và màu sắc của đếi tượng.
Kỹ xảo hoạt hình hay được sử dụng hơn gọi là tweening (viết tắt của chữ in-betweening),
tạo cho máỹ tính cố khả năng tính toán và vẽ các khung hình trung gian gỉữã các khung hình
chính do các hoạ sĩ vẽ bằng tay. Morphing chính là quá trình tvveening vào một đối tượng khác.
Khi bạn nhấp chuột vào nút Play, ảnh con Gà sẽ chuyển động biến dạng từ từ thành con Bê
Khi bạn Tweening một đối tượng tại một lúc nào đó thường tạo ra kết quả tốt nhất. Nếu
bạn muốn Tweening nhiều đối tương cùng lúc, tất cả các đối tượng này phải ở trên cùng một
Layer.
Flash không thể Tweening các đối tượng như Group, Symbols, ký tự hoặc ảnh Bitmap.
Bạn phải sử dụng trinh đơn Modify > Break Apart để gán chế độ Tweening Shape vào những
đối tượng này.
Để điều khiển các đối tượng không chắc có thực và nhiều thay đổi phức tạp, bạn hãy
dùng chế độ Shape Hints, điều khiển từng phần trong ảnh gếc di chuyển thành đếi tượng mới.
Bạn cố thể xem mục “Cách dùng Shape Hints (các hình gợi ý)” toong phần sau để biết thêm chỉ
tiết
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
210
BIÊN SOẠN: KSPHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
□ Cách Tween một đối tượng:
1. Nhấp chuột vào tên của một Layer để kích hoạt Layer này hoạt động và chọn
một keyframe trống nơi bạn muốn vùng chuyển động bắt đầu.
ạ* â □ ĩ | 1 /[ '
iộ'
'iỊ
Ix
{I ¡Ii]¥| %\ r-:| 1
2. Tạo ảnh đấỉ tượng cho frame đầu tiên. Bạn cố thể dùng bất kỳ công cụ vẽ nào để
tạo một đối tượng. Ví dụ, để đơn giản nhất bạn cố thể vẽ hình tròn.
3. Tiếp đến bạn hãy tạo keyframe thứ hai có số frame mong muến sau frame thứ
nhất.
1.
E
10
15
2D
25
30
3E
s
<Ễ
1
Cieate Motion Tween
Insert Frame
Remove Frames
r n s r a IU [ ũ i n
Insert Kevhame
Insert Blank. Keyfiame
L
" 1
4. Tạo ảnh trong frame cuối cùng trong quá trình chuyển động. (Bạn cố thể làm
chuyển động hình dạng, kích thước, màu sắc và vị trí của đối tượng trong bước 2).
Tại frame này bạn có thể dùng công cụ bút chì Pencil Tool và vẽ vào chữ ’’Flash
5” chẳng hạn.
ữ
II iàN 1*1
5. Sau đố bạn nhấp chuột trở về frame thứ nhất và chọn trên trình đơn Window >
Panels > Frame.
6. Trong mục Tweening, chọn Shape.
7. Nhấp chuột và kéo mũi tên kế bên mục Easing hoặc nhập giá trị vào trong ô để
hiệu chỉnh tấc độ thay đổi giữa các frame chuyển động:
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
211
BIÊN SOẠN: KSPHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
■ Khi bắt đầu chuyển động tốc độ chầm chậm sau đố tâng tốc hướng về phía
kết thức chuyển động, kểo con trượt lên hoặc nhập vào giá trị từ -1 đến
-100.
■ Khi bắt đầu chuyển động tốc độ rất nhanh sau đó giảm tốc chuyển động
hướng về điểm kết thúc chuyển động, kéo con trượt xuấng hoặc nhập vào
giá trị dương từ 1 đến 100.
■ Theo mặc định, tốc độ thay đổi giữa các frame liên tục. Mục Easing tạo ra
hình dạng đếi tượng xuất hiện nhỏ dần hoặc lớn dần bằng cách hiệu chỉnh
tốc độ thay đổi của chứng.
8. Chọn một tùy chọn trong mục Blend:
■ Mục chọn với Dỉstrỉbutỉve tạo ảnh
chuyển động mà trong đó các đối tượng
trung gian nhẳn hơn và không đều nhau.
■ Mục chọn Angular tạo ảnh chuyển động
mà vẫn giữ lại các biên rõ ràng và các
đường thẵng trong đối tượng trung gian.
F ram e
B
Ị 1■' J líìstỊ 5 0 Fram el'y^r S o u Ịií jE ifec] ©
1
> ||
Label:
Twewiing: 1S h ip ?
Easing:
ị1 -
* I
—1
Bleríd: ¡DistributiveAngular
Sau khỉ chọn xong tất cả các mục cố trong bảng Frame, các frame của bạn trên thanh
thước Timeline cố hình giống như hình bên dưới
Đối tượng được diễn hoạt bây giờ hình tròn biến thành chữ Flash5
Chứ V : Mục chọn với Angular chỉ thích hợp với các biên sắc nét và các đường thẳng. Nếu đối
tượng của bạn không cố các biên, Flash hoàn trở lại mục chọn Tween Shape là Distributive.
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
212
BIÊN SOẠN: KSPHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h Ản h ________ CHƯƠNG 9
CẨCH DÙNG SHAPE HINT (CẮC HÌNH GỢl Ý)
Để điều khiển các đối tượng khống chíc có thực và nhiều thay đổi phức tạp, bạn hãy sử
dụng Shape Hint. Chế độ Shape Hint này xác đinh các điểm tương ứng trong ảnh đầu và ảnh
cuối. Ví dụ như nếu bạn đang chuyển động một bản vẽ khuôn mặt khi nó thay đổi nét mặt, bạn
cố thể dùng một ảnh gỢỈ ý để đánh dấu vào mỗi con mắt. Sau đố, thaỵ vì nểt mặt trở thành một
ảnh lộn xộn vô định trong khi ảnh vẫn thay đổi chuyển động, mỗi con mắt vẫn còn thay đổi, bạn
cố thể nhận biết được những độc lập nhau trong suết quá trình chuyển động.
Các hình giống nhau chuyển động cố và không cố cắc hình gợi ý liêng biệt
■ Shape Hint cố chứa các chữ cái từ (a đến z) để xác định các điểm tương xứng tại đếi
tượng bắt đầu và đấỉ tượng kết thức. Bạn cố thể dùng đến 26 Shape Hint.
■ Các Shape Hint nằm trong keyframe đầu tiên đều có màu vàng và màu xanh trong
keyframe cuấi. Cắc Shape Hint ỉà màu đỏ nếu nố không nằm trên đường cong.
Các Shape Hint cổ các ký tợ a, b, c, d, e nằm trên đường cong cố màu vàng trong khỉ đổ Shape Hint ký tự f không
nằm trong đường cong nên cố màu đô
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
213
BIÊN SOẠN: KSPHẠM QUANG HUY
GIÁO TRÌNH THIẾT KẾ WEB : PHAN LÝ THUYẾT - Tự HỌC MACROMEDIA FLASH 5.0 BANG HĨNH ẢNH
CHƯƠNG 9
□ Để CÓ được kết qủa tốt nhất khỉ các đối tượng chuyển động, bạn có thể làm theo những
cách chỉ dẫn sau đây:
■ Đối với các đối tượng chuyển động phức tạp, bạn hãy tạo ra các đối tượng trung gian
và làm chuyển động chúng thay vì bạn chỉ xác định một đối tượng bắt đầu và đối
tượng kết thúc.
■ Bạn phải chắc chắn rằng các Shape Hint đều hợp lý. Ví dụ, nếu bạn đang dùng ba
đối tượng Shape Hint cho một hình tam giác, ba tam giác này phải ở trong cùng một
loại trong tam giác gốc ban đầu và tam giác được thay đổi. Loại trật tự này không thể
là các chữ cái abc trong keyframe đầu và abc toong keyframe thứ hai được.
■ Các Shape Hint cho kết quả tốt nhất nếu bạn đặt chúng vào theo hướng ngược chiều
kim đồng hồ đầu góc trái trên của đối tượng.
□ Cách dùng các Shape Hint:
1. Chọn keyframe đầu tiên trong tiến trình tạo chuyển động Shape Tweening.
«a* a
□
1
5
10
Shape T weening
@ 1U M
© Ẽ Ị
b
fc j K l
2. Chọn trên trình đơn Modify > Transform > Add Shape Hint. Ảnh ở chế độ chọn
Shape Hint đầu tiên xuất hiện vòng tròn màu đỏ có chứa ký tự nằm trên đối tượng.
Flip Hoiizonlal
Remove Tiansịorm
Ctfl+Shill+Z
Cenlei
Add Shape Hint
Remove All Hints
n
■
3. Di chuyển ảnh gợi ý Shape Hint đến điểm bạn muốn đánh dấu.
4. Chọn keyframe cuối cùng trong chế độ chuyển động. Ảnh ở chế độ Shape Hint cuối
cùng xuất hiện tại nơi nào đó trong đối tượng với ký tự “a” có vòng tròn màu xanh
lá cây.
TỦ SÁCH STK - THẾ GIỚI Đồ HỌA
214
BIÊN SOẠN: KS PHẠM QUANG HUY
GIẢO TRÌNH THIẾT KẾ WEB ; PHAN LỶ THUYẾT - T ự HỌC MACROMEDIA FLASH 5.0 BẰNG h ìn h ả n h ________ CHƯƠNG 9
5. Di chuyển ảnh Shape Hint đến điểm trong đối tượng sau cùng mà tương thích với
điểm đầu tiên bạn đã đánh dấu. Diễn hoạt đoạn phim lại lần nữa để xem chế độ
Shape Hint làm thay đổi chế độ chuyển động Shape Tweening. Di chuyển các
Shape Hint để tinh chỉnh ảnh chuyển động.
6. Lặp lại tiến trình này để thêm vào các Shape Hint. Những Shape Hint mới xuất hiện
;• í----------------------------- +i C
mliíll HI lũi
24- 12.0fps Ị 1.9 \
-------- ^
□ Trong khi làm việc với cắc Shape Hint, bạn có thể thực hiện cắc bước sau:
■ Để xem tất cả các Shape Hint, bạn hãy chọn trên trình đơn View > Show Shape
Hints. Layer và keyframe có chứa các Shape Hint phải hiện hành đối với lệnh Show
Shape Hints.
■ Xoá bỏ một Shape Hint bằng cách kểo nố ra khỏi vùng Stage. Xoá bỏ tất cả các
Shape Hint, bạn hãy chọn trên trình đơn Modify > Transform > Remove All Hints.
H ip Hatizortf-al
R e m o v e T ransform
C tft+ SW ft+ Z
E d it C en ter
A d d S h a p e Hint
D ri+ S h ift+ H
R e m o v e All H in ts
TẠO ẢNH CHUYỂN ĐỘNG ANIMATION THEO CHẾ ĐỘ FRAME-BY-FRAME
Ảnh chuyển động theo chế độ frame-by-frame làm thay đổi nội dung trong vùng Stage
trong mỗi frame và thích hợp nhất đấi với các đối tượng phức tạp trong đố một ảnh thay đổi liên
tục trong mỗi frame thay vì chỉ đơn giản di chuyển. Chế độ chuyển động theo dạng frame-byframe sẽ làm tăng kích thước file nhanh hơn chế độ chuyển động theo dạng Tweened
Animation.
TỦ SÁCH STK - THẾ GIỚI Đ ồ HỌA
215
BIÊN SOẠN: KSPHẠM QUANG HUY
