Posts tagged SeaFlex

Today I was going to post about using flashvars and widget development. However, as I started to document the process, it became too much information for a single tip. So I’m going to do a separate post walking you through my widget development process. Now on to today’s tip!

To be honest with you guys, I’ve never really been a huge fan of Fireworks. I’m a Photoshop guy, and I have been since version 5.5 (hooray ImageReady). However, at our last SeaFlex meeting Marty gave a quick introduction into Flex skinning using Fireworks. My eyes were opened! So here is the basic run down of creating Flex skins using Fireworks CS4.

1. Within Fireworks go to Commands > Flex Skinning > New Flex Skin
   
2. Select the components you want to skin.
   
3. Skin to your heart’s desire.
   
4. When you’re finished, go to Commands > Flex Skinning > Export Flex Skin
   
5. I created a new folder called testSkin and saved to that.
   
6. Now in Flex Builder. File > Import > Skin Artwork
   
7. Browse to the folder we just exported our assets to.
   
8. Make sure the image to component mappings are correct.
   
9. And…. you’re done.
   

Amazing.

:: UPDATE ::

Marty just posted a PC (and more in depth version) of the skinning your Flex applications with Fireworks. Read it here!