Part 3: CS5 Recap/Notes

Flash CS5

• InDesign: export file (CS5 FLA); TLF Flash type engine text (requires FL10 player); classic text for FL9 or earlier; ID goes in and saves 24-bit PNG files for FL use; very powerful image processing tool (ex. 200 headshots; add effect; export JPG)
  
  
• Open file in Flash; file doesn’t have any timeline controls set in place; need to add actions; everything in ID has been made to work in native FLA files - everything as pgn files, sound/video or symbols (movie clips or buttons).
• isolation mode (double click on movie to dig into file); ID also created layers in timeline inside movies
• only disconnect is that invisible buttons are nested inside movie clips. You have to reference parent clips with AS or cut/paste button onto main timeline.
  
  
• Action Script 3 updates - Code Snipets (Yippee!): click on movie/button; bring up code snippets panel; panel has folders of snippets: actions, timeline nav, animations, load/unload, audio/video,
• Actions > ‘click to go to web page’
• All code is imported with correct syntax and FL will made it applicable to your instance (plus it automatically adds notes w/ instructions for editing!)
  
  
• Linked text frames (finally)
• TFL (Flash 10)
• Property panel (new panels) - everything is scrubby (position/size; advanced character; containers/flow; columns; color effect; display; filters); similar type properties as ID without converting to dynamic text box - all in one object now; will read in browsers that don’t support TFL Flash 10; but will not have some of the enhancements/features you’ve used.
  
  
• New doc: Properties Panel (one work flow option); Publish - create AS3.0 Class file; main; okay; script written it for your file, independent from fla doc; you can edit AS3 outside of doc;  allows you to work simultaneously with designers on fla files and developers on AS. 
• Flash Builder: XML, rich text environment; all code/no interface.
  
  
• Drag/drop native PSD onto scene - converts to PNG in libray
• Fla file format > XFL (CS5 uncompressed doc)
• Save as folder with XML and all assets; text based files now; versionable; now open in DW and edit;
• Library Folder - acts like a mini-website; now you can swap out images or update them directly from folder independent of flash.

Dreamweaver CS5

• In Photoshop: save map pic as jpg (save at least IE6); save file with a series of 3 dots; each diff color; shift file than div and achor tags = fully interactive experience; add New CSS Rule > class; ‘map container’; define dimensions; import jpg as background of div; Insert > Div Tag (reference ‘map container’); Code View: insert achor tag (add class, even if it isn’t defined yet); link to # symbol; achor tags become objects; New Rule > ‘a..’; display - block; background - dots.png; repeat - no repeat; set to zero, zero; position as absolute; container position as relative; all code is generated by CSS; no change in HTML (local rules vs global CSS rules for the objects)
  
  
• jquery - Javascript framework; manipulate all HTML docs; link to it; then script with document ready function; once all page is loaded; you can updated/manipulate anything; built in functions - show/hide, change dimensions; dynamic manipulating on the fly   
  
  
• Spry - Adobe released with CS3 (manipulate while working); select XML file; select layout format and click OK; blue = variables from XML; bindings panel - variables from data set; dynamic XML driven application
  
  
• Webkit/iPhone Simulator
  
  
• RSS feed can plug into XML file on web.
  
  
• Dreamweaver Features
• Live View or use Hover View (inside DW layout); Non-destructive CSS previewing; temporary de-activing of CSS to see modifications
  
• CSS Theme (Wordpress) editing w/DW; ‘Discover’ in DW and it downloads all server files; filter by css and edit your Wordpress site.

Flash Catalyst CS5 (new workflow option for flash users)

• In the background constantly building code; can be edited in Catalyst or Builder.
  
  
• Open > AI file; convert all to FXG (XML based file); graphic interchange formats for all programs in CS to use
• At Top: states (similar to FW and PS layer comps); main canvas; timeline (regular and designtime); interactions panel; library w/all layers from illustrator in it.
  
  
• HUD (heads-up display) - choices of all the things you can do based on what you are clicking on; components can be made by grabbing/clicking on it and telling Catalyst to make it a button; States in HUD - double click = inside button and you see states at the top; Button - interactions panel: on click; play transition to state;
  
  
• Timeline is visual - shows the transition states w/every item and ability to preview; visual timeline to see when it’s going to happen; smooth transition button; will create transition between anything different in one state to another (size; location, etc.)
  
  
• Publish to swf or AIR; display-to-web folder; run-to-local folder (to preview on your machine).