Flashy Flash On the Go: Creating Animations For Cell Phones
- 1. Create a document using Device Central.
- 2. Check out Illustrator CS3.
- 3. Set up your document to integrate with Flash CS3.
- 4. Create blends out of symbols for animation in Flash.
- 5. Export from Illustrator to SWF for Flash.
- 6. Explore the new Flash CS3 workspace.
- 7. Add a new background in Flash CS3.
- 8. Copy and paste from Illustrator CS3 to Flash.
- 9. Create a motion path and a motion tween.
- 10. Publish and test your file.
For creative people who have no experience with the original Macromedia products, the upgrade to Adobe Creative Suite 3 comes with quite a surprise: Flash CS3 is a whole new kettle of fish. Some may even ask, "Why is it here and why do I want it?" For most designers, the mention of ActionScript turns their stomach.
So let's use the combination of our great old friend Illustrator, in conjunction with the new Adobe application Device Central CS3 plus Flash CS3, to create a great little animation that can be played on a mobile device (think cell phone). Don't panic! There will be no ActionScript in this lesson. I repeat, NO ActionScript.
1. Create a document using Device Central.
By creating our document in Device Central (Figure 1), we can make sure that we get our file dimensions correct. For example, if we need to have our animation play on a certain type of mobile phone, we can select that phone from a list of profiles. More profiles can be added to the list as new devices become available. Later on we'll test our movie using Device Central to see if it looks good.
Figure 1 Start-up screen for Adobe Device Central, new with CS3
For this exercise we're going to choose a device that has a screen size of 240x320 pixels. There are 173 devices that match this very common size (Figure 2). You can sort your devices in a number of different ways, including by manufacturer, screen resolution, or even the Flash Lite version the device can display. Sort the devices by size (look for an extremely tiny pop-up menu next to the Available Devices pane, at the mid-left of the Device Central workspace). Select 240x320, and a number of phones will appear in the main display pane.
Figure 2 Settings for mobile devices include display size.