Hiệu ứng tuyết rơi trong flash

In
Xem kết quả: / 50
Bình thườngTuyệt vời 

Hi, sắp đến noel rồi mình xin hướng dẫn các bạn một số mẫu làm tuyết rơi trong flash bao gồm cả animation và ActionScript. Hy vọng các bạn sẽ có những món quà độc đáo trong dịp noel.

Đầu tiên là Animation nhé.

Nguyên vật liệu của bài hướng dẫn này là 1 bức ảnh nền giáng sinh thật đẹp, những bông tuyết lãng mạn.

Chúng ta bắt đầu nhỉ.

Bước 1:

Tạo 1 tài liệu Flash mới Ctrl + N, kích thước mình làm là 450x320 và tốc độ frame 12 fps.

Tiến hành Import bức ảnh nền vào Flash: bạn vào File > Import > Import To Stage... (Ctrl +R). Điều chỉnh nó vừa khít với vùng hiển thị của Flash bằng các vào Bảng Align Window > Align (Ctrl +K). Vè chỉnh như hình vẽ:

Làm xong bạn khóa layer này lại để tránh đụng chạm đến nhé.

Bước 2:

Tạo 1 layer mới, ở layer này bạn click chuột vào frame thứ 5 và nhấn F6. Tại đây ta sẽ tạo 1 đoạn tuyết rơi thứ nhất. (bạn có thể chọn màu nền cho FLash là màu đen để tiện làm những bông tuyết trắng).

Tiến hành vẽ bông tuyết, Bạn sử dụng công cụ Oval Tool (O), Vẽ một hình tròn với màu Fill là màu trắng và Stroke là trong suốt, kích thước 4x4.

Hãy chú ý những phần mình đã khoanh đỏ.

Bước 3:

Sử dụng công cụ Selection Tool (V), click vào bông tuyết vừa vẽ bạn nhấn F6, để convert nó thành dạng Movie Clip. Để xem rõ hơn bông Tuyết bạn có thể phóng to thu nhỏ bằng cách nhấn Ctrl + Hoặc Ctrl -

Bước 4:

Click đúp vào Movie Clip bông tuyết, để và trong, ở đây ta sẽ tạo chuyển động cho bông tuyết bằng đường Guide.

Bước 5:

Ở đây mình sẽ hướng dẫn các bạn làm 4 bông tuyết chạy trên 4 đường Guide còn các bạn có thể làm ít hơn hoặc nhiều hơn là tùy nhé.

Tạo 1 layer mới. Bạn có thể đặt tên cho Layer này là Guide.

Bạn sử dụng công cụ Pencil Tool (Y), vẽ 4 đường lòng vòng như hình dưới, những đường này sẽ là những đường mà những bông tuyết rơi xuống sẽ uốn lượn như thế. (chọn màu Stroke là màu trắng để dễ nhìn như phần mình đánh dấu đỏ trong hình).

Bước 6:

Bạn sử dụng công cụ Selection Tool (V), click chọn bông tuyết rồi nhấn F8 để Convert nó thành dạng Movie Clip. (Trước đó các bạn có thể nhấn Ctrl + để phóng to lên thuận tiện cho bước làm).

Bước 7:

Sau khi Convert thành Movie Clip bạn click vào layer thứ 70, ở Layer bông tuyết bạn nhấn F6 và layer đường Guide bạn nhấn F5. Sau đó Click vào bất cứ chỗ nào ở giữa frame 1 đến frame 70 trên layer bông tuyết chuột phải và chọn Create Classic Tween (Phiên bản CS4).

Bước 8:

Bạn click chuột phải vào layer Guide và chọn Guide.

Bước 9:

Chọn công cụ Selection Tool (V), Click vào Frame 1 trên layer bông tuyết kéo bông tuyết vào điểm đầu của đường Guide 1 như hình vẽ:

Tiếp tục Click vào frame thứ 70 trên layer Bông tuyết và kéo bông tuyết nằm lên điển cuối của đường guide 1.

Sau đó để bông tuyết rơi được thật hơn, nghĩa là nó sẽ nhỏ bớt đi và sẽ mờ dần bạn chú ý những phần mình khoanh đỏ, W và H là đọ lớn của bông tuyết lúc đầu nó là 4x4 thì giờ bạn đặt là 2x2. Chọn Alpha tầm 40% là OK.

Bước 10:

Tạo 1 layer mới dưới layer Guide. Click vào frame thứ 5 trên layer này  chọn Nhấn F6. Cũng tương tự như bước 2 tạo bông tuyết mới và convert nó thành Movie Clip, bông tuyết này sẽ bám vào đường guide 2 tương tự như bạn đã làm với đường guide 1. Chỉ có điều bạn làm cho bông tuyết này xuất hiện chậm hơn bông tuyết kia 5 frame. Và khi bạn đã làm hết 5 bông tuyết cho 4 đườn guide nó sẽ có dạng như hình dưới:

Các bạn có thể biến tấu tùy theo ý của mình, hoặc có thể kỳ công tạo ra 10 hoặc 20 đường Guide càng nhiều thì trong sẽ càng sinh động hơn.

Bước 11:

Ok vậy là ta đã làm xong chuyển động cho bông tuyết giờ là bước tiếp theo.

Quay trở lại Trình làm việc ngoài cùng. bằng cách Click đúp vào phần không hiển thị của Flash hoặc Click vào như hình sau khi nào bạn thấy thoát ra ngoài cùng thì thôi. Bạn có thể làm theo hình mình đã khoanh tròn trong hình:

Bước 12:

Tạo thêm layer và Làm tương tự các bước từ đầu đến giờ, nếu bạn muốn tuyết rơi dày hơn thì làm nhiều layer hơn.

Như mình thì mình làm 3 layer mỗi layer chứa 4 đường Guide. Như hình.

Còn ở layer chứa code thì bạn chỉ cần chèn vào Chữ " Stop(); " là OK.

Các bạn có thể tham khảo thêm các bài làm tuyết rơi khác ở link dưới:

http://aloflash.com/thuc-hanh-flash/actionscript-10-20/506-hieu-ung-tuyet-roi-trong-flash-bang-as.html

http://aloflash.com/thuc-hanh-flash/hieu-ung/536-flash-tuyet-roi-di-chuyen-theo-con-chuot-as2.html

Chúc các bạn thành công.

aloflash.com

Download

Share