Flash Catalyst CS5 Foundations
Description
Flash Catalyst CS5 Foundations is an introductory course for designers and developers who want to create rich application interfaces and interactive content without authoring a single line of code. Examples include interactive ads, product guides, design portfolios, microsites, datacentric rich Internet applications (RIAs), and more.
Audience
This course is intended for any designer who produces interactive content for the web or desktop. You will have more success with Flash Catalyst if you are already familiar with Adobe Illustrator, Adobe Photoshop, or Adobe Fireworks, and have a basic understanding of structuring artwork using layers and groups.
Course Length
3 Days
Course Objectives:
By the time students are finished with this course, they will be able to:
- Create a Flash Catalyst document and set up a Flash Catalyst document
- Import graphics from Photoshop, Illustrator and Fireworks
- Import Sound and Video
- Convert artwork and other assets into interactive components, such as navigation buttons and scroll bars
- Define the different states, or views, of your application
- Add interactions used to transition from one page or component state to another, link to a website, or control animation, video, and sound effects
- Add smooth transitions, 3D animation, and other special effects
- Publish your project to the web or as an Adobe AIR desktop application
Course Outline
- GETTING STARTED
Prerequisites
Installing Flash Catalyst
Optimizing performance
Checking for updates
Flash Player version
Additional resources
Adobe certification - GETTING TO KNOW ADOBE FLASH CATALYST CS5
Lesson Overview
About Flash Catalyst
Is Flash Catalyst the right tool for you?
Key features
Additional benefits for designers
Flash Catalyst design workflow
Opening a new Flash Catalyst project
Finding your way around
Design workspace
Code workspace
Opening an existing Flash Catalyst project
Exploring the Design workspace
Moving around the workspace
Adjusting panels
Zooming the artboard
Panning the artboard
Previewing a project in a browser
Getting Flash Catalyst Help - PREPARING, IMPORTING, AND PLACING ARTWORK
Lesson Overview
Preparing a design document
Choose your design application
Plan the structure of your application
Group complex objects
Flatten artwork with filters and effects
Name everything
Embed images in the design document
Manage fonts when sharing files
Identify duplicate component assets
Set component properties in Flash Catalyst
Create sample artwork for a list of images or text
Hide, show, and lock layers
Exporting an FXG file from Adobe Fireworks
Importing artwork
Import a design document
Import additional images
Position images in the artboard
Optimizing artwork
Optimize artwork - MANAGING THE LIBRARY
Lesson Overview
Viewing the Library panel
How do assets get into the Library panel?
Add assets to the Library panel
Preview files in the Library panel
Deleting assets from the project
Compressing images in the Library panel
Renaming project assets
Using assets in the Library panel
Sharing project libraries
Export a library package
Import a library package - MANAGING LAYERS
Lesson Overview
Exploring the Layers panel
Expand and collapse layers
Show and hide layers
Lock and unlock layers
Grouping objects
Renaming objects in the Layers panel
Optimizing complex groups
Adding and deleting layers
Stacking artwork using layers - WORKING WITH PAGES AND STATES
Lesson Overview
Page and component states
Duplicating and modifying page states
Save time by duplicating page states
Give page states descriptive names
Show and hide artwork in each page state
Adding and deleting states
Add a blank page state
Add objects to blank page states
Delete objects from specific states
Delete page states - CREATING INTERACTIVE COMPONENTS
Lesson Overview
The building blocks of RIAs
Components
Interactions
Using wireframe components
Add and modify wireframe buttons
Add wireframe text input fields
Add wireframe radio buttons
Add a wireframe check box
Add wireframe scroll bars
Converting artwork to built-in components
Convert artwork to buttons
Create a reusable navigation button
Enable and disable buttons
Create next and previous buttons
Create a custom toggle button
Convert artwork to scroll bars
Work with text
Create a scroll panel from artwork
Creating custom components
Adding interactivity
Add page navigation
Create conditional interactions
Link to external content - CREATING TRANSITIONS AND ACTION SEQUENCES
Lesson Overview
Transitions and action sequences
Inspecting default transition effects
Adding smooth transitions
Fine-tuning transitions
Adjust transition duration
Change transition timing
Ease transitions
Adding and changing effects
Swap one effect for another
Add multiple effects to the same object
Adding action sequences
Add an action sequence interaction
Edit an action sequence in the Timeline
Flash Catalyst helper effects - ADDING AND CONTROLLING VIDEO AND SOUND
Lesson Overview
Preparing video for the web
What is encoding?
What is a video codec?
How do I encode my video?
Importing and previewing video and sound
Import video and sound
Preview video and sound
Adding video to an application
Add video to the artboard
Set video player properties
Controlling video playback
Attach controls to the video
Add interactions to control video playback
Reset the video after playing
Adding sound effects - INTEGRATING SWF CONTENT FROM OTHER CREATIVE SUITE TOOLS
Lesson Overview
SWF files
Creating SWF files for Flash Catalyst
Using SWF files in Flash Catalyst
Adding SWF files to Flash Catalyst
Import a SWF file to the artboard
Preview a SWF animation
Controlling the playback of SWF files
Play or stop a SWF file
Play the SWF movie from a specific frame
Adding a SWF file to a component
Position a SWF file
Add effects to play the animation - DESIGNING WITH DATA
Lesson Overview
Flash Catalyst data lists
A list is not always a list
What is design-time data?
Preview a data list
Creating a Data List component
Design a sample record
Convert the sample record into a Data List component
Define the repeated item
Setting data list properties
Size and position the bounding box
Edit the repeated item layout
Edit the repeated item states
Using design-time data
Replace design-time images
Edit design-time text
Add and delete design-time data
Add and remove elements in the repeated item
Using a wireframe data list - DRAWING AND EDITING ARTWORK
Lesson Overview
Flash Catalyst drawing tools
Using the rulers, guides, and grid
Show and hide rulers
Edit grid and guide settings
Set guides for precise drawing
Drawing basic shapes and lines
Preview a drawing example
Draw rectangles
Draw rounded rectangles
Draw ellipses
Draw basic lines
Changing stroke and fill
Change the fill color
Change stroke color and weight
Add and modify gradient fills
Grouping and transforming
Group objects
Transform shapes
Size and position objects
Applying and removing filters
Add and modify a bevel
Add and modify a drop shadow
Round-trip editing with Adobe Illustrator and Adobe Photoshop
Launch and edit in Adobe Illustrator
Download and install the Adobe FXG extensions for Photoshop
Launch and edit in Adobe Photoshop - PUBLISHING A PROJECT
Lesson Overview
Delivery options
Publishing your application
Accessibility
Embedding fonts
Before you publish
Publish to SWF
Viewing the published files
Publishing to the web with Adobe Dreamweaver CS5
Create a local root folder and site structure
Connect to a remote site
Upload files - EXTENDING YOUR PROJECT USING ADOBE FLASH BUILDER
Lesson Overview
Adobe Flash Builder
Extending the application
Bind components to a data source
Create, Read, Update, and Delete (CRUD)
Provide a keyword search
Collect user input
Use sliders to set values
Create printer controls
Exploring designer-developer workflows
Linear workflow
Iterative workflow
Preparing files for a developer
Meet with your development team early
Use data lists and design-time data
Name everything
Delete unused assets
Opening a Flash Catalyst project in Flash Builder
Review the final Flash Catalyst project file (FXP)
Import the FXP into Flash Builder
Import an edited FXP file into Flash Builder
Compare and integrate code between projects
Importing a Flash Catalyst library file (FXPL)
Import the FXPL
Associate the FXPL with your application