Making Mr. Clown look very nice

August 2013 Animated GIF challenge #8 is “Add some flower power!”

The idea is to make something not so nice look nicer by adding some flowers.

Todd Conaway made this scary picture the other day, for a thank-you note to a childhood fantasy character.

image

I thought this one could use some serious flowering.

So I made this. I think it takes some of the creepy out of him by covering his eyes and mouth with flowers. Right?

image

This actually took me MUCH longer than I had expected. I’ll note that in another post, because I would like some  help with a particular question about why something I tried didn’t work.

What I did here:

I got the flower images from a site Talky Tina pointed to in her blog about this assignment: http://www.clker.com/search/flower/1

1. Duplicated flower images three times, adjusted opacity of each so 25%, 50%, 75%. Also played with the “layer mode” on GIMP of some of them to get funky colours (the two on the clown’s eyes).

2. Duplicated the original clown image to put under each of the first flower layers (the blue one on the left)—so a clown image under the 25% opacity of the flower, then one under the 50% and 75% opacities. Then merged down so had three layers of the clown image plus flower at different opacities. The idea of what I did is given in the screenshot below, even though it is for different flower layers. This is before merging down.

image

3. Duplicated three times the layer with the blue flower at 75% that had been merged with the clown image, and then put one of those under each of the next flower layers (the purple one at left, in 25, 50, 75% opacities). Merged down.

4. Repeat with other flower layers.

5. I duplicated the last flower layer (daisy on the clown’s mouth) several times, so the whole image with all the flowers would stay for a bit longer at the end. That worked fine until I “optimized animation for GIF” in GIMP (Filters->animation->optimize for GIF). I didn’t do that at first, but then the image was too big to animate on Tumblr. Seems it needs to be less than 1MB to animate. Optimizing it makes it MUCH smaller (this one is just over 140 KB), but it got rid of the duplicate layers at the end, so the image with all the flowers didn’t stay very long. What it did was add “combined” to each layer, though I don’t know what that means. So to fix this, I after optimizing I just duplicated the last layer a few times again. Worked like a charm.

6. I don’t like how GIMP has been making the GIFs look all pixelated. This is probably due to the optimization stuff, and/or the GIF format? Yes? No?

I wanted to have the flowers fade back out again like they faded in, but by the time I got this far, I had spent way more hours than I had planned, and decided this was good enough.

I tried what seemed to me a much easier way of doing this, but it wouldn’t work like I thought it should. Next post: please help me figure out why that didn’t work!

Scottlo going in circles in the desert

“Scottlo going in circles in the desert” by Christina Hendricks is licensed CC-BY-NC-SA Canada (the original car image is licensed as such).

The August GIF challenge for ds106 continues; this one is #5: reinvoke a missing ds106 friend! According to Talky Tina,

If you are missing a Friend from the DS106 Digital Storytelling Community, maybe you can re-invoke them into coming back with a voodoo Animated GIF Poster of your own!

Talky Tina and I both did posters for our friend Scottlo, who left Saudi Arabia a number of weeks ago, and has been very quiet since. I know he got rid of his Yaris and doesn’t have it anymore, but that’s how I remember him—talking about driving his Yaris in the desert on ds106 radio.

And you know what? It worked! When I sent out a tweet last night asking for help with gifs, Scottlo replied! He’s around! Bill Smith said Talky Tina and I invoked him with our Art Makes. Wow, art is powerful.

The process

I used a still frame from Andrew Forgrave’s gif on this ds106 assignment for Scottlo’s Drive By show on ds106 radio. I then got this picture from Flickr, which is a place in Saudi Arabia that I have no idea if Scottlo ever visited (“Cliffs Near Faisal’s Pinnacle,” by Peter, licensed CC-BY).

I cut out the car from the background using the lasso tool, as well as a layer mask so only the car showed. I made numerous copies of the car.

I put the text on the background, saying “Scottlo left the desert in his Yaris weeks ago…have you seen him?”, and made lots of copies of that.

So then I just moved the car layers across the background layers so it looked like it was moving. I had lots of car layers at first, but was ending up with too many layers, so I made it jump across a bit faster.

The last layers were just a background with no car, and the text “Oh wait…he’s just going in circles.” So it would be just the background with that text, then the whole thing would start over. But it didn’t look right when the gif moved, so I decided to make a second pass of the car across the desert with that text on the background, so it would be like you notice he’s going in circles when he comes back around.

PROBLEM! I wanted the car to go back across the desert, but had already merged the car layers with the background layers, so couldn’t re-do the moving car without using the lasso tool on the original car image AGAIN. Okay, so I just use the first moving car layers over again. NO, because those have the wrong text on them (the first text about him leaving the desert), and I’ve already merged that text onto the layers.

Nothing to do but use the clone tool to “erase” the text on the moving car layers and replace it. I don’t know if I could have used the eraser tool…maybe.

LESSON TO ME: Don’t merge layers down until you know you are through. Of course, Rockylou told me another trick: save several versions, some without layers merged down, so you can go back and change stuff with the earlier versions if need be. I even said “yes, good idea,” and then I didn’t do it! Boo me. The problem is that you can’t really see what the gif is going to look like until you merge layers (unless you’re really good at this stuff and can just tell what the program is going to do!).

So yeah, I cloned the sky, and got rid of the original text, and put the “circles” text on the second go-around of the car. And of course I didn’t clone the same way on each frame, so you can tell that the color around the text changes. Also, I didn’t put the second text on enough of the moving car layers, so it doesn’t go for long enough. But if I try to add it to another layer now, it won’t be in the same place on the image (I duplicated the background with the new text, so it was always in the same place). So again, lesson to me!

And why the heck is the text so pixelated and not-nice looking? no clue.

I had a lot of fun with this one, and again, I’m learning more and more with each GIF!

Jim Groom in my fridge

DancingJimGroomInFridge-bigger

 



So I was out of town for a week, and when I got home I opened the fridge to…what the H-E-double-L is THIS? Jim Groom in my refrigerator? Okay, I’m a bit creeped out now. At least he seems to be having a good time. Maybe he ate all the food and just left the sparkling water and the Metamucil.

This is the Dancing Jim All Over the World ds106 assignment, as part of the August 2013 GIF challenge created by Talky Tina.

This one was not as difficult as I feared it might be, in large part thanks to some very helpful instructions posted by Rockylou and Brian Bennett.

I used an earlier image I made for a ds106 daily create as the background and foreground for Jim.

The process

 

1. Opening and duplicating the background image

I opened (as layers) the wireless mic version of the Groom template that Talky Tina created into GIMP. Then I opened (as layers) the almost-empty-fridge-blues image I had from the earlier daily create assignment.

I put the fridge image on the bottom so that I could see the Jim layers above it—this made it easier to see where I needed to scale and move Jim’s layers.

I then duplicated the fridge image so that I had the same number of fridge layers as Groom layers.

 

 

2. Scaling and moving the Groom layers

There were 9 layers in the Groom gif, and in order to move them together and scale them together, I had to do two different things, as explained in an earlier post.

In order to scale all the Groom layers together (rather than one by one) I put them all into a “layer group” (click the link to see how to do this). Then I could scale them by right-clicking (or control-clicking) on the layer group folder and choosing “scale image.” I made Groom the right size to fit into the fridge shelf.

But I also needed to move all the layers together so they’d be in the right place. Unfortunately, due to some strange quirk of GIMP, you can’t move layers together in a layer group. Instead, you have to “link” them. Then you can move them all at the same time.

 

3. Creating a foreground in front of dancing Jim


I already had 9 fridge layers to act as background for the Groom layers, but now I needed to create a foreground for him too. To do that, I duplicated the fridge layer one more time, and then used the “lasso” or “free select” tool to select the shelf that would go in front of Jim.

I then created a layer mask on that image (go to Layer->Mask->Add layer mask) and clicked “selection” in the dialogue box. This made it so only the shelf was visible and the rest of the image was transparent. In GIMP you also need to “apply layer mask” to the image after adding it. You can do this by clicking on the layer with the mask, and going to Layer->Mask->Apply layer mask.

I needed 9 of these foregrounds as well as 9 of the original image as backgrounds. So I just duplicated the image that had the layer mask applied.



 

4. Putting Jim between the foreground and background, and merging

I first put a fridge layer under each Groom layer so that each Groom has a background. Then I put a fridge shelf layer above each Groom layer, so each Jim has a foreground.

Time to merge down. First, I merged a fridge shelf layer with a Groom layer. Select the top layer and right or control-click to get the dialogue box and choose “merge down” (see screenshot). Then, I merged the fridge shelf/Jim layer with the fridge background layer beneath it using the same process. And repeat for each threesome of shelf, Jim, fridge.



 

5. taking layers out of the layer group

You can’t animate the layers in GIMP if they’re in a layer group, so you have to take them out. You can do this anytime after scaling and moving them, but I kept them in for awhile just to make sure they were in the right place.

Move the layers out by just clicking and dragging each to the top or bottom of the layer group, keeping the same layer order. Then you can delete the layer group by clicking on it and control- or right-clicking and choosing “delete layer.”

 

6. Changing the animation speed

Jim was dancing too fast at first, so I exported as gif again and changed the dialogue box on export to read 200 millisecond delay between frames. That got him about right, I think!

Now, if only I could get my act together and add some music!