Bài giảng học lập trình Web là bộ bài giảng gồm 7 bài do FPT Polytechnic biên soạn để phục vụ cho việc dạy học môn lập trình web. Bài 4 của bộ bài giảng có nội dung đề cập đến vấn đề tạo họa hình nâng cao - tùy biến luồng công việc - làm việc với file nhập trong flash. Cụ thể hơn, bài 5 cung cấp cho người đọc những kiến thức liên quan đến cách làm việc với những kỹ thuật chuyển động nâng cao, với các bảng liên quan hay với những file được nhập vào trong Flash.
BÀI TẠO HỌA HÌNH NÂNG CAO – TÙY BIẾN LUỒNG CÔNG VIỆC – LÀM VIỆC VỚI FILE NHẬP TRONG FLASH NHẮC LẠI BÀI TRƯỚC Làm việc với frame, keyframe 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 Tween Motion Guide layer Tùy chỉnh hoạt cảnh với Onion Skin Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash MỤC TIÊU BÀI HỌC Cách làm việc với kỹ thuật chuyển động nâng cao: Sao chép (Copy), dán (Paste) lưu chuyển động (Save) Áp dụng kỹ thuật Easing Behavior nâng cao Chuyển động mặt nạ Tạo chuyển động với IK Poses Tuần tự chuyển động Render chuyển động 3D Làm việc với bảng liên quan: Tùy biến preferences Bảng Align, Properties Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash MỤC TIÊU BÀI HỌC Làm việc với file nhập vào Flash: Các định dạng nhập vào Flash Cách làm việc với định dạng Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash KỸ THUẬT TẠO CHUYỂN ĐỘNG NÂNG CAO SAO CHÉP, DÁN VÀ LƯU CHUYỂN ĐỘNG Sao chép chuyển động đối tượng gán cho đối tượng khác Ưu điểm: Giảm thiểu thời gian làm việc Áp dụng với đối tượng có chuyển động giống Sử dụng lệnh: Copy Motion: chụp lại tồn thuộc tính (hiệu ứng, vị trí, lọc) tween Paste Motion: dán thuộc tính tween Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash SAO CHÉP, DÁN VÀ LƯU CHUYỂN ĐỘNG Ví dụ minh họa: sử dụng file fl0701_start.fla chọn layer Jam folder Tag Phrases để tạo Motion Tween, tới frame 40 Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash SAO CHÉP, DÁN VÀ LƯU CHUYỂN ĐỘNG Tại frame 1: Nhấn nút Add Filter vùng Filters bảng Properties Nhập 15 trường Blur X Chọn High menu Quality Nhập giá trị trường Alpha tùy chọn Color Effect Tại frame 15: Chọn dòng chữ Jam Thiết lập Alpha: 100% Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash SAO CHÉP, DÁN VÀ LƯU CHUYỂN ĐỘNG Tại frame 40: Chọn lại dòng chữ Jam Thiết lập Blur X, Blur Y Blur X, Blur Y: chỉnh độ mờ (blur) theo trục x, y Nhấn Enter để xem thử chuyển động Sao chép chuyển động vừa tạo cho dòng chữ Dance Trong layer Jam, nhấn lần để chọn toàn tween span Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash SAO CHÉP, DÁN VÀ LƯU CHUYỂN ĐỘNG Chuột phải chọn Copy Motion Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash 10 GROUP (NHÓM VẬT THỂ) Giữ Shift + chọn nhiều vật thể Modify > Group: nhóm & Modify > Ungroup: tách nhóm Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash 49 GRIDS (KHUNG LƯỚI) Độ nhạy -View > Grid > Show Grid: hiển thị khung lưới chỉnh hình vẽ Stage xác -View > Grid > Edit Grid: thay đổi hiển thị cho khung lưới (màu sắc, độ rộng ơ) Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash 50 NHẬP FILE LÀM VIỆC TRONG FLASH ĐỊNH DẠNG FILE NHẬP Flash đọc & nhập vào kiểu file sau: Adobe Illustrator (.ai) AutoCAD (.dxf) Bitmap (.bmp) Enhanced Windows Metafile (.emf) FreeHand (.fh, ft) GIF and animated GIF (.gif) JPEG (.jpg) PNG (.png) Flash Player (.swf) Windows Metafile (.wmf) Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash 52 ĐỊNH DẠNG FILE NHẬP Khi cài thêm plug-in QuickTime Player, Flash đọc thêm định dạng file sau: Mac Paint (.pntg) PICT (.pct) QuickTime Image (.qtif) Silicon Graphics Image (.sgi) TARGA (.tga) TIFF (.tif) Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash 53 ĐỊNH DẠNG FILE NHẬP Tùy chọn nhập vào -Import to Stage: đặt file nhập vào Stage -Import to Library: đặt file nhập vào Library -Open External Library: cho phép mở thư viện file fla -Import Video: mở Import Video wizard để hướng dẫn bước cần thiết nhập file video vào Flash Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash 54 NHẬP ẢNH TĨNH Sử dụng lệnh Import to Stage để nhập ảnh bitmap Đồng thời hình ảnh xuất bảng Library Vùng xem thử trước hình ảnh Vùng quản lý hình ảnh Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash 55 CHỈNH SỬA HÌNH ẢNH ĐƯỢC NHẬP Nhấn chuột phải vào hình ảnh hiển thị bảng Library Chọn Edit with… Nếu cài đặt Photoshop mặc định Edit with Photoshop Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash 56 CHỈNH SỬA HÌNH ẢNH ĐƯỢC NHẬP Tự động chuyển sang chương trình Photoshop để chỉnh sửa Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash 57 CẬP NHẬT FILE NHẬP Nhấn nút Properties bảng Library Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash 58 NHẬP FILE PHOTOSHOP Tùy chọn -Import this image layer as: xác định layer nhập vào dạng ảnh bitmap hay dạng layer style chỉnh sửa -Create movie clip for this layer: tạo symbol Movie Clip từ ảnh bitmap nhập vào Library -Publish settings: thiết lập kiểu nén với ảnh bitmap xuất Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash 59 NHẬP FILE PHOTOSHOP Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash 60 NHẬP FILE ILLUSTRATOR Import to Stage để nhập file fl0904.ai vào Flash Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash 61 NHẬP FILE ILLUSTRATOR Tùy chọn -Import as bitmap: chuyển đổi artwork dạng vector từ Illustrator thành ảnh bimap nhập vào Flash -Import as a single bitmap image: chuyển đổi layer dạng vector từ Illustrator thành ảnh bitmap riêng lẻ nhập vào Flash -Import unused symbols: nhập đối tượng không sử dụng từ bảng Symbol Illustrator vào Flash Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash 62 TỔNG KẾT Nắm vững trình tự chuyển động file Flash: Việc đặt vật thể layer riêng biệt giúp ích cho việc đặt thời gian chuyển động Cách tạo chuyển động với layer mask áp dụng phổ biến với dự án thực tế Nắm cách làm việc với bảng có liên quan: Align, Transform, … Chú ý tùy chọn nhập file ai, psd vào Flash Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc - Làm việc với file nhập Flash 63 ... span Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash SAO CHÉP, DÁN VÀ LƯU CHUYỂN ĐỘNG Chuột phải chọn Copy Motion Slide - Tạo hoạt hình nâng cao - Tùy biến... layer 65 Trillion Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash 13 SAO CHÉP, DÁN VÀ LƯU CHUYỂN ĐỘNG Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng... easing cho chuyển động Slide - Tạo hoạt hình nâng cao - Tùy biến luồng cơng việc - Làm việc với file nhập Flash 15 KỸ THUẬT EASING BEHAVIOR Slide - Tạo hoạt hình nâng cao - Tùy biến luồng công việc