Tính năng mới trong Adobe Flash CS4 - poly.edu.vnpoly.edu.vn/book/Trichdan_flash.pdfdiện thiết kế và xuất bản thành các file đồ họa đa phương tiện, ngoài

Bài 1

Bài 1, Tính năng mới trong Adobe Flash CS4 7

Adobe Flash là ứng dụng hàng đầu trong việc thiết kế các nội dung phong phú mang tính tương tác cho nền web. Đây cũng là một ứng dụng tiên tiến trong thiết kế game, hỗ trợ giảng dạy, cung cấp nội dung cho điện thoại di động và các ứng dụng màn hình sử dụng Adobe AIR (công cụ phát triển các ứng dụng trực tuyến). Flash CS4 Professional có rất nhiều tính năng và cập nhật về giao diện thiết kế và xuất bản thành các file đồ họa đa phương tiện, ngoài ra còn cải tiến cơ chế tạo hoạt hình hoàn thiện hơn nhiều so với phiên bản Flash cũ.

Chuẩn bịBài học này không yêu cầu sử dụng bất kỳ file bài học nào trong đĩa đi kèm sách. Bạn có thể khởi động Flash CS4 Professional và khám phá các tính năng mới. Nếu chưa cài đặt phần mềm, hãy thực hiện cài đặt Flash CS4 Professional và Adobe Media Encoder. Các chỉ dẫn cài đặt, yêu cầu hệ thống và cách sử dụng các file bài học trong đĩa đi kèm nằm trong mục “Chuẩn bị” ở trang 3 của cuốn sách này.

Nếu là người mới lần đầu sử dụng Flash hoặc đơn giản muốn bắt đầu ngay một bài học, bạn có thể chuyển sang Bài 2, “Khởi động với Flash CS4”, giống như mọi bài học khác trong cuốn sách, tại đây bạn sẽ tìm hiểu về Flash CS4 Professional thông qua những bài thực hành.

Nội dung chính trong bài:

• Khám phá những công cụ vẽ cải tiến

• Lệnh Copy và Paste Motion

• Tìm hiểu tính năng nhập và xuất thành video cải tiến

• Sử dụng ActionScript 3.0 và Flash Player 10

• Xem trước đoạn phim với Adobe Device Central

Tính năng mới trong Adobe Flash CS4

Thiết kế đồ họa động với Flash8

1 Cơ chế tạo hoạt hình mới

1 Xem minh họa Bài 1!

Quan sát video để hiểu rõ hơn cách thực hiện các tính năng được đề cập trong bài học. Video hướng dẫn có sẵn trong đĩa đi kèm sách.

Các nâng cấp mới trong Flash CS4

Flash CS4 Professional bao gồm những tính năng bổ sung và cập nhật mới làm hài lòng tất cả các đối tượng người dùng và giúp cho công việc làm việc với Flash trở nên dễ dàng và thú vị hơn bao giờ hết. Đó là một số công cụ vẽ, công cụ 3D và cơ chế tạo hoạt hình hoàn toàn mới được giới thiệu tổng quát như sau:

Cơ chế tạo hoạt hình mớiFlash giới thiệu cơ chế tạo hoạt hình hoàn toàn mới, thay đổi cách thức tạo ra motion tween (hoạt hình tự động), giúp quá trình tạo hoạt hình trở nên dễ dàng và trực quan hơn. Trong Flash CS4, hoạt hình tạo ra các tween span (nhịp chuyển động), gồm một nhóm các khung hình (frame) ghi lại và tạo hoạt hình cho những thay đổi về vị trí, tỷ lệ và màu sắc của một đối tượng trên Stage1.

Motion tween chứa các đường dẫn chuyển động (còn gọi là đường chuyển động - motion path) hiển thị quỹ đạo chuyển động hoạt hình của đối tượng trên Stage.

1 Stage: Màn hình làm việc chính, nơi mọi công việc như vẽ, chuyển động hoạt hình được thực hiện trên khu vực này


1Bảng Motion Presets

Bảng Motion Presets mới, cho phép quản lý các thiết lập có sẵn và áp dụng cho các tween span trong Timeline.

Giờ đây, đơn giản chỉ cần di chuyển playhead (đầu đọc) tới một vị trí trên Timeline1, sau đó thay đổi vị trí của đối tượng trên Stage, Flash sẽ tự động tạo hoạt hình cho bạn. Đường dẫn chuyển động được hiển thị trên Stage để bạn quan sát quỹ đạo chuyển động hoạt hình của đối tượng. Chúng ta có thể chọn và thay đổi trực tiếp đường này để điều chỉnh quỹ đạo, di chuyển hay thay đổi kích thước của toàn bộ hoạt hình một cách dễ dàng, nhanh chóng.

Bảng Motion PresetsVới Flash CS4, bạn có thể lưu lại hành vi hoạt hình của một motion tween bất kỳ vào một mục Motion Presets2. Sau đó, bạn có thể tìm lại và áp dụng một Motion Preset cho một tween span (nhịp chuyển động) hoặc đối tượng bất kỳ trên Stage, để các đối tượng đó có cùng một hành vi hoạt hình.

Bảng Motion Presets mới (Window > Motion Presets) cho phép quản lý, sắp xếp và áp dụng các thiết lập có sẵn cho tween span trong Timeline.

1 Timeline: Trục thời gian chỉ ra thời điểm hiển thị hình vẽ, văn bản, các tài liệu đa phương tiện xuất hiện theo thứ tự và tạo ra hoạt hình.2 Motion Presets: Là công cụ của Flash, cung cấp sẵn hoặc lưu giữ hiệu ứng chuyển động hoạt hình để người sử dụng áp dụng được nhiều lần khác nhau.


1 Bảng Motion Editor

Bảng Motion Editor Với Flash CS4, bạn có thể tinh chỉnh motion tween với bảng Motion Editor, một bảng hoàn toàn mới, hiển thị tất cả các thuộc tính của hoạt hình dưới dạng đồ thị. Bạn có thể thay đổi giá trị cho các thuộc tính một cách trực quan, ví dụ như vị trí và độ trong suốt của đối tượng, cũng như dễ dàng thêm các chuyển động có gia tốc (easing behavior) để mô phỏng tác dụng của lực, như trọng lực hay lực quán tính. Bảng Motion Editor cung cấp khả năng điều khiển mọi thuộc tính của motion tween, điều này chưa từng có ở những phiên bản Flash cũ, thậm chí còn cho phép thêm hoặc bớt hành vi hoạt hình mà không làm ảnh hưởng tới các đối tượng khác trên Stage.

Bảng Motion Editor mới, cung cấp khả năng điều khiển motion tween một cách trực quan.

Các chuyển động có gia tốc mới

Giờ đây, nhà thiết kế hoạt hình có thể sử dụng các chuyển động có gia tốc (như Bounce và Spring) mà trước kia phải sử dụng lập trình ActionScript mới thực hiện được. Thậm chí, bạn có thể áp dụng các kiểu chuyển động có gia tốc khác nhau cho từng thuộc tính hoặc kiểu chuyển động biến đổi hoạt hình (tween) riêng lẻ.

Các công cụ vẽ mới: Deco và Spray BrushFlash CS4 mở rộng tập công cụ có sẵn với việc bổ sung thêm hai công cụ vẽ mới là Deco và Spray Brush. Cả hai đều sử dụng các symbol1 trong thư viện để tạo các pattern (kiểu hoạ tiết lặp lại) và hiệu ứng.

Công cụ Deco được sử dụng để tạo các vùng đổ màu phức tạp, có kiểu pattern hoa lá. Công cụ đổ màu này có thể được tạo hoạt hình, giúp bạn tạo ra những hiệu ứng thú vị mà không tốn nhiều công sức. Deco cũng bao gồm một công cụ mới là Symmetry Brush - sử dụng các symbol trong thư viện để tạo ra các pattern phức tạp dạng đối xứng.

Công cụ Spray Brush cho phép tô các pattern và bề mặt, sử dụng các symbol trong thư viện. Công cụ này còn cung cấp khả năng điều khiển kích thước cọ vẽ, tỷ lệ symbol và độ đậm nhạt của mực vẽ.

1 Symbol: Các hình vẽ, hình ảnh và hoạt hình được lưu trữ trong thư viện của file Flash.


1Công cụ 3D Rotation và 3D Translation

Những người sử dụng Illustrator sẽ nhận ra rằng công cụ Spray Brush trong Flash khá giống với công cụ Symbol Sprayer trong Illustrator CS4.

Tìm hiểu thêm về các công cụ vẽ trong Bài 3, "Làm quen với các công cụ vẽ" và Bài 5, "Các công cụ nâng cao".

Các pattern độc đáo có thể được tạo ra dễ dàng với công cụ Spray Brush (trên) và công cụ Deco (dưới).

Công cụ 3D Rotation và 3D TranslationMột bổ sung quan trọng khác, ngoài Flash Player 10 và tập công cụ vẽ, Flash CS4 còn hỗ trợ 3D thông qua công cụ 3D Rotation và 3D Translation. Giờ đây, bạn có thể xoay và biến đổi symbol theo trục x, y và z, ngoài ra, tất cả các bề mặt còn có thể được tạo hoạt hình hoặc chỉnh sửa trong bảng Timeline và bảng Motion Editor.

Bất kỳ nội dung 2D nào cũng có thể được xuất sang dạng 3D, ở đó các hiệu ứng phối cảnh và lia ảnh cho độ chân thực tương đương với ảnh đồ họa, thậm chí với cả ảnh bitmap. Hơn nữa, tất cả các bề mặt 3D đều có thể được điều khiển bằng lập trình, sử dụng các lệnh và các lớp trong ActionScript 3.0.


1 Inverse Kinematics: Công cụ Bone và Bind

Kỹ thuật tạo hoạt hình và công cụ 3D được đề cập trong Bài 5, "Các công cụ nâng cao" và Bài 7, "Hoạt hình nâng cao."

Bạn có thể xoay và tạo hoạt hình cho bất kỳ đối tượng 2D nào thành dạng 3D với sự hỗ trợ 3D và các công cụ vẽ.

Inverse Kinematics: Công cụ Bone và BindMột khái niệm rất quen thuộc trong lĩnh vực 3D và hoạt hình truyền thống, đó là Inverse Kinematics (IK - Hệ thống chuyển động đảo ngược). Khái niệm này quy định cách thức liên kết, chuyển động của đối tượng trong một chuỗi gồm các đối tượng được nối với nhau khi một đối tượng trong đó dịch chuyển. Hãy liên tưởng tới cánh tay của bạn: khi di chuyển cánh tay, toàn bộ bàn tay và cẳng tay đều thay đổi vị trí theo ba khớp nối. Việc tạo kiểu này được cải tiến qua từng phiên bản Flash, tuy nhiên vẫn rất phức tạp và khó sử dụng với người dùng, song với phiên bản CS4 thì khác.

Giờ đây, bạn có thể nối các hình vẽ (shape - là những hình ảnh dưới dạng vector) hoặc symbol với nhau thành một đối tượng IK, tạo ra các tư thế và tạo hoạt hình trong Timeline. Công cụ Bone và Bind cho phép bạn vẽ các khung xương giả lập để nối các đối tượng với nhau, sau đó chỉnh sửa kết nối giữa các đối tượng, điều này mở ra những khả năng sáng tạo không giới hạn cho hoạt hình truyền thống cũng như cho người sử dụng Flash.


1Cải tiến việc quản lý thư viện

Bạn sẽ tìm hiểu chi tiết cách nối đối tượng và tạo hoạt hình cho các tư thế trong Bài 5, "Các công cụ nâng cao" và Bài 7, "Hoạt hình nâng cao."

Giờ đây, bạn có thể nối các hình vẽ và symbol để tạo và hoạt hình hóa các tư thế theo nguyên lý IK.

Cải tiến việc quản lý thư việnTrong Flash CS4, khi tạo mới hoặc chuyển đổi các nội dung có sẵn thành symbol, bạn có thể sắp xếp những symbol đó vào trong thư mục mới hoặc thư mục có sẵn. Ngoài ra, bạn có thể tìm kiếm symbol trong thư viện theo tên bằng cách sử dụng trường Search nằm ở trên cùng của bảng Library, đây là một tính năng mới trong Flash CS4.

Giao diện CS4 mớiThay đổi rõ nét nhất của CS4 đó là giao diện và không gian làm việc mới với sự thay đổi vị trí của một số bảng quan trọng (như Timeline và Property Inspector1), ngoài ra việc tổ chức không gian làm việc cũng trở nên dễ dàng hơn bao giờ hết. Có rất nhiều thiết lập không gian làm việc hỗ trợ sẵn, trong đó có thiết lập Classic. Thiết lập này sắp xếp, bố trí các bảng và vị trí Stage giống như trong phiên bản CS3.

Nhiều bảng khác cũng được tổ chức lại như bảng Property Inspector, trong CS4, bảng này xuất hiện dọc theo không gian làm việc và bao gồm các mục như Color (màu sắc), Sound (âm thanh) và Filters (hiệu ứng lọc). Các bảng có thể được thu gọn để tiết kiệm không gian làm việc hoặc có thể được mở rộng khi cần, các vùng trong bảng cũng vậy.

1 Property Inspector: Bảng chứa các đặc tính để điều chỉnh đối tượng hoạt hình.


1 Định dạng video F4V mới

Những người dùng Flash giàu kinh nghiệm có thể nhận thấy sự thiếu vắng của các bảng Parameters (bảng chứa tham số) và Filters (bảng chứa hiêu ứng lọc). Trong CS4, chức năng tương ứng của các bảng này được bao hàm luôn trong bảng Property Inspector.

Giao diện CS4 mới trông sáng sủa, dễ sử dụng hơn và bao gồm một số thiết lập hữu dụng.

Định dạng video F4V mớiĐịnh dạng F4V mới của Flash hứa hẹn cho chất lượng video cao và tốn ít dung lượng lưu trữ hơn; ngoài ra, Flash còn hỗ trợ các định dạng video MPEG-4 và định dạng âm thanh AAC. F4V hỗ trợ mã hóa sử dụng codec h.264, một codec chuẩn công nghiệp, để cung cấp nội dung chất lượng HD trực tuyến và trên đĩa Blu-ray. Ngoài h.264, F4V còn hỗ trợ mã hóa âm thanh HE-AAC, chuẩn mã hóa này cho chất lượng âm thanh cao hơn so với MP3.

Định dạng F4V có thể được tạo ra thông qua quá trình nhập video vào Flash (File > Import > Import Video) hoặc sử dụng ứng dụng Adobe Media Encoder.


1Adobe Media Encoder

Adobe Media EncoderThay thế cho ứng dụng Flash Video Encoder ở phiên bản trước, Adobe Media Encoder trong phiên bản CS4 giúp đơn giản việc mã hóa các định dạng video phổ biến. Giờ đây bạn có thể chuyển đổi nhiều video sang định dạng .flv và .f4v để sử dụng cho các dự án tương tác hoặc thêm vào đoạn phim tạo bởi Premiere and After Effects (Phần mềm chuyên nghiệp để dựng phim).

Lưu các thiết lập chung thành các thiết lập có sẵn hoặc chọn trong các thiết lập có sẵn đi kèm.

Adobe Media Encoder giúp đơn giản hóa quá trình mã hóa video.

Tổng kết

Bạn vừa được giới thiệu sơ lược những tính năng mới và các cập nhật trong Flash CS4, đã tới lúc thực hành để xem những tính năng đó hoạt động như thế nào. Hãy bắt đầu ngay với Bài 2, "Khởi động với Flash CS4", trong đó bạn sẽ đi sâu và làm việc với Flash CS4 Professional. Bạn sẽ tìm hiểu thêm về các tính năng được giới thiệu ở trên thông qua các bài học trong cuốn sách này.

Bài 2

Bài 2, Khởi động với Flash CS4 17

Bài học này cung cấp cho bạn những kiến thức cơ bản để sử dụng Flash CS4 Professional.

Chuẩn bịTrong bài học này, bạn sẽ thiết lập một file Flash mới, thao tác trên các file có sẵn (đính kèm trong đĩa) để quen với công cụ và tính năng của phần mềm .

Trước khi bắt đầu, hãy cài đặt và thiết lập các bảng và công cụ về mặc định. Xem mục “Thiết lập không gian làm việc Flash về mặc định” ở trang 3.

Bạn sẽ làm việc với một số file trong thư mục fl02lessons, đảm bảo rằng bạn đã sao chép thư mục fllessons vào ổ cứng từ đĩa đính kèm. Xem mục “Sao chép các file bài học” ở trang 3.

Nội dung chính trong bài:

• Các tính năng quan trọng của Flash

• Giới thiệu Flash Player • Lưu và mở file • Không gian làm việc

trong Flash • Kỹ thuật vẽ và tạo hoạt

hình cơ bản

Khởi động với Flash CS4


2 Flash là gì?

Xem minh họa Bài 2!

Quan sát video để hiểu rõ hơn cách thực hiện các tính năng được đề cập trong bài học. Video hướng dẫn có sẵn trong đĩa đi kèm sách.

2

Flash là gì?Có thể bạn đã từng nghe hoặc nhìn thấy Flash trên các website, trong các game trực tuyến hoặc các quảng cáo trên web (như trong các trang tin tức dantri.com, vnexpress.net…; các mạng xã hội zing, facebook…). Nhưng liệu bạn có biết rằng Flash còn có thể tạo ra nhiều ứng dụng khác, ngoài việc tạo ra các hình ảnh hoạt hình? Với Flash CS4 Professional, bạn có thể: tạo và chỉnh sửa video, âm thanh; kết nối với cơ sở dữ liệu và nhiều ứng dụng khác.

Flash CS4 Professional cung cấp 4 tính năng chính sau:

Môi trường vẽ đồ họa. Flash cung cấp một bộ đầy đủ các công cụ vẽ cho phép xử lý hình vẽ phức tạp. Giống như Adobe Illustrator CS4, Flash là một ứng dụng vẽ vector. Với Flash, bạn có thể tạo ra các hình vẽ phong phú với những chi tiết phức tạp và có thể thu phóng tùy thích. Flash hỗ trợ hầu hết tất cả các định dạng file đồ họa tạo ra từ các phần mềm thiết kế chuyên dụng như: corel draw (.eps), Illustrator (.ai), Photoshop (.psd), Autocard (.dxf), Firework(.png)... Điều này giúp bạn dễ dàng làm việc với các ứng dụng mình yêu thích. Tất cả các nội dung được tạo ra trong Flash hoặc từ các ứng dụng khác đều có thể trở nên sinh động hơn thông qua hoạt hình và tương tác. Ví dụ như sau khi thiết kế bằng phần mềm Photoshop, bạn có thể đưa vào flash để tạo chuyển động.

Tạo hoạt hình: Hoạt hình tạo bởi Flash có dung lượng gọn nhẹ, tích hợp hình ảnh, âm thanh và video, cho phép tải về nhanh chóng thông qua web. Adobe Flash CS4 đã trở thành một công cụ yêu thích, và là lựa chọn hàng đầu, được các nhà thiết kế cũng như phát triển web tin dùng để tạo ra các trang web tuyệt đẹp, đẳng cấp. Hoạt hình trong Flash có thể được sử dụng cho các website, CD-ROM, các game tương tác và trở nên rất phổ biến trong các quảng cáo mang tính tương tác trên nền web. Quan trọng là dung lượng gọn nhẹ của file Flash xuất ra từ Adobe Flash CS4 rất phù hợp để tạo ra các nội dung hoạt hình, game và ứng dụng cho điện thoại di động hay thiết bị PDA.


2Flash là gì?

Flash hỗ trợ kiểu hoạt hình frame-by-frame truyền thống (chuyển động từng khung hình nối tiếp nhau) đồng thời cũng hỗ trợ cách tạo hoạt hình riêng, được biết tới với tên gọi là tweening (biến đổi hoạt hình). Với tweening, bạn chỉ cần xác định đối tượng cần tạo hoạt hình, tạo ra một khung hình (frame) bắt đầu và kết thúc; sau đó Flash sẽ tự động tạo ra các khung hình xen giữa để tạo ra hiệu ứng hoạt hình, biến đổi màu sắc hoặc hình dạng một cách mượt mà. Bạn sẽ thực hành việc tạo hoạt hình trong Bài 6, “Tạo hoạt hình cơ bản”.

Tweening trong Flash sinh ra các ảnh tự động thay đổi sao cho phù hợp với sự biến đổi từ khung hình bắt đầu đến khung hình kết thúc.

Tạo layout. Flash cung cấp khả năng linh hoạt, cho phép tạo ra các layout (bố cục) website tuyệt đẹp mà không gặp hạn chế so với việc thiết kế bằng HTML thông thường. Vị trí của nội dung có thể được xác định tại bất kỳ nơi nào trên Stage (khung hình hiển thị flash) một cách linh hoạt và chính xác, điều này xóa bỏ những hạn chế về bố cục của các trang web tĩnh. Các đoạn phim Flash cũng có thể chứa nhiều kiểu font chữ khác nhau, điều này cho phép bạn tùy ý sử dụng những kiểu chữ ưa thích hay font chữ đặc biệt trong trang web, việc làm này thường rất khó thực hiện đối với các ứng dụng thiết kế web khác.


2Lập trình. Ẩn đằng sau vẻ đẹp của Flash CS4 Professional là “bộ não” ActionScript, đây là ngôn ngữ lập trình kịch bản mạnh mẽ, được tích hợp để mở rộng khả năng của thiết kế cũng như hoạt hình. Với kiến thức cơ bản về ActionScript sẽ được đề cập trong Bài 10, “Giới thiệu về ActionScript”, bạn có thể điều khiển xem video, gán chức năng cho button (nút bấm). Tìm hiểu sâu hơn, bạn sẽ thấy rằng ActionScript có thể thực hiện được rất nhiều điều, ví dụ như tạo ra các ứng dụng mua sắm trực tuyến, chơi nhạc, game, ứng dụng trên điện thoại di động.

Flash là gì?

Flash có thể tạo ra các game gọn nhẹ cho điện thoại di động, thiết bị PDA và các thiết bị khác.

Giới thiệu về Flash Player

Flash Player là một ứng dụng độc lập, được tích hợp trong các trình duyệt như Internet Explorer, Safari và Firefox. Flash Player được sử dụng để xem các phim nén Flash (file .swf), cũng giống một máy chiếu phim để xem các băng phim khác nhau.

Tuy nhiên, Flash Player không đơn giản chỉ là một máy chiếu phim thông thường mà còn có thể tương tác với người dùng bằng hiệu ứng nhấn, di chuột... thông qua ngôn ngữ kịch bản Action Script.

Tại thời điểm viết cuốn sách này (2010), Flash Player đã được cài đặt và sử dụng trên hơn 99% máy tính dùng Internet, vì thế những sản phẩm của bạn tạo ra với Flash có số lượng người xem rất lớn. Những người chưa cài đặt Flash Player có thể tải miễn phí phần mềm này trên website của Adobe, adobe.com.

Flash Player 10, bao gồm cả phiên bản chạy độc lập và phiên bản tích hợp trong trình duyệt, được tự động cài đặt kèm theo ứng dụng Flash CS4 Professional.


2Các kiểu file Flash

Các kiểu file FlashBạn sẽ làm việc với hai kiểu file trong Flash: .fla1 và .swf2. Mỗi định dạng được sử dụng với mục đích khác nhau trong quá trình tạo đoạn phim Flash.

Khi bạn tạo và lưu một file mới, Flash sẽ tự động sinh ra một file định dạng .fla. Đây là những file sử dụng để thiết kế, chỉnh sửa và lưu trữ các tài nguyên như hình vẽ, ảnh, âm thanh và video. Ngoài ra, mỗi file .fla cũng lưu trữ các thiết lập riêng cho việc xuất bản cuối cùng. Bởi vì mục đích là hỗ trợ thiết kế và chỉnh sửa nên file .fla không thể xem được với Flash Player - thay vào đó, chúng được sử dụng làm cơ sở để xuất bản file sản phẩm với định dạng .swf.

Định dạng file Shockwave Flash có đuôi mở rộng .swf là các file hoàn chỉnh, được nén bởi Flash CS4 Professional. Những file này được tạo ra từ file .fla ban đầu và là định dạng file duy nhất mà Flash Player có thể hiển thị và chạy được. Mặc dù có thể nhập các file .swf vào Flash CS4 Professional nhưng bạn không thể chỉnh sửa các file này, muốn thay đổi hoặc thêm các chi tiết, bạn bắt buộc phải mở lại file .fla ban đầu.

Như vậy, bạn đã biết file được sử dụng để làm việc trong Flash. Giờ là lúc bắt đầu với file đầu tiên và tìm hiểu không gian làm việc của Flash CS4 Professional.

1Fla: File gốc dung lượng lớn có thể chỉnh sửa2Swf: File sản phẩm đã xuất bản, dung lượng nhỏ và không thể chỉnh sửa.


2 Tạo một file mới

Tạo một file mớiTrước khi vẽ hoặc tạo hoạt hình, bạn cần phải tạo ra một file mới, cụ thể hơn đó là một file .fla. Bạn có thể tạo và mở các file từ màn hình Welcome Screen hoặc từ menu File phía trên cùng màn hình.

Màn hình Welcome Screen là một bảng tiện ích để tạo và mở các file, có chứa các mẫu tạo sẵn (template) cơ bản, rất thuận tiện để chọn làm việc, ví dụ như mẫu banner và hình đồ họa quảng cáo cho điện thoại. Màn hình Welcome Screen xuất hiện khi Flash được khởi động lần đầu tiên hoặc khi không có file nào được mở trong ứng dụng

Màn hình Welcome là một bảng tiện ích để tạo mới các file, chứa nhiều mẫu tạo sẵn cho các dự án thông thường.

1 Để tạo mới một file .fla từ màn hình Welcome Screen, hãy mở Flash CS4 Professional. Nếu ứng dụng đã được mở sẵn, hãy đóng tất cả các file đang mở bằng cách chọn File > Close All.

2 Từ cột Create New giữa màn hình Welcome Screen, chọn Flash File (ActionScript 3.0). Không gian làm việc với Stage, Timeline và bảng Tools sẽ xuất hiện.Bạn cũng có thể tạo một file .fla mới bằng cách sử dụng menu File thay vì sử dụng màn hình Welcome Screen.

3 Chọn File > New. Hộp thoại New Document xuất hiện.

4 Chọn Flash File (ActionScript 3.0) và nhấn OK để tạo ra một file mới. Không gian làm việc cũng xuất hiện.


2Thiết lập file mới

Bạn vừa tạo ra một file Flash mới, hãy dành thời gian để xác định một số thiết lập quan trọng cho file này.

1 Chọn Modify > Document hoặc sử dụng tổ hợp phím tắt Ctrl+J (Windows) hoặc Command+J (Mac OS) để mở hộp thoại Document Properties.

2 Trong trường văn bản Width và Height, nhập các giá trị 500 và 300 để thiết lập kích thước tương ứng cho đoạn phim. Các kích thước này thiết lập chiều rộng và chiều dài cho Stage theo đơn vị pixel. Kích thước của Stage chính là kích thước hiển thị của đoạn phim cuối cùng, vì vậy hãy chắc chắn rằng kích thước vừa xác định chứa hết toàn bộ thiết kế mà bạn muốn tạo ra.

3 Nhấn vào ô chọn màu Background Color ( ), bảng Swatches xuất hiện. Bảng này cho phép bạn chọn màu cho Stage, đây cũng chính là màu nền của đoạn phim cuối cùng (file .swf) được xuất bản. Nếu cần, hãy thiết lập màu nền về màu trắng (#FFFFFF).

4 Nhập 30 vào trường Frame rate để thiết lập tỷ lệ khung hình/giây bằng 30 fps (khung hình trên giây). Tỷ lệ khung hình/giây xác định tốc độ xem và chất lượng của đoạn phim. Tỷ lệ này càng cao, flash chuyển động càng mịn, nhưng kèm theo đó bạn phải làm nhiều khung hình hơn. Bạn sẽ tìm hiểu sâu hơn về việc tinh chỉnh tỷ lệ khung hình/giây trong Bài 7, “Hoạt hình nâng cao”.

Tạo một file mới

Tùy chọn Match to Printer thiết lập kích thước file vừa với khổ giấy của máy in mặc định. Tùy chọn này thường được thiết lập là Default, tương đương với việc bạn tự xác định chiều rộng và chiều dài hoặc sử dụng thiết lập Dimensions mặc định lưu trong Flash.

5 Trong menu Ruler units, chọn đơn vị Pixels. Việc chọn này sẽ định nghĩa đơn vị pixel được sử dụng làm thước đo trong đoạn phim Flash, bao gồm các thước căn, bảng và hộp thoại.

6 Nhấn OK để thoát khỏi hộp thoại Document Properties và áp dụng các thiết lập vừa chọn cho file. Để file mở. Bạn sẽ lưu file này trong phần tiếp theo của bài học.

Sử dụng hộp thoại Document Properties để xác định các thiết lập.


2

Nếu là người mới bắt đầu thiết kế web, bạn có thể cảm thấy hơi lạ với khái niệm pixel. Để đơn giản, hãy ghi nhớ rằng, thông thường kích thước 1 inch có chứa 72 pixel. Nếu muốn, bạn có thể sử dụng hộp thoại Document Properties để thay đổi Ruler units của file bằng một đơn vị đo khác bất kỳ lúc nào.

Luôn nhớ kèm theo đuôi mở rộng .fla ở cuối tên file để xác định định dạng của file.

Tạo một file mới

Lưu file Flash

File mới tạo ra nên được lưu lại trước khi bắt đầu làm việc hoặc thêm các nội dung. Theo mặc định, Flash sẽ lưu file dưới định dạng Flash CS4 (.fla).

1 Chọn File > Save.

2 Trong hộp thoại Save As xuất hiện, nhập fl0201_work.fla vào trường văn bản Name. Tìm tới thư mục fl02lessons và nhấn Save. Chọn File > Close để đóng file.

Sử dụng hộp thoại Save để chọn tên và vị trí lưu file.

Để file được lưu có thể sử dụng được trong các phiên bản Flash cũ hơn, bạn có thể chọn lưu file theo định dạng Flash CS3. Đặc điểm của Flash là phiên bản CS3 không thể đọc được những file .fla tạo bởi CS4. Vậy nếu muốn có độ tương thích cao, bạn nên lưu lại theo định dạng Flash CS3. (Lưu ý: Trường hợp đặc biệt là nếu sử dụng chuyển động 3D, bạn sẽ không thể lưu được thành định dạng của Flash CS3).


2Tạo một file mới

Làm quen với các mẫu tạo sẵn

Flash có chứa rất nhiều các mẫu tạo sẵn, giúp đơn giản hóa quá trình thiết lập cho các dự án Flash thông thường. Tạo các file từ những mẫu tạo sẵn sẽ giữ nguyên các cấu hình thiết lập từ trước, như kích thước file và phiên bản ActionScript. Chọn File > New > Template để xem các mẫu tạo sẵn của Flash.

Trong mục Advertising, các mẫu tạo sẵn bao gồm các banner với kích thước phổ biến. Lưu ý rằng các file mẫu tạo sẵn có thiết lập phiên bản cho Flash Player1 và ActionScript để đạt được độ tương thích tối đa. Nếu bạn muốn sử dụng các kỹ thuật và tính năng mới nhất trong Flash CS4, việc tạo file từ các mẫu tạo sẵn có thể bị hạn chế.

Mục Handset và Devices sẽ tự động thiết lập kích thước file tương ứng với độ phân giải của các thiết bị được chọn. Những mẫu tạo sẵn này cũng sử dụng phiên bản phù hợp của Flash Lite (Flash Lite là Flash Player nhưng dành cho điện thoại và các dòng máy cầm tay).

Mục Photo Slideshow với mẫu tạo sẵn Modern Photo Slideshow kèm theo được sử dụng để trình chiếu ảnh một cách nhanh chóng và dễ dàng. Bạn chỉ cần thêm các ảnh trình chiếu vào file. Tất cả các mã ActionScript tương ứng đã được viết sẵn cho bạn.

Modern Photo Slideshow là một trong nhiều mẫu tạo sẵn rất hữu dụng có trong hộp thoại New from Template.

1Flash Player: Trình hiển thị flash, có thể chạy riêng hoặc tích hợp vào trình duyệt dưới dạng plugin


2 Tạo một file mới

Mở file

Việc mở một file cũng quan trọng như việc lưu file. Ngoài việc mở những file tạo bởi Flash CS4 Professional, ví dụ như các file đi kèm cuốn sách này, bạn còn có thể mở các file được tạo bằng các phiên bản Flash cũ hơn. Các bước để mở file rất đơn giản.

1 Chọn File > Open. Sử dụng hộp thoại Open để tìm tới file fl0201_work.fla đã được lưu từ trước trong thư mục fl02lessons.

2 Chọn file fl0201_work.fla, sau đó nhấn Open. Giữ file này được mở. Bạn sẽ sử dụng file này cho các bài tập tiếp theo.

Đừng nhầm lệnh Open với các tùy chọn Import trong menu File. Menu Import được sử dụng để truy cập tới các file được tạo bởi các ứng dụng khác, chẳng hạn như Photoshop hay Illustrator. Việc nhập các file của các ứng dụng khác sẽ được đề cập chi tiết trong Bài 9, “Làm việc với các file nhập vào Flash”.

Bạn cũng có thể mở các file bằng cách sử dụng nút Open ( ) ở phía dưới cột Open Recent Items trong màn hình Welcome Screen. Phía trên biểu tượng này là danh sách tám file mới nhất mà bạn đã làm việc; đây cũng là một cách rất hữu ích ngoài việc sử dụng menu Open Recent.

Nếu muốn mở lại một file vừa mới làm việc, hãy chọn File > Open Recent, sau đó chọn file mà bạn cần.

Chọn File > Open Recent để truy cập tới các file vừa mới được làm việc trong Flash.


2Không gian làm việc Flash

Không gian làm việc FlashBạn đã biết cách tạo, lưu và mở file trong Flash. Giờ là lúc làm quen với không gian làm việc, nơi mà bạn sẽ dành phần lớn thời gian để tạo ra các nội dung Flash.

Stage và vùng làm việc

Sau khi tạo ra một file Flash, vùng ở chính giữa màn hình được gọi là Stage, đây là nơi diễn ra các tác vụ. Stage là vùng hiển thị đoạn phim, là nơi đặt các hình vẽ và tạo ra hoạt hình. Theo mặc định, Stage có màu trắng; tuy nhiên bạn có thể thay đổi màu cho Stage bằng cách sử dụng lệnh Modify > Document trong hộp thoại Document Properties.

Vùng màu xám bao xung quanh Stage là vùng làm việc; hình vẽ được đặt vào hoặc tạo ra ở vùng làm việc không được thêm vào đoạn phim cuối cùng. Hãy hình dung vùng làm việc giống như hậu trường của một sân khấu; ví dụ, bạn có thể tạo hoạt hình cho một ký tự di chuyển từ vùng làm việc sang Stage. Vùng làm việc cũng là nơi phù hợp để lưu trữ các đối tượng chưa sẵn sàng để xuất hiện trên đoạn phim. Kích thước của Stage chính là kích thước thực sự của đoạn phim được xuất bản cuối cùng.

A. Vùng làm việc. B. Stage.

A

B


2Bảng Tools của Flash

Bảng Tools trong Flash chứa mọi công cụ mà bạn cần để tạo mới, chọn hoặc chỉnh sửa hình vẽ trên Stage. Bạn có thể sử dụng biểu tượng hai mũi tên nằm ở trên cùng của bảng Tools để thu gọn hoặc mở rộng bảng.

Không gian làm việc Flash

Bảng Tools.

Công cụ Selection (V)

Công cụ Subselection (A)

Công cụ Free Transform (Q)

Công cụ 3D Rotation (W)

Công cụ Pen (P)

Công cụ Text (T)

Công cụ Line (N)

Công cụ Rectangle (R)

Công cụ Pencil (Y)

Công cụ Brush (B)

Công cụ Deco (U)

Công cụ Bone (X)

Công cụ Paint Bucket (K)

Công cụ Eyedropper (I)

Công cụ Eraser (E)

Công cụ Hand (H)

Công cụ Zoom (M)

Stroke Color

Fill Color

Black and WhiteSwap Colors

Snap to Objects

Smooth

Straighten

Công cụ Lasso (L)



BIỂU TƯỢNG TÊN CÔNG CỤ CÁCH SỬ DỤNG BÀI HỌC ĐỀ CẬP TỚI

Selection Di chuyển các đối tượng được chọn hoặc layer. Bài 2, 3

Subselection Chọn và di chuyển các điểm neo trên path (đường vẽ). Bài 3

Free Transform Thay đổi kích thước, xoay và cắt xén đối tượng. Bài 6

Lasso Tạo vùng chọn. Bài 3

3D Rotation Xoay các đối tượng trong không gian 3D. Bài 7


Ink Bottle Áp dụng hoặc thay đổi màu stroke (đường viền). Bài 3, 4

Paint Bucket Áp dụng hoặc thay đổi màu tô (Fill). Bài 3, 4

Eyedropper Lấy mẫu màu và style. Bài 3, 4

Eraser Xóa hình.Công cụ này không được đề cập tới trong cuốn sách này

BoneTạo các đối tượng theo nguyên lý IK (Inverse Kinematic - Hệ thống chuyển động đảo ngược).

Bài 5, 7


Pen Vẽ đường vector. Bài 3

Text Tạo một ô văn bản. Bài 3

Line Vẽ đường thẳng. Bài 3

Shapes Vẽ các hình vector. Bài 3

Pencil Vẽ các đường tự do. Bài 3

Brush Vẽ các vùng tô màu tự do. Bài 4

Deco Tạo ra các pattern (mẫu họa tiết lặp lại) sử dụng symbol. Bài 5

Các công cụ chọn

Các công cụ màu sắc

Các công cụ vẽ và công cụ văn bản


2


Hand Di chuyển trang. Bài 8

Zoom Tăng giảm kích thước xem tương đối. Bài 8

Các công cụ di chuyển


Stroke Color Chọn màu cho stroke (đường viền). Bài 3

Fill Color Chọn màu tô. Bài 3

Default Stroke/Fill

Thiết lập màu stroke và màu tô (màu đổ) về màu đen và trắng mặc định.

Bài 3

Swap Colors Hoán đổi màu stroke và màu tô. Bài 3

No Color Thiết lập màu chọn về none (không màu). Bài 3


Snap to Objects

Kích hoạt chế độ bắt điểm giữa các đối tượng trên Stage. Bài 5

Các công cụ chọn stroke và chọn màu tô

Tùy chọn cho công cụ

Bảng Property Inspector

Bảng Property Inspector xuất hiện bên phải không gian làm việc Flash. Nằm cùng nhóm với bảng Library, bảng Property Inspector hiển thị các thuộc tính và tùy chọn của đối tượng được chọn trên Stage, đồng thời cho phép thay đổi giá trị của các thuộc tính và tùy chọn đó. Đây là bảng ngữ cảnh, có nghĩa là các thông tin hiển thị trên bảng này thay đổi phụ thuộc vào công cụ hoặc đối tượng được chọn.

Bảng Property Inspector là một tính năng quan trọng trong tiến trình làm việc Flash; bảng này cho phép hiển thị hoặc thay đổi giá trị các thuộc tính của đối tượng, như độ rộng, chiều cao, vị trí và màu tô (màu đổ). Hãy cùng xem xét kỹ hơn về hoạt động của bảng Property Inspector.




1 Nếu file fl0201_work.fla chưa mở, hãy chọn File > Open để mở lại file đó trong thư mục fl02lessons. Chọn công cụ Rectangle ( ) trong bảng Tools.

2 Ở phía dưới bảng Tools, nhấn ô chọn màu Fill Color (mẫu màu tô) ( ). Khi bảng Swatches xuất hiện, hãy chọn màu vàng sẫm ở phía bên phải của bảng.

Sử dụng các mẫu màu ở phía dưới bảng Tools để chọn màu tô và màu stroke.

3 Di chuyển con trỏ tới chính giữa Stage. Nhấn và giữ chuột, sau đó kéo để vẽ một hình chữ nhật. Thả chuột ra sau khi hình chữ nhật được tạo ở chính giữa Stage.

Để vẽ các hình trên Stage, chọn một công cụ tạo hình, sau đó nhấn và kéo chuột.

4 Chọn công cụ Selection ( ) ở trên cùng bảng Tools, sau đó nhấn đúp lên vùng đổ màu của hình chữ nhật vừa tạo. Bây giờ bảng Property Inspector ở bên phải không gian làm việc đang hiển thị chiều rộng (W) và chiều cao (H) bằng pixel của hình chữ nhật vừa chọn. Phía trên ô văn bản width và height là các tọa độ X, Y của đối tượng trên Stage.


25 Nhấn vào chữ số gạch chân cạnh ô văn bản W: để highlight giá trị hiện tại, sau đó

nhập giá trị 250 để thiết lập chiều rộng cho hình chữ nhật. Nhấn Enter (Windows) hoặc Return (Mac OS). Áp dụng tương tự để thiết lập chiều cao của hình chữ nhật bằng 150.


Bạn có thể sử dụng bảng Property Inspector để thiết lập các thuộc tính cho hình được chọn.

6 Chọn công cụ Text ( ) trong bảng Tools. Nhấn vào phía trên hình chữ nhật và nhập cụm từ Flash CS4. Bây giờ thấy rằng bảng Property Inspector hiển thị các tùy chọn văn bản như font chữ và kích cỡ.

Khi văn bản được chọn, bảng Property Inspector hiển thị các tùy chọn tương ứng như font chữ và cỡ chữ.



7 Nhấn và kéo chuột vào bên trong văn bản vừa tạo để chọn toàn bộ văn bản. Trong bảng Property Inspector, tìm tới menu Family và chọn Arial (nếu không có, hãy chọn Verdana thay thế). Nhấn vào tùy chọn Size và thiết lập cỡ chữ bằng 45.

8 Trong bảng Property Inspector, nhấn vào ô chọn màu Color và chọn màu xanh nước biển từ bảng Swatches để thay đổi màu cho chữ. Trong bài tập này, sử dụng giá trị màu #000099.

Chọn và thiết lập định dạng cho chữ trực tiếp từ bảng Property Inspector.


2 Không gian làm việc Flash

9 Chọn File > Save để lưu file, sau đó chọn File > Close.Ngoài văn bản và hình vẽ, bảng Property Inspector cũng làm việc với Timeline, cho phép thiết lập các tùy chọn và xem thông tin của từng khung hình. Bạn sẽ sử dụng thường xuyên bảng Property Inspector trong hầu hết các bài học để chỉnh sửa đối tượng trên Stage và các khung hình trong Timeline.

Bảng Property Inspector hiển thị tùy chọn của công cụ hoạt động hoặc thông tin của đối tượng được chọn, thậm chí là thông tin của các khung hình trong Timeline.

Các bảng và nhóm bảng

Không gian làm việc của Flash cực kỳ linh hoạt. Không gian làm việc được tổ chức thành chuỗi các bảng, trong đó có nhiều bảng mà bạn sẽ thường xuyên phải sử dụng như Library, Property Inspector và Timeline. Các bảng này có thể được tổ chức lại. Bạn cũng có thể mở các bảng khác (qua menu "window") và sắp xếp, nhóm hay thay đổi kích thước các bảng theo ý thích.

Các bảng có thể được thay đổi vị trí, kích thước và phân nhóm tùy ý.



Bạn sẽ tìm hiểu chi tiết hơn về không gian làm việc trong Bài 8, “Tùy biến luồng công việc”, tuy nhiên có một vài điều cần lưu ý ngay lúc này.

Có thể khi đã quen với Flash, bạn sẽ muốn điều khiển và tùy biến không gian làm việc theo cách của riêng bạn, tuy nhiên, thời điểm này, thay đổi không gian làm việc có thể gây rắc rối. Nếu vô tình kéo thả và làm biến mất các bảng, bạn luôn có thể thiết lập lại các bảng về vị trí mặc định của chúng bằng cách chọn Window > Workspace > Essentials. Nếu đã từng sử dụng các phiên bản Flash trước Flash CS4, có thể bạn sẽ quan tâm tới tùy chọn Classic trong menu này. Để đảm bảo tính thống nhất, trong cuốn sách này sử dụng không gian làm việc CS4 mặc định.

Chọn Window > Workspace > Essentials để thiết lập không gian làm việc về Flash CS4 mặc định.


2Một điều nữa cũng rất quan trọng cần chú ý đó là mỗi bảng đều có một menu tương ứng chứa các tùy chọn có hoặc không xuất hiện trong bảng, có thể truy cập tới bằng cách nhấn vào button ở góc trên cùng bên phải của bảng. Menu của bảng có thể có hoặc không có tác dụng, tùy vào từng trường hợp cụ thể nhưng luôn ghi nhớ sự tồn tại của menu này vì đây là nơi đầu tiên bạn nghĩ đến khi một tùy chọn nào đó không có mặt trong bảng.

Các menu của bảng có thể được truy cập tới bằng cách sử dụng button ở góc trên cùng bên phải của bảng.

Timeline

Timeline trong Flash được coi là “trái tim” của mọi tác vụ; đây là nơi bạn tạo hoạt hình, chuỗi các hình vẽ cùng với âm thanh, video và các lệnh điều khiển. Timeline chứa các khung hình, mỗi khung hình biểu diễn cho một thời điểm xác định hay một mốc thời gian. Các hình vẽ và hoạt hình được đặt tại các thời điểm xác định trong Timeline, được gọi là keyframe, tạo ra các chuỗi hình liên tiếp, trình chiếu ảnh hoặc đoạn phim. Bạn có thể thêm các mã ActionScript cho mỗi keyframe, để điều khiển việc phát hình và thêm các tương tác hoặc đặt âm thanh dọc theo Timeline để tạo hiệu ứng âm thanh và đối thoại.

A. Nhấn và kéo chuột để mở khóa cho Timeline từ cửa sổ thiết kế. B. Các khung hình. C. Các tùy chọn xem khung hình/Layer. D. Chèn Layer.E. Chèn thư mục Layer. F. Xóa Layer. G. Keyframe.


A B C

D E F G



Timeline cũng bao gồm các layer. Layer hoạt động giống như phần trong suốt của cuộn phim phủ lên trên một cuộn phim khác. Mỗi hoạt hình và các phần của artwork (sản phẩm thiết kế - hình vẽ hoặc hình vector có khả năng co kéo mà không bị vỡ hình, một artwork có thể bao gồm nhiều hình vẽ) có thể được đặt trên các layer riêng biệt, điều này giúp tổ chức và quản lý công việc dễ dàng hơn. Nếu đã từng làm việc với các ứng dụng Adobe CS4 khác như Illustrator, Photoshop hoặc InDesign, bạn có thể đã quen với layer, đây thực sự là một tính năng rất mạnh mẽ và linh hoạt. Giống như các bảng khác, Timeline cũng có menu riêng. Hầu hết các tùy chọn trong menu của bảng Timeline đều liên quan tới việc tùy biến hiển thị của bảng. Đây là nơi bạn có thể điều chỉnh kích thước của các layer, khung hình và bật chế độ Preview để hiển thị các đối tượng trên layer dưới dạng hình ảnh thu nhỏ trong Timeline.

Thay đổi các thiết lập của Timeline theo ý thích của bạn.


2Trong bài tập này, bạn sẽ tìm hiểu một Timeline chứa nhiều keyframe, hoạt hình và layer để hiểu rõ thế nào là một file Flash chuẩn.

1 Chọn Chọn File > Open và chọn file fl0203.fla trong thư mục fl02lessons. Nhấn Open để mở file đó.

2 Quan sát bảng Timeline ở phía dưới Stage. Bạn sẽ thấy rằng bảng Timeline chứa một layer kèm theo một thư mục layer ở bên trên. Thư mục layer có thể chứa các layer và được sử dụng để tổ chức Timeline khi thêm layer. Nhấn vào mũi tên bên trái của thư mục Gears để mở rộng và hiển thị nội dung của thư mục đó. Có ba layer hình răng cưa nằm trong thư mục Gears.

Nhấn mũi tên bên trái để mở rộng thư mục Gears.

3 Mỗi layer chứa một hoạt hình riêng biệt, được đánh dấu tại vị trí bắt đầu và kết thúc của một keyframe. Keyframe là khung hình đặc biệt được tạo ra dọc theo Timeline, trong keyframe bạn có thể tạo hoặc xóa bỏ một hình vẽ, bắt đầu hoặc kết thúc một hoạt hình hoặc kích hoạt thực hiện một tương tác với ActionScript. Nền màu xanh của khung hình biểu thị cho một hoạt hình motion tween. Nhấn Enter (Windows) hoặc Return (Mac OS) để chạy Timeline.

4 Nhìn vào Layer 4 trong Timeline, layer này chứa một số keyframe liên tiếp. Nhấn một lần vào từng keyframe để chuyển tới khung hình đó và quan sát những nội dung được hiển thị tại thời điểm tương ứng.

5 Để trượt trên Timeline, hãy bắt lấy playhead phía trên Timeline (playhead được biểu thị bằng dấu mốc màu đỏ), sau đó kéo sang cả hai phía.

Trong Timeline, kéo playhead để trượt về phía trước và phía sau.




6 Chọn File > Close để đóng file hiện tại. Nếu được nhắc có muốn lưu các thay đổi hay không, chọn Don’t Save.

1Web-safe: Là những màu có thể hiển thị được trên tất cả các hệ máy, kể cả các máy tính cấu hình thấp chỉ hỗ trợ 8 bít màu.

Chuyển đổi làm việc giữa các file

Khi có nhiều file được mở cùng một lúc, mỗi file sẽ được hiển thị bằng tab tương ứng ở phía trên cùng của cửa sổ thiết kế. Nhấn vào tab để chọn file đó và hiển thị file này ra phía trước màn hình để có thể chỉnh sửa. Để đóng file đang hoạt động, bạn có thể chọn File > Close hoặc sử dụng hộp dấu x xuất hiện ở đầu tab của file. Để đóng tất cả các file cùng lúc, chọn File > Close All.

Chuyển đổi qua lại dễ dàng giữa nhiều file cùng lúc.

Bảng Swatches

Bạn sẽ bắt gặp biểu tượng ô chọn màu ( ) rất nhiều lần trong Flash. Biểu tượng này sẽ mở bảng Swatches được sử dụng để thiết lập màu nền, màu tô (màu đổ) màu cho stroke và cho chữ. Có 256 màu web-safe1 và 7 hiệu ứng chuyển màu được thiết lập sẵn để chọn lựa, ngoài ra bạn cũng có thể tự xác định màu. Bạn sẽ tìm hiểu cách thêm các màu tùy chỉnh và hiệu ứng chuyển màu vào bảng Swatches trong Bài 3, “Làm quen với các công cụ vẽ”.

Sáu mã ký tự ở phía trên bảng Swatches biểu diễn cho mã thập lục phân, đây là hệ mã chuẩn các màu sử dụng cho web. Khi chọn các màu từ bảng Swatches, mã thập lục phân tương ứng với màu được chọn sẽ hiển thị ở phía trên. Bảng Color Picker trong các ứng dụng Adobe CS4 như Illustrator hay Photoshop cũng chứa các giá trị mã thập lục phân cho màu được chọn, vì thế bạn có thể lấy tương ứng màu sắc giữa các ứng dụng với nhau bằng cách sao chép và dán các mã thập lục phân.

Bảng Swatches trong Flash CS4.


2 Thực hành với các công cụ Flash

Thực hành với các công cụ FlashBạn đã được giới thiệu về các công cụ và không gian làm việc của Flash, giờ chính là lúc thực hành những gì đã học. Trong các bài tập sau, bạn sẽ hoàn thiện một hình vẽ giống như hình trong file fl0202_fish.fla để hiểu sâu hơn về các công cụ chọn, công cụ vẽ và công cụ biến hình của Flash. Bạn cũng sẽ sử dụng tweening trong Flash để tạo ra hoạt hình đầu tiên.

Thực hành với công cụ vẽ và công cụ chọn

Đầu tiên, bạn sẽ tạo và chỉnh sửa các hình vẽ sử dụng công cụ vẽ, sau đó thực hiện tinh chỉnh với công cụ chọn. Công cụ chọn thường được sử dụng kết hợp với công cụ vẽ để xác định vị trí và chỉnh sửa hình vẽ, ảnh và chữ.

1 Hãy mở file fl0202.fla đặt trong thư mục fl02lessons, nếu file này chưa được mở sẵn.

2 Chọn File > Save As; hộp thoại Save As xuất hiện. Trong trường văn bản Name, nhập fl0202_work.fla, sau đó di chuyển tới thư mục fl02lessons và nhấn Save.

3 Chọn công cụ Selection ( ) trong bảng Tools. Công cụ Selection là công cụ chọn đa năng, có thể sử dụng để chọn, di chuyển và biến đổi các đối tượng trực tiếp trên Stage.

4 Trên Stage, nhấn một lần vào chiếc vây phía trên phần thân chú cá. Nhấn vào kéo chiếc vây đó xuống dưới cho tới khi nối liền với phần thân. Thả chuột ra.

Sử dụng công cụ Selection để chọn và di chuyển đối tượng trên Stage.


2Thực hành với các công cụ Flash

5 Bạn cần một bản sao của chiếc vây để làm thành chiếc vây bên dưới. Cách đơn giản nhất là nhân bản hoặc kéo để tạo ra một bản sao từ chiếc vây ban đầu. Để thực hiện điều này, nhấn một lần vào chiếc vây bên trên, sau đó giữ phím Alt (Windows) hoặc Option (Mac OS) đồng thời nhấn và kéo bản sao của chiếc vây ra xa chiếc vây ban đầu.

Giữ phím Alt (Windows) hoặc Option (Mac OS) và kéo để nhân bản đối tượng.

6 Bởi vì chiếc vây mới được sao chép ngược chiều với phần thân chú cá, cho nên cần phải lật ngược chiếc vây đó lại cho đúng chiều. Nhấn một lần để chọn chiếc vây mới được sao chép, sau đó chọn Modify > Transform > Flip Vertical. Lệnh menu Transform này lật ngược chiếc vây theo chiều mong muốn.

Menu Transform chứa các lệnh cho phép lật ngược, xén và xoay đối tượng.


27 Tiếp tục sử dụng công cụ Selection, nhấn và kéo chiếc vây mới xuống phía dưới

phần thân chú cá.

8 Chiếc vây mới này có vẻ hơi to. Trong Flash có nhiều cách để thay đổi kích thước của một đối tượng, trong đó có bảng Transform; chọn Window > Transform để mở bảng Transform.

9 Với chiếc vây mới đã được chọn, nhập 60 vào các trường Horizontal Scale và Vertical Scale ở phía trên cùng bảng Transform, sau đó nhấn Enter hoặc Return để cập nhật các thay đổi. Bây giờ kích thước của chiếc vây có tỷ lệ 60% so với ban đầu.

Bảng Transform thay đổi kích thước chính xác của đối tượng theo các giá trị tỷ lệ phần trăm.

Hãy để ý button Constrain ( ) (Windows) hoặc checkbox Constrain (Mac OS) nằm cạnh trường văn bản Width scale và Height scale trong bảng Transform. Khi checkbox này được đánh dấu, bạn chỉ cần nhập giá trị vào một trường Width hoặc Height, Flash sẽ tự động thay đổi kích thước của đối tượng theo tỷ lệ tương ứng.

10 Để thêm mắt cho chú cá, chọn công cụ Oval ( ) trong bảng Tools. Bạn cần nhấn và giữ chuột lên công cụ Rectangle ( ) để có thể truy cập tới công cụ Oval. Ở phía dưới bảng Tools, nhấn vào ô chọn màu Fill color và chọn màu đổ là màu đen.

11 Công cụ Oval cho phép chỉnh sửa các hình; Ở đây, bạn sẽ thêm một đường tròn nằm bên trong hình oval. Trong bảng Property Inspector, nhập giá trị 50 vào trường văn bản Inner radius, sau đó nhấn Enter hoặc Return.

Thực hành với các công cụ Flash


2

Để tạo ra hình tròn, hãy giữ phím Shift trong khi vẽ hình oval.


12 Chọn Layer 1 trong Timeline bằng cách nhấn vào tên của layer đó, sau đó nhấn và kéo chuột lên vùng bên trái chú cá để vẽ một hình oval nhỏ chính là mắt của chú cá. Đảm bảo rằng hình oval được đặt vào trước khi bị bỏ chọn để tránh loại bỏ màu của chú cá.

Sử dụng công cụ Oval Premitive với tùy chọn inner radius để tạo mắt cho chú cá.

Tô màu cho chú cá bằng cách sử dụng màu gradient trong bảng Swatches.

Xin chúc mừng! Tuy chú cá trông còn khá đơn giản nhưng bạn đã thiết kế xong đối tượng đồ họa đầu tiên trong Flash.

Sử dụng các công cụ màu và gradient

Bây giờ bạn sẽ thêm màu sắc sinh động hơn cho chú cá bằng cách sử dụng màu gradient (màu biến đổi dần) và các kiểu stroke (đường viền) nghệ thuật.

1 Chọn công cụ Selection ( ) từ bảng Tools, sau đó nhấn một lần vào bên trong phần thân chú cá; một pattern kiểu dấu chấm biểu thị vùng đổ màu đang được chọn.

2 Để thay đổi màu cho phần thân chú cá, nhấn vào ô chọn màu Fill color ở dưới bảng Tools. Trong bảng Swatches xuất hiện, chọn màu gradient cam/vàng ở phía dưới cùng của bảng để áp dụng hiệu ứng này cho vùng được chọn. Bỏ chọn chú cá bằng cách chọn Edit > Deselect All hoặc nhấn chuột vào vùng làm việc màu xám.


23 Công cụ Eyedropper ( ) cho phép lấy mẫu màu của một đối tượng và áp dụng màu đó

cho một đối tượng khác. Bạn sẽ sử dụng công cụ này để lấy mẫu màu từ phần thân chú cá rồi áp dụng màu đó cho hai chiếc vây. Sử dụng công cụ Selection ( ), giữ phím Shift và nhấn vào từng chiếc vây để chọn đồng thời cả hai. Chọn công cụ Eyedropper trong bảng Tools. Nhấn một lần lên thân chú cá để lấy mẫu màu và áp dụng cho hai chiếc vây vừa chọn.

4 Chọn Edit > Deselect All để bỏ chọn các phần tử trên Stage. Trong bảng Tools, nhấn và giữ chuột lên công cụ Paint Bucket ( ), chọn công cụ Ink Bottle ( ) từ menu xuất hiện. Công cụ Ink Bottle cho phép thay đổi màu sắc stroke của một đối tượng. Bạn sẽ sử dụng bảng Property Inspector để thiết lập màu và kiểu stroke (trong Flash phân biệt 2 công cụ (1) đổ màu nền là Paint Bucket (2) đổ màu stroke là Ink Bottle).

4 Trong bảng Property Inspector, nhấn vào ô chọn màu Stroke color (mẫu màu đường viền) và nhập giá trị #FF6600 (màu cam) vào trường hexadecimal ở góc trên cùng bên trái của bảng Swatches. Nhấn Enter hoặc Return để thiết lập màu vừa chọn.

6 Nhấn vào menu Style ở bên dưới các mẫu màu. Chọn kiểu ragged từ menu xổ xuống.

Chọn màu và kiểu cho stroke, rồi áp dụng nét vẽ ragged (kiểu nét vẽ tay đứt đoạn) đó bằng cách sử dụng công cụ Ink Bottle.

7 Nhấn vào cạnh rìa của phần thân chú cá để áp dụng màu và kiểu stroke mới. Nhấn vào rìa của hai chiếc vây và phần mang của chú cá để áp dụng tương tự màu và kiểu stroke. Chọn Edit > Deselect All để bỏ chọn các đối tượng trên Stage.



28 Chọn công cụ Selection trong bảng Tools. Di chuyển con trỏ sang phải chiếc mang

một chút nhưng không được chạm vào chiếc mang đó, một đường cong nhỏ xuất hiện bên dưới con trỏ. Nhấn và kéo chuột nhẹ sang bên phải để uốn cong chiếc mang cá.

Công cụ Selection có thể sử dụng để uốn cong các đường thẳng hoặc làm méo các hình.

9 Nhấn và giữ chuột lên công cụ Rectangle ( ) trong bảng Tools và chọn công cụ Oval ( ). Nhấn vào ô chọn màu Fill color ở phía dưới cùng của bảng Tools, sau đó chọn một màu xanh nước biển nhạt. Nhấn vào ô Stroke color và thiết lập màu stroke bằng No color ( ).

10 Giữ phím Shift, đồng thời vẽ một số hình oval lên phía trước chú cá để tạo ra các hình bong bóng.

11 Chọn File > Save để lưu file.

Sử dụng công cụ Oval Primitive để vẽ các bong bóng phía trước chú cá.

12 Chọn File > Open, chọn file fl0202_done.fla trong thư mục fl02lessons, nhấn Open để mở file đó. Thử so sánh sản phẩm của bạn với hình vẽ trong file fl0202_done.fla. Chọn File > Close All để đóng tất cả các file đang mở.

Bây giờ bạn đã thực hành xong với các công cụ vẽ. Bạn sẽ tìm hiểu chi tiết về những công cụ này trong Bài 3, “Làm quen với các công cụ vẽ”.



2Thực hành với hoạt hình

Flash là phần mềm rất mạnh và dễ sử dụng để tạo hoạt hình, bạn có thể tạo hoạt hình trực tiếp từ Timeline. Timeline hiển thị nội dung trong từng khoảng thời gian hay còn được gọi là khung hình. Mỗi khung hình có thể được thiết lập thành một keyframe chứa các phần tử và là nơi bắt đầu hoặc kết thúc hoạt hình.

Flash có thể tạo ra hoạt hình dựa trên các điểm bắt đầu và kết thúc; phương pháp này được gọi là tweening (biến đổi hoạt hình). Bạn chỉ cần xác định vị trí bắt đầu và kết thúc hoạt hình của một đối tượng, Flash sẽ tự động tính toán các khung hình xen giữa. Để áp dụng cùng một kiểu chuyển động cho nhiều đối tượng trên Stage, bạn sẽ sử dụng tính năng Copy Motion and Paste Motion, đây là những tính năng mới trong Flash CS4.

1 Chọn File > Open và chọn file fl0201.fla trong thư mục fl02lessons khi hộp thoại Open xuất hiện. Nhấn Open. Hình vẽ hai chú rùa xuất hiện trên Stage. Trong các bước tiếp theo, bạn sẽ tạo hoạt hình chuyển động băng qua stage của chú rùa lớn.

2 Sử dụng công cụ Selection ( ), nhấn vào chú rùa lớn. Để ý thấy rằng layer Big Turtle trong Timeline được highlight bằng màu xanh và layer này chứa 60 khung hình. Nhấn chuột phải (Windows) hoặc Ctrl+nhấn chuột (Mac OS) vào chú rùa lớn và chọn Create Motion Tween từ menu ngữ cảnh.

Nhấn chuột phải/giữ Ctrl và nhấn chuột vào chú rùa lớn và chọn Create Motion Tween từ menu ngữ cảnh.

Motion tween cho phép bạn dễ dàng tạo ra hoạt hình bằng cách điều chỉnh các thuộc tính của đối tượng tại những thời điểm khác nhau trên Timeline. Flash sẽ thực hiện các công việc cần thiết khác.

3 Nhấn và kéo playhead tới khung hình 60.

Kéo playhead tới khung hình 60.



24 Nhấn và kéo để di chuyển vị trí của chú rùa lớn sang bên trái stage (chú ý không

kéo vượt quá cạnh của stage). Khi thả chuột ra, bạn sẽ thấy một đường đứt nét màu xanh xuất hiện nối từ vị trí cũ tới vị trí mới của chú rùa.

Thay đổi vị trí của chú rùa lớn.

5 Nhấn Enter hoặc Return để xem thử hoạt hình mà bạn vừa tạo ra. Trông rất ổn, đúng không?

Trợ giúpTrong trường hợp bạn không tìm thấy một lệnh hoặc muốn biết cách hoạt động, sử dụng một công cụ hoặc cách thực hiện một tác vụ nào đó, bạn có thể tham khảo menu help > Flash Help. Menu help > Flash Help sẽ mở bảng Help (đây là bảng tổng hợp, vừa là bảng thuật ngữ, tài liệu hướng dẫn khắc phục lỗi vừa là tài liệu hướng dẫn sử dụng); menu này còn cung cấp liên kết tới các diễn đàn Adobe và trung tâm hỗ trợ trực tuyến.

Bảng Help là nguồn tham khảo rất hữu dụng, giúp giải đáp nhanh chóng các vướng mắc của bạn.

1 Chọn Help > Flash Help.

2 Trong bảng Help, bạn có thể sử dụng danh sách phân loại phía bên trái hoặc nhập từ khóa để tìm kiếm trợ giúp về chủ đề bạn muốn.

Trợ giúp


2Các diễn đàn trợ giúp

Các diễn đàn trợ giúp về Flash của Adobe là nguồn tham khảo rất phong phú bao gồm các câu trả lời, ý tưởng sáng tạo, thủ thuật của các chuyên gia và cộng đồng người sử dụng Flash. Bạn có thể tìm thấy hầu hết câu trả lời cho những câu hỏi thông thường hoặc có thể đăng những chủ đề và câu hỏi của bạn lên diễn đàn.

2 Chọn Help > Flash Developer Center. Việc này sẽ mở diễn đàn trợ giúp (Support forum) trong trình duyệt mặc định của hệ thống.

2 Trong trường tìm kiếm ở góc trên cùng bên phải của trang diễn đàn, hãy nhập từ khóa mà bạn muốn tìm hiểu, sau đó nhấn vào button Search.

3 Để đăng tải một chủ đề, câu hỏi hoặc trả lời các câu hỏi trong diễn đàn, hãy nhấn vào liên kết. Your Account ở phía trên cùng của trang diễn đàn để đăng nhập với tài khoản Adobe của bạn.

Bạn cần phải đăng ký tài khoản để có thể đăng tải hoặc trả lời các câu hỏi trên các trang diễn đàn Flash của Adobe.

Tiếp theoTrong chương sau, bạn sẽ đặt bút (sử dụng chuột trên Stage) để thể hiện các sáng tạo với các công cụ vẽ của Flash. Bây giờ, có lẽ bạn đã quen với không gian làm việc Flash, mọi thứ có vẻ khá đơn giản nhưng đừng ngại ôn tập lại chương này thêm một lần nữa để củng cố thêm trí nhớ của bạn.

Tự họcTạo và lưu một file mới trong thư mục fl02lessons. Sử dụng bảng Property Inspector để thiết lập các kích thước, màu nền và tỷ lệ khung hình/giây. Thực hành với các công cụ vẽ mà bạn đã được học từ trước tới giờ để tạo ra hình vẽ trên Stage, sử dụng công cụ Selection để di chuyển và chỉnh sửa hình vẽ, nếu cần.

Bạn có thể thiết lập vị trí và tùy biến các bảng trong không gian làm việc theo ý thích. Menu Workspace (Window > Workspace) cung cấp một số thiết lập có sẵn cho bạn biết cách tối ưu hóa không gian trong vùng làm việc.

Hãy thử tạo hoạt hình cho chú rùa nhỏ trong file fl0201.fla. Thực hành tạo hoạt hình với các thuộc tính khác của đối tượng bằng cách sử dụng bảng Property Inspector.

Tiếp theo


2Ôn tập

Câu hỏi

1 Bạn có thể mở một file đã làm việc từ trước ở đâu?

2 Bảng nào cho phép xem thông tin của một đối tượng được chọn hoặc xem các tùy chọn của một công cụ đang hoạt động?

3 Flash sử dụng phương phức nào để tự động tạo hoạt hình từ điểm bắt đầu và điểm kết thúc?

Đáp án

1 Từ menu File > Open Recent hoặc từ cột Open a Recent Item trong màn hình Welcome Screen.

2 Bảng Property Inspector.

3 Phương thức tweening (biến đổi hoạt hình).

Ôn tập

Documents

Tính năng mới trong Adobe Flash CS4 - poly.edu.vnpoly.edu.vn/book/Trichdan_flash.pdfdiện thiết kế và xuất bản thành các file đồ họa đa phương tiện, ngoài