10 Challenging but Awesome Flash Techniques

Mar 17th in Web Roundups by Glen Stansberry

These days, most Flash developers know how to circumvent the multimedia platform's short-comings and properly utilize its strengths. Here are some very clever Flash techniques that you can apply to your site, making them more useful, beautiful and unique.

PG

Author: Glen Stansberry

Glen Stansberry is a web developer and blogger. You can read more tips on web development at his blog Web Jackalope or follow him on Twitter.

1. Send and Receive Phone Calls, SMS and Voicemail with Flash

Mobile development is something that all web developers should be paying attention to. With the rise of iPhone apps, Blackberry and Android applications, it's very clear that the phone is still going to play an important part in our culture. There are plenty of indicators that the fusion of the web with the mobile platform is already upon us, (like the launch of a mobile version of Facebook Connect).

This screencast shows developers how to effectively send and receive phone calls directly via Flash applications, using a set of Ribbit APIs.

2. Pyramid and Funnel Charts with Adobe Flex

As of right now, things like funnel and pyramid charts aren't really worked into the Flex framework. This is unfortunate, as these types of graphs are a huge part of displaying complicated data in a graphic format that is much easier to understand. Here's a tutorial on how to utilize the FusionCharts for Flex module to get the much-needed graphs and charts for your Flash application.

3. Creating Liquid GUIs with Flash and ActionScript 3.0

Desktop applications certainly have a leg up on web applications when it comes to easily resizing the web page. Oftentimes the width of the web page is dependent on many different factors like type of browser, browser size, and what type of layout the page has. In short: it can be a hassle.

If you have a Flash-based layout, making it liquid can be very doable. Adobe has an excellent 4-part tutorial on how to make Liquid GUIs with a combination of Flash and ActionScript to create effortless liquid layouts.

4. Realistic Coffee and Smoke Effect

We've all seen the smarmy smoke effects that come from Flash applications and animated gifs. Yuck. However, FlashVault has an incredible technique that creates seriously realistic wafting steam or smoke. Best of all, the technique requires no ActionScript to make the magic happen.

5. Return Database Records to Flash

AMFPHP is a light-weight PHP client for the Action Message Format, which transports data between Flash and a database. Being able to connect Flash applications to a database is incredibly important for creating rich sites. Without the database interaction, the Flash page can only be used as a static page. Adding the element of a database allows you to capture form data, create user accounts, and many other things.

gotoAndLearn has an excellent screencast that shows how to use AMFPHP to connect to a MySQL database and return some database records.

6. Use Lightbox Inside of Flash Applications

The Lightbox effect is one of the most popular ways to show modal windows with Javascript. It's also a great way to put content directly in front of the user's face, while dimming the rest of the content. While the Lightbox effect hasn't been created for Flash yet, there is a way to fuse Flash with the popular Javascript functionality by calling lightbox from within Flash.

7. Create a Walk Cycle: The Right Way

Much like the steam or smoke effects done in Flash, creating walking characters is not easy to make it look realistic. The walk cycle is a hard thing to pull off. Oftentimes the walking figure is walking in the middle of the screen without moving (imagine an invisible treadmill beneath him), or is walking awkwardly across the screen, clunking his feet flatly on the ground as he goes. Not a pretty sight.

Flash Tricks has a great tutorial on how to make a life-like walking cycle in a Flash application.

8. Advanced Image Gallery

Flash image galleries are incredibly elegant with fluid transitions and backgrounds. Here's an in-depth tutorial on how to make an advanced Flash image gallery using data from XML, tweening effects, and many other advanced Flash techniques. This image gallery also uses the MovieClipLoader class to load images externally, which offers more flexible and advanced options.

9. Export JPG with Flash PHP

Capturing screenshots from videos can be very useful when dealing with movie files and other media. Video sites like YouTube, Viddler and the rest all take screenshots of the uploaded movies at certain lengths of the film. Sephiroth.it has an advanced tutorial on how to fuse Flash and PHP to take these screenshots.

10. Handle Cue Points for Audio Files in ActionScript

Cue points are quite easy to make in a Flash video file, and can be done using the Import Wizard, Component Inspector Panel or the Property Inspector. However, creating cue points in an audio file is no small picnic. Adobe Pro David Stiller offers two different ways to create the cue points for an audio file, in a three part series. The tutorial recommends at least an Intermediate knowledge of ActionScript 2.0 and ActionScript 3.0, as well as Introductory experience with Flash CS3 Professional or Flex Builder 2.


Related Posts

Check out some more great tutorials and articles that you might like

Enjoy this Post?

Your vote will help us grow this site and provide even more awesomeness

Plus Members

Source Files, Bonus Tutorials and
More for $9 a month for all TUTS+
sites in one subscription.

Join Now

User Comments

( ADD YOURS )
  1. PG

    Tyler Cook March 17th

    First to respond, Decent tutorial; I will definitely check out Rabbit.

    ( Reply )
  2. PG

    Aaron March 17th

    This stuff is way over my head at this point, but I’m bookmarking it anyway. Hopefully I’ll be at this level before too long. Love the Strong Bad cameo!

    ( Reply )
    1. PG

      crysfel March 18th

      hehehhehehe… don’t worry, sooner or later you will ;)

      ( Reply )
  3. PG

    Yoosuf March 17th

    nice stuff, ita about RIA, thanks allot

    ( Reply )
  4. PG

    Randy March 17th

    Nice to see some flash stuff! Can’t wait to dig in.

    Thanks!

    ( Reply )
  5. PG

    Reimu March 17th

    Great stuff! I didn’t even know flash was capable of that. Will surely check it out!

    ( Reply )
  6. PG

    Amir March 17th

    Very useful techniques… happy to see some flash stuff on net-tuts. Thanks

    ( Reply )
  7. PG

    cooper March 17th

    whens flashtuts coming out? :D

    ( Reply )
  8. PG

    Dev March 17th

    yea i hope more Flex/Flash site coming soon

    ( Reply )
  9. PG

    john March 17th

    flashtuts sounds good to me

    ( Reply )
  10. PG

    Riley Davis March 17th

    Aweome! thanks for these tutorials. I know there are a lot of us designers that frequent the other sites, and I think a lot of us get into the developing side through flash and actionscript. Keep the actionscript coming!

    ( Reply )
    1. PG

      Danny Pape March 18th

      That’s exactly how I got started was with Flash and Actionscript.

      ( Reply )
  11. PG

    insic March 18th

    it would be better if we are reading this tutorial in tuts network. :)

    ( Reply )
    1. PG

      crysfel March 18th

      i agree :o

      ( Reply )
    2. PG

      SuicidaDe19 May 14th

      i love u !!! =D

      ( Reply )
  12. PG

    Fred Soler March 18th

    Flash here ?!!! Very cool !
    Want more !

    ( Reply )
  13. PG

    Vayu March 18th

    I agree, its good to see some flash stuff here.

    However, I think you should stick to AS3 stuff. The advanced image gallery is as2 and is IMO old. You should be encouraging people to learn AS3….

    Vayu

    ( Reply )
    1. PG

      Alex March 18th

      Yah, I agree with that. Not much point in learning the “old way” when you’re starting out. Especially when new people may not realize that there’s a difference between AS2/3.

      You can always go back and learn AS2 if/when you need it for a project…

      ( Reply )
    2. PG

      WallPaperDude July 9th

      As someone who started with AS1, knows and loves AS2, and who hasn’t really touched AS3 yet, I’m glad at least some stuff mentioned around this network still deals with AS2.

      ( Reply )
  14. PG

    Romeo Adrian Cioaba March 18th

    Another great AMF library is Zend_Amf which is part of Zend Framework

    ( Reply )
  15. PG

    FreelancerCrowd March 18th

    Very handy! Goes bookmarked.

    Thanks!

    ( Reply )
  16. PG

    Patternhead March 18th

    Great article, thanks for sharing

    ( Reply )
  17. PG

    Rahul Chowdhury March 18th

    OK, this is the greatest post ever. I will try them all.

    ( Reply )
  18. PG

    Richard S Davies March 18th

    yeah! the more flash the better, would love to see a flashtuts!

    ( Reply )
  19. PG

    grrrrr8 March 18th

    GREAT STUFF.
    BUT WHEN ARE WE GOING TO GET FLASH TUTS!!!!!!

    ( Reply )
  20. PG

    DtgDesign March 18th

    Excelent !!!

    ( Reply )
  21. PG

    Alex March 18th

    Good seeing some flash here!

    ( Reply )
  22. PG

    Shane March 18th

    Interesting to see some Flash stuff on here…

    What I’d really like to see is a ‘Getting started with Adobe Flex’ article… that’d be cool, and would focus on the developer’s view of things.

    ( Reply )
    1. PG

      Danny Pape March 18th

      I don’t know if we are allowed to reference other sites but I am going to anyway. In this article Glen mentioned gotoandlearn.com. It is run by Lee Brimlow, he is a Flash/Actionscript evangelist with adobe. Check out his site I think you will find exactly what you are looking for about getting started with Flex.

      ( Reply )
      1. PG

        Shane March 18th

        Thanks Danny – this site is about learning and sharing information – I don’t think anybody will mind you posting the link. Thanks a lot.

  23. PG

    David March 18th

    I used ribbit about 3 months ago. It does not work in the UK tho. They said back in 2007 they were working on it but no Joy yet :(

    Useful info and links tho, nice one. MORE FLASH PLEASE ;)

    ( Reply )
  24. PG

    Andre March 18th

    very nice, congratulations…
    its good to see some flash here.

    Maybe soon someone post something about the 3D engines, like papervision 3D, alternativa 3D…

    ( Reply )
  25. PG

    Joel Zayas March 18th

    Good to finally see some tuts on Flash. Good stuff!

    ( Reply )
  26. PG

    john Dangerous March 18th

    It’s about time we had some Flash stuff on here.
    Thanks for this

    ( Reply )
  27. PG

    Martyn March 18th

    This has to be the first flash tut Ive seen, Im hoping theres going to be a few more of these. Flashtuts maybe?

    Ive never heard of the Flash Rabbit phone call receiving stuff before so out of all of them I will be checking that out first!

    ( Reply )
  28. PG

    Sc March 18th

    Do you have experience with free web charting tool Style Chart? It looks like it is used for visualization beyond a regular chart

    ( Reply )
  29. PG

    crysfel March 18th

    thank you for the tutorials, some of them are interesting :D

    have funnnnnnnnnnnnnn….

    ( Reply )
  30. PG

    Taylor Satula March 18th

    I am totally in the dark about flash but good anyway. btw the first ine kinda has alot of adobe elements in it…

    ( Reply )
  31. PG

    sergi bosch March 18th

    looking forward to experimenting with the “advanced image gallery”. coolio.

    ( Reply )
  32. PG

    Alex March 18th

    I really think someone who knows Flash well should be “approving” posts like this. Some of the articles mentioned have code that uses some really bad practices. Not the kind of stuff that is tuts network quality.

    Flash has a bad rep because people who shouldn’t be teaching are, and people who don’t know what’s right listen, learn and repeat. I don’t think nettuts, or the (hopefully) future flashtuts should promote that.

    Stick with Lee Brimelow’s tuts; he knows his stuff.

    ( Reply )
  33. PG

    Dainis Graveris March 18th

    didn’t know such things are possible with flash, great learning.

    ( Reply )
  34. PG

    Angel Romero March 18th

    For those interested in what Ribbit can do, you should check out the AIR iPhone. It integrates the Ribbit API into an AIR app that allows you to make and receive phone calls right from your desktop.

    ( Reply )
  35. PG

    longyZ March 18th

    We need more tuts on flash and flex!!!

    ( Reply )
  36. PG

    Nikhil - Powerusers March 19th

    awesome article!
    I agree with longyZ
    Thanks

    ( Reply )
  37. PG

    Christian March 21st

    just nice!!

    ( Reply )
  38. PG

    Stunt March 21st

    very good !
    so talk about “Adobe Flash Catalyst”

    ( Reply )
  39. PG

    Vicky Nimbalkar March 22nd

    Thats was fantastic. I never thought of such possibilities with Flash Software.

    Keep up the good work.

    ( Reply )
  40. PG

    Franky March 24th

    OMG I love flash so Much. I heart flash, I heart you so…

    ( Reply )
  41. PG

    Dario Gutierrez May 5th

    Awesome techniques.

    ( Reply )
  42. PG

    thonbo May 14th

    smoke effect pretty weak compared to what you can obtain from perlin noise

    http://thonbo.com/tempShowCase/baresso.html

    ( Reply )
  43. PG

    Laura Godfrey May 15th

    Great article!

    Your tutorials are extremely useful. Tutorial 4 in particular is easy to use yet offers effective results. For any website, flash can add a certain element to it, that helps improve the site’s appeal. Flash galleries are also effective and allows you to feature multiply images at the same time. – Appearing to be quite technical, this is actually easy to use and good for showcasing products. Overall, this article has successfully addressed various ways of implementing flash into your website.

    ( Reply )
  1. Arrow
    Gravatar

    Your Name
    May 15th