Adobe Flash Catalyst CS5: Learn by Video

Design and Create Interactive Applications

This complete training program published in partnership with Peachpit Press combines over 6 hours of video instruction with a 120-page full-color guide to teach you the fundamentals of Adobe Flash Catalyst CS5, as well as the basic principles of creating rich internet applications. You’ll master the program’s interface and learn about the latest features in CS5, as well as how to add advanced interactive elements, fine-tune application code, work with Adobe Flash Builder, and more! Interactive quizzes throughout the course reinforce what you’ve learned.

Trainer: Rufus Deuchler, Kevin Ruse

ISBN Code: ISBN: 978-0-321-73485-3

Publication date: Nov 10, 2010

$59.99

Duration: 6 hrs

HTML5 Player-Ready

Powerful, Feature-Rich Interface

HD Video

Add to Cart Downloads

Add to favorites list Tell-a-Friend Submit feedback

Similar Courses

Welcome: Adobe Flash Catalyst CS5: Learn by Video

Welcome to Adobe Flash Catalyst, a new component of Adobe Creative Suite that lets you create interactive content without writing a single line of code. This chapter is your introduction to the features and interface of Adobe Flash Catalyst.

Introduction to Adobe Flash Catalyst CS5
- What exactly is Flash Catalyst, what does it do, and who is it for? You'll find out in this video.
  
  What Is Flash Catalyst?
  
  01:10
- Designers can use Flash Catalyst to create self contained interactive SWF and AIR applications without writing a single line of code.
  
  The Designer Workflow
  
  03:46
- Designers can build interactive documents, and then hand them over to Flex developers to add database and back-end connectivity.
  
  The Designer to Developer Workflow
  
  05:08
- Whether you are working in a Designer Workflow or Designer to Developer Workflow, there are some things that are the same. Mainly the importance of planning ahead.
  
  General Workflow Considerations
  
  04:14
- This video is a brief overview of the Flash Catalyst Interface. You'll get acquainted with the Artboard, the many panels, and the HUD.
  
  The Flash Catalyst Design Workspace
  
  15:55
- The Properties Panel shows you the attributes of any selected object on your artboard. It offers a very convenient way to rapidly apply various properties to your graphics.
  
  The Properties Panel in Detail
  
  09:44
- In for something scary? Watch this. Fortunately, you as a designer, will not have to see this often.
  
  The Flash Catalyst Code Workspace
  
  01:25
- In this chapter you'll get a sneak peek into what what you will learn in this video course on Adobe Flash Catalyst, and how your static Photoshop or Illustrator artwork can be turned into full-fledged interactive documents.
  
  Adobe Flash Catalyst Jumpstart
  - Flash Catalyst is an application that lets you turn static Photoshop or Illustrator art into fully fledged interactive SWF documents. This video provides a quick overview of what can be done in Flash Catalyst.
    
    Application Overview
    
    05:46
  - One of the great benefits of Flash catalyst is that you can leverage your knowledge of Photoshop and Illustrator to create compelling interactive experiences. This video shows you how to turn your static artwork into something more.
    
    Transforming Static Illustrator Artwork into an Interactive Experience
    
    07:54
  - In this video you'll see what you can accomplish by combining Adobe Catalyst with Adobe Flash Builder 4, and how you can show real-time data in your Catalyst project.
    
    Jumpstart to Flash Builder
    
    03:13
Get started with your first Flash Catalyst project.

Creating a Flash Catalyst Project
- In this lesson we'll begin by creating a new, fresh, blank Catalyst project.
  
  Starting a Blank Catalyst Project
  
  05:16
- Learn how to leverage the many available wireframe components to get started on your project.
  
  Using the Wireframe Components
  
  11:11
- The Layers panel allows for good document hygiene, and state-of-the-art organization of your project. In this lesson you'll learn to use the Layers panel to define the stacking order of your graphics or simply select objects on the artboard.
  
  Organizing Your Project in Layers
  
  04:37
- A vector drawing application such as Adobe Illustrator is the best way to start designing an interactive application for Catalyst. In this video you'll see how to import your vector artwork from Illustrator.
  
  Importing Your Design from Adobe Illustrator
  
  08:33
- Catalyst can very easily import Photoshop files and leverage layers and layer compositions. This tutorial looks at importing from Photoshop.
  
  Importing Your Design from Adobe Photoshop
  
  06:58
- Other than Illustrator and Photoshop files, Catalyst can easily understand, FXG, bitmap images, SWF files. Furthermore, Catalyst can import Fireworks data, as you'll see in this video.
  
  Other File Formats That Can Be Imported into Catalyst
  
  01:24
- In this lesson you'll learn how to manage and place artwork from the Library panel and share entire libraries with others.
  
  Organizing Your Assets in the Library
  
  02:59
This chapter looks at pages and states. Pages and states are core concepts to master when building a Flash Catalyst project, and it is important to understand the differences between the two.

Pages and States
- In this video you'll learn about the difference between pages and states and about how you can create various views within your project.
  
  What Are Pages and States?
  
  02:27
- In this tutorial we'll create and duplicate pages in a blank Flash Catalyst project.
  
  Creating a Simple Set of Pages
  
  02:21
- In this lesson you'll learn how to create very simple page to page navigation using the wireframe button component.
  
  Create Your First Set of Buttons
  
  04:07
- You can use elements that were designed in Adobe Illustrator to change the appearance of pages in a more complex Flash catalyst Project. You'll see how in this video.
  
  Working with More Complex Pages
  
  05:42
- Now that the different pages have been defined, time has come to add button navigation to view them one after the other.
  
  Adding Simple Left-to-Right Navigation
  
  07:15
- In this lesson you'll learn how to create a nonlinear navigation system in your Flash Catalyst Project.
  
  Creating a Reusable Set of Buttons
  
  09:10
- An important feature of Flash Catalyst is that you can create smooth transition between one Page to another. In this tutorial we'll begin with a simple set of transitions.
  
  Creating Smooth Transitions Between Pages
  
  06:39
- In this lesson you'll apply your understanding of transitions to create smooth navigation for a more complex Catalyst project.
  
  Transitions Applied to a More Complex Project
  
  11:36
- In this tutorial we'll create an interesting button using transitions between button states.
  
  Special Effects with Transitions
  
  08:44
This chapter's videos deal with components. Components in Flash Catalyst are the building blocks to both create interactive experiences and prepare your work for the Designer-to-Developer workflow.

Components: The Building Blocks of Catalyst
- This video is an introduction to components, which are the building blocks of your Catalyst project and allow you to organize your work efficiently.
  
  What Are Components?
  
  05:07
- Too much text to fit in your design? Why not create a scroll panel to accomodate it all?
  
  Scroll Panels
  
  04:34
- Based on how the wireframe components of Flash Catalyst work, you can very easily create your own interactive components with your own designs. This tutorial shows you how.
  
  Creating Your Own Scrollbar in Catalyst
  
  03:52
- In this lesson we'll continue working on the same project, transforming the text that is seen on the panels into scrolling text.
  
  Creating a Scroll Panel from Illustrator Art
  
  08:15
- Data lists can include repeated elements, which you can create to show your customers, and which your developer can very easily replace with real data by linking to it in Flash Builder. This tutorial shows you how to create your first data list.
  
  Creating Your First Data List
  
  09:26
- In this video you'll see how to add a data list to a Flash Catalyst file based on Adobe Photoshop artwork.
  
  Another Example of a Data List
  
  11:45
- Adding sound to you Catalyst Project can add a whole new layer of user experience to your application, for example adding an acoustic feedbak to a button state.
  
  Adding Sound to Your Catalyst Project
  
  08:33
- Importing video into Catalyst is as easy as importing graphics. In this lesson you'll see how to add video to your project, set player properties, and control video playback.
  
  Importing Video
  
  09:23
- This tutorial shows you how to create an action sequence to play multiple videos in a page, making it possible for you to effectively design a video player.
  
  Creating an Action Sequence to Play Video
  
  12:04
- Not only can you import sound and video files into your Catalyst project, you can also import SWF animations to make an even more engaging user experience. This video shows you how.
  
  Importing SWF Files
  
  03:24
In this chapter you'll learn to leverage your experience in Photoshop and Illustrator to create beautifully designed Flash Catalyst projects.

Integration with Illustrator and Photoshop
- Round-trip editing means that you can edit graphics imported to or created in Catalyst, in either Illustrator or Photoshop, and then return them to Catalyst. This video introduced the concepts behind round-trip editing.
  
  Round-Trip Editing
  
  01:14
- This video shows you how to edit your vector graphics directly in Illustrator.
  
  Round-Trip Editing with Illustrator
  
  06:48
- This lesson looks at editing your raster images directly in Photoshop.
  
  Round-Trip Editing with Photoshop
  
  04:30
Flash Catalyst projects can be easily published for the Web as SWF files or for the desktop as full-fledged AIR applications.

Publishing Your Catalyst Project
- This video shows you how to publish your Flash Catalyst Project to the Web as SWF for online viewing.
  
  Publishing Your Catalyst Project as a SWF File
  
  05:10
- You can also publish your Flash catalyst Project as an AIR application that will run on the desktop, even if you are not online. You'll learn how in this video.
  
  Publishing Your Catalyst Project as an AIR Application
  
  04:45
- This tutorial offers a few tips and tricks to make your exported files lighter in terms of bytes.
  
  Optimizing Your Projects for Performance
  
  04:11
- In this video we say goodbye to Catalyst – the designer's work is over. This is where a complex project will be handed over to the developer to be finished in Flash Builder.
  
  Finishing Up with Catalyst
  
  00:37
In this chapter you will be introduced to Adobe Flash Builder 4. You will also begin to understand the Designer-Developer Workflow between Adobe Flash Catalyst and Adobe Flash Builder.

Introducing Flash Builder
- This video introduces you to Adobe Flash Builder and discusses how it fits into a designer-developer workflow.
  
  Introducing Flash Builder 4
  
  00:41
- Introducing the programmers' tool: Adobe Flash Builder 4. In this video you will learn how you can use Adobe Flash Builder 4 to enhance and add functionality to your Catalyst projects and create rich internet applications (RIAs).
  
  Using Flash Builder to Create RIAs from Catalyst Projects
  
  01:28
In this sequence of videos you'll learn the steps involved in importing an Adobe Flash Catalyst file into Adobe Flash Builder.

Importing a Flash Catalyst Project into Flash Builder
- In this tutorial you'll learn how to let Designers do what they do best and developers do what they do best.
  
  The Catalyst/Flash Builder Workflow
  
  01:17
- In this video you'll learn how to turn a Flash Catalyst project into a Flash Builder project.
  
  How to Import a Flash Catalyst Project
  
  02:32
- This lesson will help you understand the file and directory structure generated by Flash Builder to create Flash Builder projects.
  
  Examining the Directory Structure
  
  04:22
In this chapter you'll learn how to navigate the Adobe Flash Builder integrated development environment, which is based on Eclipse.

The Flash Builder Integrated Development Environment
- What is Eclipse and why is it important to users of Adobe Flash Builder? You'll get a quick introduction to Eclipse in this video.
  
  What Is Eclipse?
  
  05:12
- In this lesson you'll learn the Eclipse terminology and how it differs from typical Adobe software.
  
  Getting Comfortable with Eclipse
  
  02:02
- After watching this tutorial you'll understand the Flash Integrated Development Environment so you can comfortably navigate the software.
  
  Eclipse Views, Editors, and Perspectives
  
  06:09
- Flash Builder projects can be complex so you'll need to learn how to manage your files, projects, and workspaces. All of this is covered in this lesson.
  
  Managing Files
  
  03:44
- Want to see how your finished application will look in a web browser? In this video you'll learn how to test-run your application files from Flash Builder.
  
  Running Application Files
  
  02:43
In this chapter you will learn the fundamental aspects of Flash Builder's primary languages: MXML and ActionScript. We will also explore the code generated by Adobe Flash Catalyst and the concept of namespaces.

Understanding Flash Builder's Languages
- Flash Builder integrates nicely with many languages, both client-side and server-side; however the main languages you will write are MXML and ActionScript.
  
  What Languages Does Flash Builder Write?
  
  02:43
- In this video you'll learn how and where MXML and ActionScript are written.
  
  Understanding MXML and AS
  
  07:23
- This tutorial looks at namespaces. The past and future of MXML depends on namespaces, so you should understand what they mean and how to use them.
  
  Understanding Namespaces
  
  07:53
- Catalyst generated the code, now you can see what it all means in Flash Builder.
  
  Examining Catalyst-Generated MXML
  
  06:12
While Catalyst may hide its code, Flash Builder exposes it for modification via the Code Editor. In this chapter you'll learn how to navigate code in Flash Builder and discover many of its built-in help features.

Using the Flash Builder Code Editor
- Understanding and using the Flash Builder Code Editor is a fundamental skill for developers. Get started with this lesson.
  
  Understanding Code Editing
  
  01:38
- This video shows you how to let Adobe help you write the code with its Code Assist and Code Completion features.
  
  Using Code Assist to Write MXML
  
  03:29
- In this video you'll learn how to identify, avoid, and fix the most common code errors that occur while using Flash Builder.
  
  Common Code Errors
  
  04:22
- Flash Builder 4 includes lots of instant help in the form of pop-up boxes. You'll learn how to use the pop-up help in this lesson.
  
  Getting Help
  
  04:42
- To fix code errors or simply organize your code you may want to move blocks of code to new positions in the document. This video shows you how.
  
  Moving Blocks of Code
  
  02:52
- Sometimes you want to remove code but not necessarily delete it forever. This tutorial shows you how to hide it temporarily from the code compiler.
  
  Commenting Code
  
  03:24
- Class files are the building blocks of ActionScript. Although you might not need to see these files often, it is helpful to know how to open them.
  
  Opening Class Files
  
  02:32
- MXML files can be lengthy and cumbersome to view. In this lesson you'll learn different techniques that make it easier to find the code you're looking for.
  
  Organizing Code
  
  03:43
In these videos you will be introduced the code behind view states that were generated in Flash Catalyst. You'll see the view state code and learn how changes to the view state are invoked by end-user navigation.

Using Flash Builder View States
- Unlike HTML page architecture, Flash Builder uses view states to change the view the user sees. After this lesson you'll understand where view states come from.
  
  Understanding View States
  
  01:19
- In this tutorial we'll examine the code that creates view states and learn efficient ways to look at one view state of the application at a time.
  
  Viewing View State Code
  
  06:18
- How does the end-user navigate from one view state to another? In this video we'll examine the code responsible for view state changes.
  
  Examining View State Change Code
  
  02:40
In this series of videos you'll learn to set up your development environment so that you can use the Apache application server to deploy a MySQL database. You will use Flex Builder to automate the process of obtaining database records using auto-generated PHP files.

Retrieving Data from the Server
- In this video, we'll start the process of turning that mock data from Catalyst into real-time data in Flash Builder.
  
  Why Get Data from the Server?
  
  01:34
- This tutorial shows you how to turn your computing environment into a developer machine complete with an application server for testing, a database, and a server-side programming language.
  
  Setting Up WAMP
  
  02:34
- In this lesson you'll learn where to store files that will be deployed from your development server.
  
  Testing Your WAMP/MAMP Setup
  
  01:22
- This video shows you how to use PHP to connect to a database.
  
  Creating a MySQL Database for Use with Flash Builder
  
  02:14
- In this lesson you'll learn to use Flash Builder's Data Service Wizard to create a service using PHP that will communicate with a MySQL database.
  
  Viewing the Catalyst Placeholder or Mock Data
  
  01:49
- Now that you've connected to a database, it's time to learn how to display the data by binding it to visual controls in your application.
  
  Connecting and Configuring a PHP Data Service
  
  06:47
- In this video you'll learn how to use Flash Builder's new Data Services view to automatically generate a PHP service. You will use this service to connect to a MySQL database.
  
  Adding a Service to an Application
  
  02:51
- In this video you will use the data received from the database via PHP and bind it to visual controls in your user interface, effectively displaying the records in the database.
  
  Connecting the Data to Visual Controls
  
  04:33
In this chapter you will learn the meaning of "refactoring" and the significance of refactoring Adobe Catalyst–generated code, and learn how to refactor from Adobe Flash Builder.

Refactoring Catalyst Code
- Have you ever heard programmers discussing refactoring? In this video you'll learn what refactoring is and the role it plays in Catalyst/Flash Builder projects.
  
  What Is Refactoring?
  
  00:53
- Why is it often necessary to refactor Catalyst-generated code? This tutorial explains.
  
  Why Refactor Catalyst-Generated Code?
  
  02:23
- In this lesson you'll learn how to refactor your code using Flash Builder.
  
  Refactoring Code with Flash Builder
  
  03:39

Welcome: Adobe Flash Catalyst CS5: Learn by Video

This complete training program from Adobe Press and video2brain combines over 6 hours of exceptional video training with a 120-page full-color guide to teach you the fundamentals of Adobe Flash Catalyst CS5 as well as the basic principles of creating rich internet applications. After helping you how master the program’s interface, expert trainers Rufus Deuchler and Kevin Ruse will show you how to use essential tools to add more advanced interactive elements to your projects and fine-tune your code.

Topics include:

Adding navigation and interactivity to Adobe Photoshop and Illustrator files
Understanding states and pages
Creating transitions
Incorporating video and sound
Publishing your projects
Using Adobe Flash Builder

among many other essential skills.

The lessons are wrapped in a feature-rich interface that lets you jump to any topic and bookmark individual sections for later review. Full-Screen mode provides a hi-def, immersive experience, and Watch-and-Work mode shrinks the video into a small window so you can play the videos alongside your application.

As with all titles in the Learn by Video series, the project files used in the lessons are included with the course, and interactive review questions help reinforce what you’ve learned. Selected videos are also provided ready to be downloaded for viewing on your iPhone, iPod, or other compatible mobile device.

System Requirements

Broadband internet connection
Up-to-date browser with Flash plug-in
Screen resolution 1024x768 or higher
Sound card with speakers or headphones attached
Pentium 4 2.6 GHz or higher, or Apple Mac G5
512 MB RAM

HTML5 Player-Ready

This course can be played with an HTML5 Player, which means it can be viewed online with your iPad and iPhone 4.

Project Files (Downloadable Feature)

Project files are included with this course so you can practice what you learn and work right along with the videos.

Powerful, Feature-Rich Interface

This course features video2brain’s interactive interface. As you navigate the course, rolling over a chapter or video brings up text describing that item.

Full-Screen mode provides a hi-def, immersive experience. And Watch-and-Work mode puts the video into a resizable window that you can shrink so you can watch the lessons on one side of your screen while you’re following along and applying what you’ve learned on the other.

HD Video

This course comes in crisp 1280 x 720 high definition video.

Bookmarks (Downloadable Feature)

Available in the downloadable version of our courses, this feature makes it easy to create a custom bookmark in any lesson to mark where you left off or to make note of something you want to refer back to later. You can even add a name or short note to remind yourself what the bookmark is for.

Test Yourself (Downloadable Feature)

Available in the downloadable versions of our courses, Test Yourself lets you reinforce what you’ve learned with a series of interactive test questions about the topics covered in the course.

No comments yet