"Photoshop to Flash: Optimizing Pixels and Workflow" - Michael Ninness

Michael Ninness broke the ice by handing out sweets to the crowd to sweeten them up (sorry, the bad joke was mine). He commented on how reserved the Brits were. I think the American speakers at the conference have felt that we're a tough crowd!

• Aimed to cover 5 things
  
  
  1. Layered PSDs into Flash
  
  
  2. How Flash handles embedded bitmaps
  
  
  3. Loading external bitmaps at runtime
  
  
  4. Photoshop to Flash colour issues
  
  
  5. Quick image enhancement technique


• 1. Importing PSDs into Flash
  
  
  • Demo-ed doing it straight away. Image looked fine but it was a composite image (i.e. all layers in one)
  
  
  • Alternatives:
  
  
  • 1. Export layer by layer
    
    
    • Duplicate layer to a new file
    
    
    • Helps if layers are numbered by depth
    
    
    • Imported layers are all put on one layer
    
    
    • Select all of this and use Distribute to Layers to spread them about
    
    
    • Compositing bottom to top to import correctly
    
    
    • But imported files come in with bounding boxes for while pic not just contents of the layer
  
  
  • 2. Automate the process
    
    
    • File > Scripts > Export Layers to Files - but no PNG (only format for transparencies)
    
    
    • But ImageReady has... Export Layers to Files
      
      
      • You can optimise each layer separately
      
      
      • Layers aren't named - boo!
      
      
      • Format is PNG24
      
      
      • Bounding boxes are ok
  
  
  • 3. Export from ImageReady as a SWF
    
    
    • Usually turn off Keep Appearance
    
    
    • Choose Lossless 32 (which is actually PNG)
    
    
    • No layer names come in - Boo!
  
  
  • 4. Plugin from MediaLab - PSD to FLA extension
    
    
    • From photoshop - File > Export > PSD to FLA
    
    
    • Good bounding boxes
    
    
    • Layers named
    
    
    • Symbols named
    
    
    • No blend modes go across
      
      
      • Note them and add the equivalent in flash
    
    
    • Clipping layers - clipping mask
      
      
      • Narrows the layer to just the contents of that layer
    
    
    • You can achieve most stuff with a bit of trickery
  
  
  • 2. How Flash handles embedded bitmaps
    
    
    • When you bring in a PNG it get exported as a JPEG!
      
      
      • Flash doesn't recompress JPEG and GIF
      
      
      • But does to PNG
    
    
    • JPEG quality slider in Publish Tab effects only PNG!
      
      
      • Unless you change the defaults of the image in the library
    
    
    • In general, do your JPEG compression in Photoshop
      
      
      • Will go out of Flash as they came in
  
  
  • 3. Loading external bitmaps at runtime
    
    
    • Lots of rookie stuff which, none of which I bothered with...
  
  
  • 4. Photoshop to Flash colour issues
    
    
    • Flash only has one colour profile: sRGB
    
    
    • Photoshop has loads and tends to use Adobe RGB
    
    
    • So when file comes into Flash, Flash ignore the colour profile and just uses sRGB
    
    
    • When opening a file in Photoshop, always choose to use the embedded colour profile
    
    
    • Then copy the file and convery (edit > convert to profile) and choose sRGB
      
      
      • You can hardly tell the difference
    
    
    • There is also a cross platform Gamma issue
      
      
      • PCs show colours darker than Macs
      
      
      • You can use View > Proof Setup to show the differences
      
      
      • Switch back and forth to check
      
      
      • Best way - duplicate files
      
      
      • Tile them next to each other
  
  
  • 5. Quick image enhancement technique
    
    
    • Hold alt key when doing things stops the popup alerts - calls the "Make better" key
    
    
    • Resolution doesn't matter - its only for print
    
    
    • Its all pixels!
    
    
    • When resizing, use Bicubic Sharper (when reducing size)
    
    
    • Good to change your preferences so this is the default
    
    
    • Best way to sharpen files
      
      
      • Make a duplicate layer and add filter HiPass (highlights only the edges)
      
      
      • Put the radius to around 2.5
      
      
      • Add adjustment layer of overlay (removes the grey)
    
    
    • Ctrl-shift-B - autocolour command
      
      
      • 90% of the time this will sort out any colour issues (i.e. if its too blue)