You may have heard about the Adobe Flash vs Apple war – where Apple, the un-official leader in the access of mobile information (aka the makers of iPad and iPhone) are side-stepping Adobe, the owners of Adobe Flash (and photo editing giant, Adobe Photoshop) by not allowing certain Flash media to be rendered / displayed on their mobile products (.swf movie files to be exact).
This is quite big as far as web development goes. For years Flash was the go to for creating slick motion graphics and a whole lot of other ‘dynamic-ness’ that you see on websites. Some designers used it in moderation, others, bless their souls, developed whole sites using Flash media. Thankfully, sober minds prevailed, HTML survived, and now, thanks to some degree to Steve Jobs, it means that web developers are starting to seriously look at new and old alternatives to animate websites. And of course we at WildWeb want our websites to show up and work on the ‘coolest’ gadgets around, so we decided to give serious thought to the use of Flash media on our websites.
Case in point, the launch of our latest website identitysigns.co.za.
Identity Signs is a sign writing company who are the guilty parties for making those house size light box signage that adorn the premises of Tiger Wheel & Tyre, KFC, Virgin Active… just to name a few. Telling by their handiwork, these guys certainly have an eye for design. So, when they solicited our services to develop their new website, it was a big deal for us. We needed to step up and come up with something ‘flashy’ without it being done in flash – if you catch what I mean.
Log onto identitysigns.co.za to see the finished product. Do you notice all the movement and fluidity? You would normally get that from flash movies. Instead, we went with the old faithful animated Graphic Interchange Format (Animated gif) to produce what you see, plus, ironically, some nifty export settings on Adobe Flash itself.
We thought of offering something different this week on our blog. For all you aspiring web animators out there, we thought that we’d offer you a step-by-step ‘how to make a quality animation using Flash, without it being Flash’. See the steps and example below…
As for you non-aspiring web designers… visit us again next week
How to make a ‘QUALITY’ animated gif:
Want to make a minimum resolution / high quality web animation pic, that can be viewed on iPhone or iPad? Open up Adobe Flash and do the steps below:


1. Firstly make sure your Flash animation is all on the main timeline (ie there are no animations running within Movie Clips).
– You may need to ‘Copy Frames’ from within any Movie Clips and ‘Paste Frames’ on to the main timeline to do this
– The positioning of the Movie Clip elements no longer matched up to the elements already on our main timeline so we found this handy tip to move all the frames at once (can also be used to resize or move an entire Flash animation in one shot – bet you thought that couldn’t be done) http://ye5.blogspot.com/2010/12/move-resize-all-frames-in-flash-at-once.html. Big time saver!
2. Once everything was on the main timeline, we exported our animation as a bitmap sequence.
– (File > Export > Export Movie > Bitmap Sequence)
3. Now in Adobe Bridge, open the folder where you saved the bitmap sequence.
– Select all the sequence bitmaps (holding down the shift key).
– On the main menu go to Tools > Photoshop > Load files into Photoshop Layers. This opens a Photoshop file with your bitmaps loaded into layers. Handy!
4. In Photoshop, open your Animation window (Windows > Animation)
– Click the small icon in the bottom right of the animation window to see Animation Frames instead of Animation Timeline.
– Click on the animation window fly-out menu (top right of Animation window) and select ‘Make frames form layers’. If the sequence is back to front (like ours was) then in the same menu click ‘Reverse Frames’ . And your animation is ready!
– To make the animation play every 10 seconds… loop ‘forever’ with the last frame set to play for 10sec.
5. File > Save for web and devices, and save as file type GIF.
Done. The file is only 40kb and can be viewed on all operating systems.