Category: Tutorials


This is the final tutorial in getting your child’s artwork into Flash Catalyst and turning it into a working Twitter search application.  In Tutorial 1 you learned how to get your artwork into Photoshop and get everything all set up for Flash Catalyst.  Then you learned how to import the .psd into Flash Catalyst and turn the artwork into working components.  In the Tutorial 2, you learned how to build the various states your application will need and to use Flash Catalyst to create animations when then application switches between states.

In this tutorial you’ll learn how to move from Flash Catalyst into Flash Builder 4 and hook your application into the Twitter search API.  Before you proceed make sure that you are happy with how your application looks and behaves.  Currently Adobe’s Flash Catalyst -> Flash Builder work flow is one-way only.  There’s not really any way to move backwards from Flash Builder into Flash Catalyst.  You can do all the stuff you do in Flash Catalyst in Flash Builder 4, but for what we’re dealing with here, many of the steps are easier in Flash Catalyst.

View full article »

In case you missed it, here’s part 1. In part 1 I showed you how to take your child’s artwork into Photoshop, chop, layer and label it, import that into Flash Catalyst and turn all that artwork into working components. If you follow all the way through these tutorials, you should have a working twitter search application built with your child’s (or your) artwork.

The final apps can be seen at the following links:  Joey Twitter and Ana Twitter.

And now on to part 2.

Flash Catalyst Interface

We’re going to now build the application states and transitions within Flash Catalyst. If you haven’t created all your components yet or are not sure how to do that please check out the first part of the tutorial. For this application, we’ll have 3 states: start, searchPage and searchResults. The idea is that the start page will show the Start button.  When that is clicked, the application will transition to the searchPage state where the user can enter their search terms to search Twitter.  When the user searches for something and clicks the search button, the application will transition to the searchResults page and display the results of the search. For fun, we’ll also hook up the signature button.  If it is clicked on the searchResults page, the application will transition back to the searchPage state. If it is clicked on the searchPage state, it will transition back to the start state.

View full article »


The other day I decided to have my two daughters draw what they think a computer program should look like.  I sketched out a few key components so they’d know what I needed.  I drew a search button, a search box, a start button, a scroll bar, a scroll bar thumb, an area to put data in, and a repeating data item.  The idea was that I’d take their drawings and turn them into working Twitter search programs using Flash Catalyst to build the interface and then dropping that project into Flash Builder 4 and hooking it all into Twitter.

The final apps can be seen at the following links:  Joey Twitter and Ana Twitter.

As it turns out, doing all of this with absolutely no Flash Catalyst experience and basically no Flex experience was pretty simple and the girls love it.  So without further adieu, here’s the tutorial.

View full article »