Flash CS4 - Bài thực hành 19: tạo bướm bay lượn (Phần 1)

1. Chuyển về vùng làm việc mặc định.

Bạn bấm chọn vùng Essentials để chọn lại vùng làm việc mặc định của Flash, tiếp đến bấm chọn Reset Essentials để khôi phục vùng làm việc mặc định này và bắt đầu vào bài thực hành 19. (Xem bài thực hành 1 về vùng làm việc)

2. Tạo mới một flash document. (Xem bài thực hành 1 về tạo một flash document)

3. Lưu một flash document. (Xem bài thực hành 1 về lưu một flash document)

Chọn folder FLASH CS4 ONLINE, sau đó lưu file này lại với tên 019_buom_bay.fla

4. Import hình bướm.

4.1. Chọn File Import Import to Stage… từ menu (Hoặc bấm phím tắt Ctrl+R):

Phóng to

4.2 Trong hộp thoại Import, trỏ đến file buom.jpg và bấm nút Open: (file buom.jpg được đính kèm theo bài để sử dụng):

Phóng to

Bạn thu được bức ảnh bướm nằm giữa màn hình, lúc này ảnh đang được chọn với khung màu xanh bao quanh:

Phóng to

5. Dùng Pen Tool để vẽ bướm theo hình mẫu.

5.1 Bấm phím phải chuột vào Layer 1 trên Timeline cho xuất hiện menu ngữ cảnh và chọn Insert Layer:

Phóng to

Flash bổ sung Layer 2 vào Timeline:

Phóng to

5.2 Bạn sẽ đồ lại ảnh bướm bằng công cụ Pen Tool. Để dễ theo dõi, bạn cho phóng to ảnh bướm. Chọn View Zoom In từ menu (Hoặc phím tắt Ctrl+=):

Phóng to

Bạn thu được ảnh bướm to hơn do stage đã được phóng to:

Phóng to

5.3 Chọn Pen Tool từ thanh công cụ bên phải:(Xem thêm phần Tìm hiểu về Pen Tool ở cuối bài)

Phóng to

5.4 Bạn đưa chuột vào Stage, chuột chuyển thành hình ngòi bút mực kèm dấu x bên phải. Bạn sẽ vẽ cánh bướm bằng các đường thẳng nhờ vào công cụ Pen Tool, sau đó dùng Selection Tool để nắn cong các đường thẳng thành cánh bướm. Bạn vẽ điểm đầu tiên của đường thẳng tại giao điểm phần trên của cánh bướm bên trái và thân bướm như hình minh họa:

Phóng to

5.5 Bấm chuột vào điểm thứ hai ở mép trên bên trái như hình minh họa:

Phóng to

5.6 Flash tạo một đường thẳng nối hai điểm vừa vẽ. Bạn bấm chuột vào điểm thứ ba như hình minh họa:

Phóng to

5.7 Flash vẽ tiếp đường thứ hai. Bạn bấm chuột vào điểm thứ tư:

Phóng to

5.8 Tiếp đến điểm thứ năm:

Phóng to

5.9 Sang điểm thứ sáu:

Phóng to

5.10 Đến điểm thứ bảy:

Phóng to

5.11 Bạn sẽ kết thúc nét vẽ bằng cách quay lại điểm đầu tiên. Khi rê chuột trở lại điểm đầu tiên, bạn thấy kế bên chuột xuất hiện một vòng tròn nhỏ báo hiệu kết thúc nét vẽ. Bạn bấm chuột để kết thúc nét vẽ:

Phóng to

Bạn thu được một hình đa giác khép kín:

Phóng to

5.12 Tiếp theo, bạn sẽ nắn sửa các đường thẳng vừa vẽ cho phù hợp với cánh bướm. Chọn Selection Tool từ thanh công cụ:

Phóng to

5.13 Rê chuột vào đường thẳng ở mép trên cánh bướm. Khi phía dưới chuột xuất hiện đường cong, bạn đẩy chuột lên trên một đoạn để đường thẳng chuyển thành đường cong theo cánh bướm:

Phóng to

5.14 Bạn thực hiện tiếp tục cho các đường thẳng còn lại để thu được đường cong bao quanh cánh bướm. Riêng đường thẳng dọc thân bướm có thể để nguyên không cần nắn sửa:

Phóng to

5.15 Tiếp theo, bạn sẽ tô màu ruột cho cánh bướm. Chọn Eyedropper Tool từ thanh công cụ:

Phóng to

5.16 Đưa chuột vào vùng có cánh bướm màu vàng, chuột chuyển thành ống hút màu kèm theo cây cọ bên dưới. Bấm chuột vào cánh bướm để hút màu vàng này:

Phóng to

5.17 Màu fill được cập nhật ở Property Inspector:

Phóng to

5.18 Đồng thời chuột chuyển thành thùng nước sơn. Bạn đưa chuột bấm vào vùng cánh bướm để tô màu ruột cho cánh bướm:

Phóng to

Bạn thu được cánh bướm màu vàng:

Phóng to

5.19 Bạn sẽ chuyển cánh bướm vừa vẽ thành movie clip symbol. Bấm chọn keyframe 1 của Layer 2 trên Timeline:

Phóng to

5.20 Nội dung của keyframe 1 (cánh bướm) được chọn:

Phóng to

5.21 Chọn Modify Convert to Symbol… từ menu (Hoặc phím tắt F8):

Phóng to

5.22 Ở hộp thoại Convert to Symbol, bạn điền canh buom mc vào ô Name, chọn Type là Movie Clip, Registration ở giữa, xong bấm OK:

Phóng to

5.23 Bạn sẽ copy cánh bướm sang phải. Chọn Edit Copy từ menu (Hoặc phím tắt Ctrl+C):

Phóng to

5.24 Chọn Edit Paste in Place (Hoặc phím tắt Ctrl+Shift+V):

Phóng to

5.25 Bạn thu được cánh bướm thứ hai nằm trùng cánh thứ nhất. Bạn sẽ lật ngang cánh bướm cho đối xứng và di chuyển sang phải.Chọn Modify Transform Flip Horizontal từ menu:

Phóng to

Bạn thu được hai cánh bướm đối xứng nằm chồng lên nhau:

Phóng to

5.26 Bạn dùng phím mũi tên di chuyển cánh bướm sang phải (Giữ phím Shift để di chuyển mỗi lần 10 pixel):

Phóng to

5.27 Bước tiếp theo bạn sẽ vẽ thân bướm. Để việc vẽ được thuận tiện, bạn sẽ tắt Layer 2 đi. Bạn bấm chuột vào chấm màu đen phía dưới hình con mắt của Layer 2 trên Timeline:

Phóng to

Bạn thu được một dấu chéo màu đỏ phía dưới hình con mắt của Layer 2, đồng thời hai cánh bướm tạm thời bị tắt đi:

Phóng to

5.28 Layer 1 chứa hình bướm để tham khảo. Bạn sẽ bổ sung layer mới và vẽ thân bướm trên layer mới này. Bấm phím phải chuột vào Layer 2 cho xuất hiện menu ngữ cảnh và chọn Insert Layer:

Phóng to

Flash bổ sung Layer 3 vào Timeline:

Phóng to

5.29 Chọn Pen Tool từ thanh công cụ:

Phóng to

5.30 Bạn vẽ điểm đầu tiên từ đỉnh đầu bướm như hình minh họa:

Phóng to

5.31 Bạn vẽ tiếp các điểm còn lại tại các vị trí và kết thúc ở điểm đầu tiên như hình minh họa:

Phóng to

Bạn thu được hình đa giác khép kín:

Phóng to

5.32 Bạn sẽ nắn sửa hình đa giác cho cong tròn theo thân bướm. Chọn Selection tool từ thanh công cụ:

Phóng to

5.33 Rê chuột vào một đường thẳng. Khi phía dưới chuột xuất hiện đường cong, bạn đẩy chuột sang trái để nắn sửa:

Phóng to

5.34 Bạn tiếp tục nắn sửa cho các đường còn lại và thu được đường viền thân bướm:

Phóng to

5.35 Tiếp theo bạn sẽ tô màu cho thân bướm. Chọn Eyedropper Tool từ thanh công cụ:

Phóng to

5.36 Đưa chuột vào thân bướm, chuột chuyển thành ống hút màu với cây cọ bên phải, bấm chuột để lấy màu thân bướm:

Phóng to

Màu fill được cập nhật ở Property Inspector:

Phóng to

5.37 Đưa chuột vào lại thân bướm, chuột chuyển thành thùng nước sơn. Bấm vào thân bướm để tô màu thân:

Phóng to

Bạn thu được màu thân bướm:

Phóng to

5.38 Để vẽ tiếp râu bướm, bạn chọn Line tool từ thanh công cụ:

Phóng to

5.39 Bạn vẽ hai đường thẳng từ đầu bướm ra ngoài như hình minh họa:

Phóng to

5.40 Tiếp theo bạn dùng Selection Tool để nắn sửa thành hai đường cong làm râu bướm:

Phóng to

5.41 Bạn sẽ chuyển thân và râu bướm thành symbol. Bấm chọn keyframe 1 của Layer 3 trên Timeline:

Phóng to

Thân và râu bướm được chọn:

Phóng to

5.42 Chọn Modify Convert to Symbol… từ menu (Hoặc phím tắt F8):

Phóng to

5.43 Ở hộp thoại Convert to Symbol bạn gỏ than buom vào ô Name, chọn Type là Movie Clip, Registration ở giữa và bấm OK:

Phóng to

5.44 Bạn mở Layer 2 và tắt Layer 1 từ Timeline:

Phóng to

Bạn nhìn thấy hình cánh bướm và thân bướm vừa vẽ được trên Stage:

Phóng to

5.45 Bạn kéo thành hình chữ nhật để quét chọn toàn bộ:

Phóng to

5.46 Bạn sẽ chuyển toàn bộ thành symbol. Chọn Modify Convert to Symbol từ menu (Hoặc phím tắt F8):

Phóng to

5.47 Ở hộp thoại Convert to Symbol, bạn gỏ buom vào ô Name, chọn Type là Movie Clip, Registration ở giữa và bấm OK:

Phóng to

5.48 Bạn thu được movie clip symbol buom ở Layer 3:

Phóng to

5.49 Bạn xóa Layer 1 và Layer 2, giữ lại Layer 3:

Phóng to

5.50 Chọn View Zoom Out từ menu (Hoặc phím tắt Ctrl+-):

Phóng to

Stage được thu nhỏ lại như cũ với con bướm đang ở giữa:

Phóng to

(còn tiếp)

---------------------------------------------------------------------------------------