Introduction to Flash Catalyst Flash Catalyst Flash Builder 4 1 1-3 6 2 Adobe Flex Builder 3 with AIR ACE Exam fc1 Flash Catalyst attempts to build a bridge between designers and developers of Rich Internet Applications. The designer role may include graphic designers, UI designers and Interaction Designers. The basic premise is that the designer will utilize the Adobe Flash Catalyst software to create rich user interfaces that include custom artwork (potentially generated in Adobe Photoshop, Adobe Fireworks or Adobe Illustrator), custom interaction with accompanying animations. The designer may place "mock" data in the application as well. Flash Catalyst will then generate a Flash Builder 4 project that may be imported in Flash Builder by the developer who will then wire the back end-code and add business logic. Our Flash Catalyst class focuses on the design aspect of Rich Internet Application development. Using Catalyst students will learn how to prepare, import and place artwork into the application. They will utlize the Catalyst Library for storing assets, manage layers (perhaps created in Photoshop), create view states for the application as well as custom interactive components. Students will also learn how to animate and add transitions between view states, control video and sound and even design with data. Ultimately the student will publish their project and prepare it for the next step which will be implemented by the developer in Flash Builder 4. An Intel Pentium class 4 processor At least 1GB RAM (2GB recommended) 700 MB of available hard disk space 1024 x 768 screen 16-bit or greater video card (1280 x 800 or greater recommended) Windows XP with Service Pack 2, Windows XP Professional, Windows 2000 Server, Windows 2000 Pro, Windows Server 2003 Apple Macintosh with System 10.4 or higher Latest version of a Web Browser, i.e.: Internet Explorer, Mozilla, Netscape Navigator, Opera Latest version of the Macromedia Flash Player 10 or higher Some familiarity with Web Development and Web Applications (i.e. HTML,CSS, JavaScript, AJAX) Understand the Flash Catalyst Environment Work with Catalyst Projects Prepare a design document (i.e. Photoshop, Fireworks, Illustrator) for import into Flash Catalyst Export an FXG file from Fireworks Import a layered design document into Flash Catalyst Import artwork into Flash Catalyst Identify assets in the Library panel Preview images, video and sound Rename, delete, use and swap assets Import and export a library package Manage layers in Flash Catalyst Work with "pages" and states Show, hide and modify objects Modify and delete states Use wireframe components for rapid prototyping Convert artwork to built-in components Add and Format text Create custom navigation and toggle buttons Create Flash Catalyst interactions Preview default transitions Add smooth transitions between states Add special effects to transitions Prepare video for the web Import video and sound Add video to an application Control video playback Add Sound effects Use SWF files in Flash Catalyst projects Add SWF files to an application Control SWF files Create a data list component Set data list properties Add design-time "mock" data Add a wireframe data list component Use Ruler Guides and Grid Draw basic shapes and lines Modify shapes and lines Getting to Know Adobe Flash Catalyst CS5 Key Features Flash Catalyst Design Workflow Opening a New Flash Catalyst Project Finding Your Way Around Workspaces Adjusting Panels Zooming the artboard Getting Help :30 Preparing, Importing and Placing Artwork 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 Indentify duplicate component assets Set component properties Create sample artowrk 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 Positin images in the artboard Optimize artwork :30 Managing the Library Viewing the library panel How do assets get into the library panel Add and delete assets to the library panel Compressing images in the library panel Renaming project assets Using and sharing assets Exporting and Importing library packages :30 Managing Layers Exploring the layers panel Expand,collapse, lock, unlock, show and hide layers Rename, Group objects Add, delete layers Stack artwork using layers :30 Working with Pages and States Page and component states Duplicating and modifying page states Give page states descriptive names Show and hide artwork in each page state Add, delete states and create a blank page state Delete objects from specific states :30 Creating Interactive Components The building blocks of RIA's Components Interactions Using wireframe components Converting artwork to built-in components Creating and working with custom buttons Working with Text Adding Interactivity Linking to external content :30 Creating Transitions and Action Sequences Inspecting defalut transition effects Adding smooth transitions Fine-tuning transitions Adding and changing effects Flash Catalyst helper effects :30 Adding and Controlling Video and Sound Preparing video for the web What is encoding? Importing and previewing video and sound Add video to the artboard and set video properties Controlling video playback Adding controls and interactions to video playback Adding sound effects Reset the video after playing :30 Designing with Data Flash Catalyst Data Lists Using 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 Sett data list properties Using a wireframe data list :30 Drawing and editing Artwork Flash Catalyst Drawing tools Using the rulers, guides and grids Drawing basic shapes and lines Preview a drawing example Grouping and Transforming Applying, modifying and removing filters Roundtrip editing with Photoshop and Illustrator :30 Publishing a Project Delivery options Publishing your application Accessibility Embedding fonts Before you publish Publish to a swf Viewing the published files Publishing to the web with Adobe Dreamweaver CS5 :30 Extending your project using Flash Builder Introducing Flash Builder 4 Extending the application Bind components to a data source Create, Read, Update and Delete Provide a keyword search Collect user input Use sliders to set values Create printer controls Explore designer-developer workflows Iterative workflow Preparing files for a developer Use data lists and design-time data Name everything Delete unused assets Opening a Flash Catalyst Project in Flash Builder Import the FXP into Flash Builder Compare an integrate code between projects Importing a Flash Catlyst library file Associate the FXPL with your application :30 Introduction to Object Oriented Programming Classes Objects Properties Methods Events Where are all of these objects? The .swc file Inheritence :30 Introduction to Object Oriented Programming Classes Objects Properties Methods Events Where are all of these objects? The .swc file Inheritence :30 Introduction to Object Oriented Programming Classes Objects Properties Methods Events Where are all of these objects? The .swc file Inheritence :30 Introduction to Object Oriented Programming Classes Objects Properties Methods Events Where are all of these objects? The .swc file Inheritence :30 Introduction to Object Oriented Programming Classes Objects Properties Methods Events Where are all of these objects? The .swc file Inheritence :30 Introduction to Object Oriented Programming Classes Objects Properties Methods Events Where are all of these objects? The .swc file Inheritence :30 Introduction to Object Oriented Programming Classes Objects Properties Methods Events Where are all of these objects? The .swc file Inheritence :30 Introduction to Object Oriented Programming Classes Objects Properties Methods Events Where are all of these objects? The .swc file Inheritence :30 Introduction to Object Oriented Programming Classes Objects Properties Methods Events Where are all of these objects? The .swc file Inheritence :30 Advanced FlashBuilder 4 Introduction to Flash Builder 4: Full 5 Day Course Kevin Ruse + Associates Inc. Kevin Ruse