Hướng dẫn biên soạn giáo trình điện tử bằng flash

Tài liệu được viết chi tiết, hướng dẫn từng bước cách biên soạn một bài giảng hoặc một giáo trình điện tử bằng flash với đầy đủ các kỹ năng vẽ hình, biên tập hình ảnh, xử lý các hiệu ứng, âm thanh, mô phỏng chuyển động, chèn flash vào powerpoint,... giúp cho giảng viên, sinh viên trong báo cáo, xây dựng các đề tài nghiên cứu, biên soạn sách điện tử,... đặc biệt hữu dụng cho ngành kỹ thuật.

1 HƯỚNG DẪN BIÊN SOẠN GIÁO TRÌNH ĐIỆN TỬ VỚI MACROMEDIA FLASH 1. TỔNG QUAN VỀ PHẦN MỀM MACROMEDIA FLASH Macromedia flash (gọi tắt là flash) là một phần mềm lập trình đồ họa cho phép tạo ứng dụng Web hay các ứng dụng đồ họa 2D trong nhiều lĩnh vực khác nhau. Khi đã làm việc quen với phần mềm này, chúng ta có thể khẳng định flash là một công cụ tuyệt vời cho phép làm tất cả mọi công việc từ đơn giản đến phức tạp trong việc xây dựng bài giảng điện tử nói chung và mô phỏng các trang thiết bị kỹ thuật, các quá trình công nghệ nói riêng. Ưu điểm của phần mềm là làm việc với định dạng ảnh đồ họa véctơ nên file thiết kế có dung lượng rất nhỏ. Flash có khả năng import rất nhiều định dạng ảnh (JPEG, Bitmap, gif,…), các movie clip hay các đoạn video khác để làm tài nguyên cho việc chỉnh sửa và thiết kế. Các phiên bản của phần mềm flash hiện nay có gồm flash MX2004, flash 8.0, flash 9.0, flash CS4 và flash CS5. Tuy nhiên để ứng dụng cho việc biên soạn giáo trình điện tử và mô phỏng trên máy tính chúng ta nên dùng bản flash 8.0 vì nó có giao diện dễ sử dụng, dung lượng phần mềm thấp. 1.1. Hướng dẫn cài đặt và kích hoạt phần mềm flash 8.0 Phần mềm Macromedia flash 8.0 các đồng chí có thể download từ mạng Internet, gồm có trình cài đặt (setup) và trình kích hoạt mã (key) (hình 1). - Để cài đặt double lick vào trình Flash8-en.exe, xuất hiện giao diện như hình 1. Hình 1. Giao diện ban đầu khi cài đặt - Giao diện tự động xuất hiện như 2: 2 Hình 2. Click Next để tiếp tục. Xuất hiện màn hình như hình 3. - Chọn mục I accept the terms in the license agreement sau đó click Next. Hình 3. - Giao diện như hình 4 xuất hiện. Tiếp tục đánh dấu tick vào mục Create Shortcut on Desktop sau đó click Next. 3 Hình 4. - Giao diện như hình 5 xuất hiện, giữ nguyên theo mặc định cài đặt trình Macromedia Flash Player, click Next. Hình 5. - Giao diện như hình 6 xuất hiện, click vào nút Install để cài đặt Hình 6. 4 - Quá trình cài đặt tiến hành. Khi kết thúc sẽ xuất hiện giao diện như hình 7. Click vào nút Finish để kết thúc. Hình 7. Sau khi đã cài đặt xong cần đăng ký mã key cho phần mềm bằng cách click vào biểu tượng phần mềm Macromedia flash 8.0 trên màn hình Desktop. Giao diện như hình 8 sẽ xuất hiện: Hình 8. - Để chọn mặc định mục “I have a serial number and want to activate” sau đó nhấn nút Continue để tiếp tục vào giao diện đăng ký mã như hình 9. Hình 9. Đăng ký mã kích hoạt 5 Các đồng chí cần điền đủ 21 ký tự mã key để kích hoạt phần mềm. Mã key này có được bằng cách chạy file keygen.exe lấy từ bộ cài đặt đã download từ mạng về máy tính. Chọn vào mục flash 8 và copy mã từ mục Serial sau đó paste vào khung kích hoạt mã. Nhấn nút Continue để tiếp tục, xuất hiện giao diện như hình 10. Hình 10. Trong mục này chúng ta không cần đăng ký nên nhấn nút Remind Me Later để kết thúc. 1.2. Giới thiệu giao diện của phần mềm flash 8.0 Khi click vào biểu tượng phần mềm flash 8.0 trên màn hình Desktop hay có thể vào Programs  flash 8.0 sẽ xuất hiện giao diện (hình 11). Hình 11. Giao diện ban đầu của phần mềm flash 8.0 - Tạo mới một trang thiết kế: Vào mục File  New hoặc chọn tại mục Create New  Flash Document (hình 11). - Mở file thiết kế có sẵn: Vào mục File  Open hoặc chọn tại mục Open a Recent Item  Open… Giao diện thiết kế của chương trình xuất hiệnh như trên hình 12. 6 Hình 12. Giao diện thiết kế của phần mềm flash 8.0 Trên màn hình giao diện chương trình, các nhóm công cụ thiết kế và xử lý được bố trí dưới dạng các Tab, có thể kéo di chuyển để thành bảng thuộc tính độc lập, hoặc có thể phóng to – thu nhỏ để tiện làm việc với nhóm công cụ. Giao diện chương trình gồm các phần: - Thanh Menu chương trình; - Thanh công cụ; - Vùng điều khiển chính (Timeline); - Vùng thiết kế (Stage); - Vùng các công cụ hỗ trợ thiết kế (màu sắc – Color; canh chỉnh – Align & Intro & Transform; thư viện – Library); - Vùng quản lý thuộc tính (Properties) và viết mã lệnh (Action Scrip). Muốn làm chủ flash, nhất thiết phải sử dụng thành thạo các công cụ thiết kế và xử lý đồ họa của phần mềm. Ở đây tôi chỉ giới thiệu sơ lược những đặc điểm cơ bản của các công cụ vẽ và hỗ trợ thiết kế và hướng dẫn một số thủ thuật để sử dụng phần mềm một cách hiệu quả. Phần còn lại các đồng chí có thể tham khảo các bài hướng dẫn sử dụng phần mềm flash 8.0 trên mạng hay các tài liệu khác. 7 1.3. Giới thiệu sơ lược các công cụ thiết kế cơ bản 1.3.1. Bảng quản lý thuộc tính (Properties) Bảng quản lý thuộc tính gồm các phần cơ bản như minh họa trên hình 13. Hình 13. Bảng quản lý thuộc tính thiết kế 1.3.1.1. Thay đổi thuộc tính vùng thiết kế: Nhấn vào nút Size: 550x400 pixels để mở giao diện cửa sổ thay đổi kích thước vùng thiết kế (hình 14). Hình 14. Thay đổi thuộc tính thiết kế Khi sử dụng bảng thuộc tính cần chú ý một số điểm sau: 1- Kích thước khung thiết kế (Size = Width x Height): Được chọn phù hợp với độ phân giải từng màn hình được tích hợp. Kích thước Size thể hiện chiều rộng và chiều cao của cửa sổ giao diện file thiết kế sau khi kết xuất. Phần nội dung khi thiết kế cần phải được bố trí nằm bên trong vùng kích thước đã chọn, vì nếu nằm bên ngoài có thể sẽ không được thể hiện sau khi kết xuất file. 8 2- Đơn vị đo thường để nguyên theo mặc định là pixel (pixel là đơn vị đo độ phân giải của màn hình máy tính). Độ phân giải màn hình máy tính thường có các định dạng sau: STT Kích thước size (pixels) (Width x Height) Ghi chú 1 800 x 600 Độ phân giải các màn hình máy tính PC - 14 inch cũ 2 1024 x 768 Độ phân giải chuẩn của hầu hết các màn hình máy tính 3 1280 x 768 4 1366 x 768 Độ phân giải các màn hình đặc trưng khác Chúng ta nên chọn size = 1024 x 768 pixels. Khi chạy chương trình với kích thước này, file thiết kế sẽ điền đầy màn hình máy tính. Nếu cần giao diện file thiết kế nhỏ hơn thì ta chọn lại kích thước cho phù hợp. 3- Tốc độ khung hình (frame rate): Là tốc độ đọc dữ liệu trên các khung hình khi chạy file ứng dụng. Sau khi load xong dữ liệu của file ứng dụng, đầu đọc sẽ chạy từ frame 1 đến frame cuối cùng được thiết kế. Tốc độ khung hình (frame) thể hiện số frames được chạy qua trong khoảng thời gian là 1 giây. Chúng ta nên chọn giá trị từ 12 frames/giây (fps) đến 24 frames/giây là hợp lý (chúng ta cần liên tưởng đến tốc độ của các máy quay phim là 24 hình/giây). Nếu đặt thấp quá thì hoạt hình sẽ bị giật còn nếu đặt tốc độ quá cao mắt chúng ta khó quan sát. Nói chung, tốc độ chuyển động của khung hình liên quan đến độ mịn và độ trung thực của các chuyển động được mô phỏng. 1.3.1.2. Lựa chọn định dạng file kết xuất : Kết xuất file dữ liệu (xuất bản file) là việc làm cần thiết và là công việc được tiến hành cuối cùng sau khi đã hoàn thành nội dung thiết kế để mang sang chạy trên các máy tính khác. Để kết xuất file, chúng ta chọn vào nút Settings tại mục Publish như trên hình 13. Lúc này giao diện như hình 15 sẽ xuất hiện. Các đồng chí theo dõi hướng dẫn thực hành như hình 15. Một số lưu ý khi xuất bản file thiết kế: 1- Các định dạng của file (Formats) đối với việc xây dựng bài giảng điện tử hoặc phần mềm mô phỏng chúng ta nên chọn các định dạng sau: - Định dạng file flash (Shower flash - *.swf) - Định dạng file HTML (*.html); - Định dạng file Windows projector (*.exe). 9 Hình 15. Giao diện kết xuất file thiết kế Nếu chọn định dạng *.swf thì có ưu điểm là dung lượng của file kết xuất sẽ rất thấp, đỡ tốn dung lượng máy tính. Tuy nhiên với định dạng file này, khi đem sang các máy tính khác thì trên máy đó phải cài đặt phần mềm Flash player để chạy file thiết kế có định dạng *.swf. Nếu chọn định dạng *.html thì khi đó chúng ta xuất file lên trang Web. Nó chỉ hữu dụng khi chúng ta cần đưa bài giảng lên Web. Nếu muốn chạy trên các máy tính lẻ thì định dạng này không nên sử dụng. Định dạng file tự chạy *.exe dùng cho hệ điều hành Windows là lựa chọn tốt nhất. Vì khi đó file thiết kế sau khi kết xuất có thể mang sang bất kỳ một máy tính nào khác để chạy mà không cần bất kỳ một trình hỗ trợ đọc file nào. Tuy nhiên dung lượng của file sau kết xuất có dung lượng khoảng bằng 10 lần dung lượng của file tương ứng nếu dùng kiểu định dạng *.swf. Các đồng chí nên chọn định dạng *.exe cho công việc thiết kế của mình. 10 1.3.2. Thanh công cụ vẽ Thanh công cụ chứa toàn bộ các công cụ vẽ và hiệu chỉnh đối tượng. Nhìn chung nếu ai đã sử dụng qua Photoshop, Illustrator, Firework thì chúng ta thấy các công cụ vẽ ở đây cũng tương tự vậy. Chúng ta cần tìm hiểu và thực hành nhiều để thành thạo các công cụ vẽ và hiệu chỉnh đối tượng. Ở đây tôi chỉ giới thiệu chức năng của các công cụ vẽ (hình 16). Hình 16. Thanh công cụ Thanh công cụ chứa các phần cơ bản sau: - Tools : nhóm công cụ chính dùng để thiết kế. - View : công cụ hỗ trợ việc quan sát. - Colors : công cụ tạo màu cho đối tượng vẽ trong Tools. - Options : bổ sung và mở rộng để hỗ trợ cho các công cụ trong Tools. Mỗi công cụ khác nhau sẽ có Options khác nhau. Hầu hết các công cụ đều có thể sử dụng phím tắt đi kèm, tạo thuận lợi cho quá trình thiết kế. [...]... tượng symbol (movie, button hay graphic) cho phù hợp Hình 26 Trang “Giao dien” của giáo trình điện tử mẫu Hình 27 Trang “Chuong 1” của giáo trình điện tử mẫu 20 Hình 28 Trang “Chuong 2” của giáo trình điện tử mẫu 2.1 Thiết lập các tham số thiết kế Mở phần mềm flash và thiết lập các thuộc tính file thiết kế như sau (xem hướng dẫn sử dụng trong mục 1): - Đặt kích thước vùng thiết kế: Width x Height = 950... hướng dẫn cụ thể các bước thiết kế một giáo trình điện tử theo giao diện xây dựng sẵn như trên hình 26, hình 27 và hình 28 Đây là những nội dung rất quan trọng và không thể thiếu khi xây dựng một giáo trình điện tử bằng flash Để làm được nội dung theo trang mẫu này, các đồng chí cần sử dụng thành thạo các công cụ thiết kế của phần mềm flash Mục tiêu xây dựng theo giao diện mẫu gồm: - Thiết kế một giáo. .. trong quá trình thiết kế của chúng ta Các đối tượng symbol gồm: MovieClip, Button, Graphic 18 Chú ý trong quá trình sử dụng thư viện Library, các đồng chí không được phép xóa các đối tượng chứa trong đây Vì khi đó toàn bộ nội dung liên quan đến nó nằm trên vùng thiết kế sẽ bị mất Khi đó chúng ta lại phải thiết kế lại từ đầu Hình 25 Panel Library 2 HƯỚNG DẪN THIẾT KẾ GIÁO TRÌNH ĐIỆN TỬ BẰNG FLASH Trong... action Scrip (AS) Đối với trình flash sau khi kết xuất và chạy chương trình, đầu đọc sẽ tự động đọc từ frame 1 đến frame cuối cùng của mỗi scene theo đúng thứ tự xuất hiện được sử dụng sau đó chạy lặp lại Vì vậy để điều khiển chương trình thiết kế theo ý đồ thì nhất thiết phải viết mã lệnh Mã lệnh ActionScript là một dạng ngôn ngữ lập trình hướng đối tượng được xây dựng trong Flash Ta có thể hiểu AS... công cụ Text Tool: - Cách thức nhập text trong flash cũng giống như trong Word - Có thể gõ trực tiếp đoạn văn bản trong flash hoặc có thể nhập đoạn văn bản có sẵn bằng cách Copy đoạn văn bản đó, sau đó Paste vào khung nhập văn bản của công cụ Text Tool của flash Các đồng chí hết sức chú ý đến thao tác này và nó rất quan trọng khi xây dựng bài giảng điện tử đã có sẵn nội dung từ file Word - Chúng ta... (Ctrl + S): Lưu file thiết kế theo tên tùy ý (Ví dụ: HD TK bai giang) 2.2 Sử dụng các công cụ để thiết kế giáo trình điện tử theo mẫu Sau khi đã thiết lập xong các tham số thiết kế, chúng ta cần làm một số nội dung theo trình tự sau: 2.2.1 Tạo các Scene chứa nội dung Ban đầu khi mở mới một tài liệu flash, theo mặc định chỉ có một scene có tên mặc định là scene 1 Để thêm mới các scene khác, trên thanh... thiết kế: Tạo trang giao diện của giáo trình điện tử, giới thiệu nội dung chính của tài liệu; chọn nội dung nghiên cứu cần thiết; thoát khỏi giao diện Cụ thể gồm: - Chèn hình ảnh ngoài vào làm nền - Tạo các nút ấn chuyển trang (chuyển từ trang “Giao diện” sang trang “Chuong 1”, “Chuong 2”) - Chèn các đoạn Text giới thiệu nội dung - Viết các mã lệnh điều khiển chương trình 2.2.2.1 Kỹ thuật chèn và xử... như thông thường thì khi paste sang flash thì nó sẽ có định dạng là file ảnh bitmap, không thể chỉnh sửa công thức trong flash và chất lượng hiển thị công thức sẽ bị giảm Vì vậy, nếu muốn có thể tiếp tục chỉnh sửa công thức trong flash, ta cần chọn công thức từ word khi đang ở chế độ gõ công thức bằng cách bôi đen hoặc dùng phím tắt Ctrl + A, sau đó copy  paste vào flash Khi đó công thức được paste... layer “Van ban text” sau đó click chuột vào khu vực cần đặt text trên vùng thiết kế Nhập đoạn text tiêu đề có tên “GIÁO TRÌNH ĐIỆN TỬ” Nhấp chuột ra ngoài khung nhập text sau đó chọn công cụ Selection Tool (V) để thoát khỏi chế độ nhập text Bước 4: Tạo hiệu ứng cho text thêm sinh động, bằng cách click chọn khung text vừa nhập  mở bảng thuộc tính Properties, chọn thẻ Filters, click vào nút dấu cộng... Word (đang ở chế độ gõ công thức) Paste vào trong flash Hình 35 Cách chèn công thức từ word sang flash Các đoạn text khác trong trang “Giao dien” cũng được thực hiện tương tự, tôi không giới thiệu 2.2.2.3 Kỹ thuật tạo và sử dụng đối tượng nút ấn (Button) Button là một trong ba đối tượng kiểu symbol của flash được sử dụng rất nhiều khi thiết kế chương trình Nút ấn dùng để chuyển cảnh khi người sử dụng . cho việc chỉnh sửa và thiết kế. Các phiên bản của phần mềm flash hiện nay có gồm flash MX2004, flash 8.0, flash 9.0, flash CS4 và flash CS5. Tuy nhiên để ứng dụng cho việc biên soạn giáo trình. HƯỚNG DẪN BIÊN SOẠN GIÁO TRÌNH ĐIỆN TỬ VỚI MACROMEDIA FLASH 1. TỔNG QUAN VỀ PHẦN MỀM MACROMEDIA FLASH Macromedia flash (gọi tắt là flash) là một phần mềm lập trình đồ họa cho phép tạo ứng. tính chúng ta nên dùng bản flash 8.0 vì nó có giao diện dễ sử dụng, dung lượng phần mềm thấp. 1.1. Hướng dẫn cài đặt và kích hoạt phần mềm flash 8.0 Phần mềm Macromedia flash 8.0 các đồng chí