Touch the firehose of ds106, the most recent flow of content from all of the blogs syndicated into ds106. As of right now, there have been 92628 posts brought in here going back to December 2010. If you want to be part of the flow, first learn more about ds106. Then, if you are truly ready and up to the task of creating web art, sign up and start doing it.

Ralph, Ritchie & Potsie

Posted by

The allure of the Animated GIF continues to hold me under its never-ending spell. This time a trip back to place where I spent far too much time as a youth: sitting in front of the tube watching Happy Days.

Again I used MPEG Stream Clip to pull the five frames that comprise this GIF file from the 4th season Happy Days Intro. I imported the five png files as layers into GIMP. I also wanted to add the ds106 logo as wall art. I can think of two ways to do this.

One would have been to import it as a layer, place it in the proper location, duplicate the layer 5 times (one for each of the frames), move those five duplicated layers above each of the “frame” layers, and merge each ds106 logo layer into each “frame” layer. This would have been a repetitive process that I’m certain would have worked.

Instead, I wanted to experiment with Layer Masking. I had a bit of success the Tim Berners-Lee Chicken Basket image in an earlier post and wanted to try to apply the new found skillz. Here are the steps I followed:

  • imported ds106 logo as a layer and moved it into the top left corner
  • resized the layer to “layer as image size”
  • selected all the blank space around the layer
  • moved to each of the five “frame” layers and added the selection as a layer mask (what Ā this did was to create a transparent cut-out in each of these frames through which the logo will show through as the animation runs)
  • moved the logo to the background level layer
  • saved as GIF (make sure to choose the animation option – I set the frame rate delay to 350 milliseconds – need to experiment with this)

The next step was to test the GIF, I dropped the file into a web browser and it began to play. The ds106 showed up exactly as expected. The only problem was there was a flash of white every time the animation sequence repeated. This is because the background layer was just the logo with the rest of the layer white.

To fix this, I merged the bottom frame layer with the background logo layer and it worked as seen above.

This is a very simple example of what can be done with the layer mask. I’m more interested in using it to make the majority of the frame stationary with just an isolated portion of the scene moving. I hope to attempt something like Otto did with this clip of Buddy Holly and the Crickets eventually. Notice how only the hands, heads and bass move in this one. Still, Otto seemed to have a bit of a shaky hand when making his layer masks or Alpha Channels as they call them in the Photoshop.

Also, I still need to figure out how to make either a tutorial with images or a screencast type video. Maybe this weekend I can do something along those lines.

Add a comment

ds106 in[SPIRE]