Saying like peanut butter this morning. I worked on the part of…



Saying like peanut butter this morning. I worked on the part of the assignment that asks to ‘make sure the movement is minimal but essential’. i am getting the hang of deleting non-essential frames. Definitely better to be animated than un-animated! Use both photoshop and Gimp. Gimp to get the rough animation and Photoshop to get the detail and the frame speed right. Film clip from Buñuel again.

Makin’ it big in Chicago

The final scene in the musical “Chicago”; after killing people close to them, the main characters now have their own, successful show. They come out with guns and shoot their names in light, a moment where it has all come together for them.

Remembering and misremembering The Story This animated gif is…



Remembering and misremembering

The Story

This animated gif is for the second week of the Headless ds106 for Fall 2013, in which we were asked to do a gif of a scene from one of our favourite (or least favourite) movies.

I immediately thought of Memento, a film I really, really liked when it came out back in 2000. I had seen it a couple of times over the years, but decided to watch it again for this assignment. I found that I had forgotten much of the film, which is not unusual for me—I am not sure that I have a memory “problem” (and certainly nothing on the scale of Leonard Shelby, in the film), but I do have an uncanny knack of forgetting things quickly and easily and regularly. Not just the usual things, like where I put my keys, or what I had for breakfast (though, since I usually have the same thing every day, that’s pretty easy), but things like novels I’ve read, films I’ve watched, how stressed I was last time I taught courses in a certain way—a convenient one for when I’m planning new courses and have all these grand ideas about what to do and I forget how much time all that is going to take.

I do often find that I can re-watch a movie, or re-read a book after a couple of years and it’s almost like new again. Or at least, it has a tinge of the familiar, and a few things will really stand out as recognized, but for the most part it’s like having a new experience. Which is both troubling (what’s wrong with my brain?) and enjoyable (hey, I get to enjoy this story all over again!).

The main character in Memento, Leonard Shelby, is played by Australian Guy Pearce, whom I watched last year in two “tele-movies” filmed in my neighbourhood in Melbourne, where I was living at the time (here’s the trailer for one of them). He’s also pretty famous for his role in The Adventures of Priscilla, Queen of the Desert (trailer). When I first saw Memento, I didn’t make the connection to the Priscilla film, and didn’t realize Guy Pearce was Australian. Watching Memento this time around, I now have a sense of him as an Australian actor, so it was interesting listening to him speak with an American accent.

The main premise of Memento is that Leonard Shelby has a memory issue: after an attack that caused some neurological damage, he is unable to make new memories. Or rather, he can make some, but they disappear after a short time (it’s not clear in the film how long he can retain his memories, but something on the order of 15-20 minutes maximum, I think). After they disappear, he finds himself somewhere and doesn’t know where he is, why he’s there, or what he’s doing. He does, however, remember everything that happened before the attack.

To compensate for this problem, he often tattoos important things on his body, things he decides he must tell himself. He also tells himself things by writing notes to himself, but the really important ones are tattooed.

One of his memories from before the attack is of a man named Sammy Jenkins, who suffered the same problem that Leonard now does. Leonard was a claims investigator for an insurance company, and he denied Sammy’s wife’s insurance claim because tests indicated that physiologically, Sammy should be able to make new memories; the issue seemed to be psychological, and Sammy didn’t have insurance coverage for psychological issues (oh the joys of the U.S. medical and insurance system).

One of the great things about the film is that it is presented in nearly as disorienting a way as Leonard’s life must be—there are fairly short scenes that jump around in time, leaving the viewer disoriented and wondering what is going on. It starts at the end of the story, and while parts of it move backwards from there, other parts move forwards. It’s very difficult to get a handle on what is happening at any given time, until towards the end, when essentially you’re back at the beginning.

There is a lot more going on in the film, but that’s enough to explain this animated gif. I took parts of two different scenes: one where Leonard sees the tattoo on his hand telling him to remember Sammy Jenkins, and one that is a vignette of Sammy Jenkins in a psychological institution of some sort, watching someone go by.

Now, why does Leonard need to remember Sammy Jenkins? The idea given directly in the film is that Sammy couldn’t do well with his condition because he didn’t have a good system for writing notes and organizing them so that he could have a semblance of continuity in his life. But as the film progresses, and especially in the scene where Sammy is sitting in the institution watching someone go by, one begins to wonder if Leonard’s memory of Sammy is correct. Specifically, is Leonard mixing memories of his own life with those of Sammy? Sammy ended up inadvertently doing something very horrible; was it actually Leonard that did this?

“Remember Sammy Jenkins” is tattooed on Leonard’s hand, in a place where he’ll see it often (as opposed to under his shirt or pants, for example). It’s clearly important. But several times throughout the film Leonard is shown rubbing at this tattoo, as if trying to get it off. Trying to not remember. And perhaps he is trying to not remember what he himself has done by remembering it as Sammy Jenkins doing it instead.

At one point in the film, Leonard decides to consciously lie to himself, to write himself a note that he knows at the time is wrong, but he wants his later self to believe it and to act on the basis of it as if it’s true. Which, of course, throws all of Leonard’s notes to himself into question—how much of what he now believes as true may be his own fabrication? Not to mention a fabrication by others who are using him for their own purposes.

Beyond these interesting aspects of the film, it also raises larger issues about memory and our understanding of our lives and the world around us. Sure, Leonard’s memory is faulty, but so is all memory to some degree. And though he knows at one point he is lying to himself to make himself think differently in the future, later he won’t realize that’s the case.  And isn’t such a thing perfectly possible for those of us with “normal” memory, if even less consciously? How much do we alter our own memories without even realizing it?

I have fairly frequently been told I seem to selectively forget certain things, usually negative ones, and imagine the past was better than it really was. But I actually rather prefer it that way.

The process

I found several clips of the film on YouTube, and downloaded them using Clip Converter. I selected the parts of the two separate clips I wanted using MPEG Streamclip, and then imported them into GIMP (see this tutorial for how to make an animated gif with MPEG Streamclip and GIMP).

I had way too many layers/frames (they are both the same in GIMP) at this point…my animated gif needed to be 1MB or less to animate in Tumblr, and I knew I’d be way over that. So I just deleted every other layer, which is a nice way to save file size and still keep the animation pretty smooth. I also took out a few more layers at the beginning of each clip—anything that didn’t seem essential.

One thing I always run into with GIMP is that the animation works backwards—it starts from the bottom of the layer stack and goes up. So you have to rearrange the layers if you want it to go in the right order (sometimes this doesn’t matter, depending on the gif, but for this one it does). When I first started I moved layers one by one, but recently discovered that there’s an easier way to do it: go to “Layer” on the top menu, then “Stack,” then “Reverse layer order.” Voilà! Easy.

The file was still too big when I exported as a gif, so I had to make it even smaller by making the “canvas” even smaller (the dimensions of the whole gif). I just kept using the square selection tool and selecting smaller pieces, then going to “Image,” then “crop to selection,” then exporting as gif to see if it would be small enough. Even though the image was already b/w, I switched it to greyscale instead of RGB (“Image,” then “mode,” then “greyscale”). Not sure that made much of a difference, really.

Finally, while I wanted the tattoo clip to go a bit more slowly than normal, I wanted the Sammy in the institution scene to go quickly. The bit at the end of that clip goes by very, very quickly in the film—so much so that I had to watch it a few times to be sure what was going on. Can’t do that in a theatre! I didn’t want to slow it down too much, though it is slower than in the original film.

I managed these differences in speed two ways:


1. For the institution clip, I set the rate of each layer specifically: at the end of the name of each layer I put “(125ms)”, which tells GIMP to have that layer run for 125 milliseconds. I did that for all the layers in that clip.

2. For the rest, I just set a layer rate for the whole gif when exporting it; there’s an option to set the rate for all unspecified layers, which I set at 200 I think (maybe a bit more).

I had a lot of fun with this, and have been waiting several days to find the time to blog it. Glad I finally did!

A beautiful face

Part of week 2 in the headless ds106 is to Say It Like the Peanut Butter.

Make an animated gif from your favorite/least favorite movie capturing the essence of a key scene. Make sure the movement is minimal but essential.

I’ve done a few of these and made a wee tutorial last week for doing it with Fireworks. At first I had another dig through blade runner and La Belle et la Bête, but wasn’t delighted with the results.
Then last night I went to the movies to see The Great Beauty, which was a beautiful movie in all sorts of ways. I was a fan of Toni Servillo from The Consequences of Love and Il Divo and this increased my admiration. So here is his beautiful face, ripped from the trailer on youtube.
I duplicated the very short segment and reversed it to hide the seems. The gif started out a over 2mb and I crushed it as much as I could, eventually resizing down to 360 pixels. I am going to scale it up in the html here.

beautifulface-360

Scrooge Discovers Peanut Butter

My first step in this assignment was to google the title “Say it like the Peanut Butter”. What allusion to popular culture had I failed to grasp and what key piece of information was I missing? Now I know how to pronounce the word “gif”.

The assignment was to make an animated gif from your favourite/least favourite movie capturing the essence of a key scene and to ensure the movement is minimal but essential. I may have failed on the “movement is minimal” part.

Gif of Scrooge realizing that he was dreamingI used Gifsoup which is a web-based tool to create a gif of Alastair Sim in the Christmas Carol realizing that he has had a bad dream and that he is not dead.

The following steps can be used to create your own gif using the Gifsoup website:

  1. Go to gifsoup.com and set up a free account
  2. Enter the url of the YouTube video you would like to use
  3. Enter the start and end times of the segment you wish to use
  4. Click the “Create animated Gif” button
  5. Enter metadata – title, tags and category for your gif

Once your gif has been created you can:

  • download it in two different sizes
  • link to it by url (or a shortened url)
  • cut and paste html in your blog or web page

The free Gifsoup account is adequate for an assignment such as this; however, gifs have a maximum length of 10 seconds and there is a GifSoup watermark at the bottom of the gif.

Guess What I Did Today? I Animated Cow Poop!

Do you get to do that in your fancy MOOC? What more do you need to know to be part of ds106? And the beauty is, you can start this creative experience at any time. You are never behind, or missing out on some quiz to get some chips.

I digress.

I thought this photo along was pretty funny- on my Tuesday bike ride, I was looking for some good cowpies (do I really need to explain what they are) adjacent to the forest road, and I noticed one was draped kind of funny over a rock. It was not until later when I was looking at my photo that I was amazed that there was a face in it, almost like The Scream!

cc licensed ( BY SA ) flickr photo by Alan Levine: http://flickr.com/photos/cogdog/9667370443/

cc licensed ( BY SA ) flickr photo by Alan Levine: http://flickr.com/photos/cogdog/9667370443/

But after sharing it via twitter, I got a request from Bill Fitzgerald

How could I not respond? I was asked to animate some cow poop!

This was just thrown together (ewwwww)– my idea was to make the face wink.

winking-cowpie

It’s just three frames. I made it in PhotoShip CS5.5, first importing the photo as a base image. I made a copy of the layer, made a lasso selection around the eye, then inverted the selection, and deleted. The plan is to isolate the part to animate as a separate layer.

Create a copy layer and delete everything but what will animate.

Create a copy layer and delete everything but what will animate.

This is going to move around so I need to go back to my base layer, and use the clone brush to paint in a surface behind the eye. It does not have to be perfect because it will be mostly covered., but since the eye will change shape we want a neutral backdrop.

Clone brush in the area behind the eye.

Clone brush in the area behind the eye.

Now I make a copy of the eye layer, and use the EditPuppet Warp tool.

Using the Photoshop Puppet Warp

Using the Photoshop Puppet Warp

I only started dabbling with this last year, but offers a way to distort a selection in a way that is more like pushing clay around, and suitable for changing the shape of this eye over a few frames.

Photoshop puts a mesh on the selection, and I click a few anchor points:

The mesh and selecred edit points in the Puppet Warp tool

The mesh and selecred edit points in the Puppet Warp tool

I cannot say for sure the best strategy. You will need more points near where you want to make movement. On my first one I should have put more at the bottom like this to keep it anchored. But if you click and drag on one of the yellow points, it starts mashing the object around. My idea was to squeeze the top of the eye down as if it was winking:

The puppet warp was used to squeeze the eye down form the original

The puppet warp was used to squeeze the eye down form the original

I then made a copy of this distorted frame, and repeat to make a third one, eve more squeezed down. I can check my effect by toggling layers on and off- I decided to use the brush eraser tool to remove a bit of fringe.

Now that I have a background layer as a base, and 3 versions of the eye as separate layers, I am ready to animate. In CS5.5 there is a menu in the upper right of the animation window, and I use the Convert Layers to Frames item.

What I get is each layer in its own frame- not quite what I need. I can delete the first frame with just the base layer, and in the others, I just toggle on the visibility of that layer so it stays as a background.

Layers and animation in PhotoShop

Layers and animation in PhotoShop

I select all the frames in the animation window, and change the frame rate to 0.5 seconds. Then save for Web & Devices as a GIF, and I am done.

As a final GIF it is only 278k. When you have just a few things in a layer, it is a lot less disk space to save then if each frame is a full image. By isolating movement, you get not only a more subtle animated GIF, it weighs a lot less.

If you want to look at the source file, download the PSD (2 MB).

How much more fun can you have?

I’m tagging this for a Say It Like Peanut Butter assignment (though technically it is not a movie scene) (what am I going to get into TROUBLE?)

It’s Showtime!

BeetleJuiceGIF_2

“It’s Showtime!”

One of my favorite movies of all time and characters is Michael Keaton as Beetlejuice.  The ghostest with the mostest.  This 1988 comedy horror film directed by Tim Burton is a scream and I’ve always thought quite romantic too.  [Wikipedia Post]

And look at that… the official movie poster? Yes.  There are indeed headless ghosts running around from time to time.  But none of those scenes seemed as appropriate to sum up the movie and capture the essence of a key scene as when Beetlejuice, a self-proclaimed “bio-exorcist”, is being released from his exile in a small model town in the young couples attic. Indeed… It’s Showtime!

Talk about perfect source material for completing the DS106 Headless 13 week two assignment, Visual Assignment 2 “Say It Like The Peanut Butter”  Make an animated gif from your favorite/least favorite movie capturing the essence of a key scene. 

This is not my first movie GIF, [See Ewww... Brain] so I’m pretty familiar with my GIF making tools now.  I’m also getting better and better at choosing the right kind of source material to work with to make things go smoother and faster in the production process.

For the video clip I knew this was a key scene and someone on YouTube would have posted this small segment and I wouldn’t have to search through my own DVD to find it.  Yep… there it was, and even better… It was an HD version to boot.  I downloaded the clip to my Mac with the DownloadHelper extension in Firefox.  I then imported it to Adobe Premiere Elements 11, located the 3 second clip and then exported it as a JPEG sequence at 10 Frames per second.

Publish+Share => Computer => Image (use for exporting still image) => open the advanced menu and choose “export as sequence” under the video heading, then save.

I opened the 36 images in Adobe Photoshop Elements 11 and placed them all into one file as separate layers.  The original images were quite large, so I reduced the image size to 500px which is the upper limit to post to Tumblr.

File => Save For Web => Click on Animate => Animation Frame Delay set at 0.1 => Save

That’s it.  Simple once you know how to do it.  Not so the first few times as I was learning how. [See Hula Hotseat]  For those of you just starting out…. hang in there.  It gets easier the more you practice.  [See Batman & Robin Behind The Scenes for a good photoshop elements GIF tutorial]

And a whole lot more fun is coming your way!  Soon YOU’LL be saying, “It’s Showtime!”

Video Source: MOVIECLIPS.com

I watched this film a few days and it made a real impact on me….



I watched this film a few days and it made a real impact on me. From the trailer:

Paris, 2020.
A beautiful couple, a city over-saturated by holograms and digital stream.
A polaroid camera.
Tomorrow will never be the same. 

An electromagnetic storm wipes out all our data, worldwide. The only thing he has left is an old polaroid she took before he left him for spending too much time on social media. 

I put this together with a quote from Alone Together by Sherry Turkle:
We are not in a position to let the virtual take us away from our stewardship of nature, the nature that doesn’t go away with a power outage.
The moment captured in this image has been running in my head for days so I thought I would do some giffing. I did not want it to loop forever, but to stop and give the sense of it all breaking up when it ended. However, it looks like this will not work with Tumblr so I slowed it down a little and looped it forever.
Followed Michael’s tutorial again, and experimented with a few more settings in GIMP. I did want the glass smashing to make more of an impact. I need to play with it more.
However, I want to end with Alan Levine’s comment on watching the movie:
Hard to empathize with a digital dude who did not make local backups of media ;-)

Update: I am submitting this gif as an assignment for the assignment ‘saying it like peanut butter’. I did it a few days ago, it was one of the first gifs I made properly (i.e not with an automated tool) and it was inspired by a film that moved me. 

Better Than Revenge

For the fourth piece of the story, I chose to do the Say it Like Peanut Butter {***} visual assignment. For this assignment, you had to take a clip from a movie or show and turn it into an animated GIF. This assignment is going to show Sabrina’s revenge on Libby. In the fourth assignment, you saw that Sabrina planned and plotted her revenge but now, you can actually see what happened.

I used MPEG Streamclip to trim the clip and get exactly the section that I wanted to use and GIMP for actually creating the GIF. I remember doing these GIFs wayy back in Boot Camp but I still had to refer back to the handbook page on creating GIFs. I forgot exactly how big and how to export the file as a GIF. I kept on clicking “save as” and you need to click “export” to correctly save the file.

Even though this is the end of the semester, I still had to watch this video because I needed help with embedding my GIF into WordPress. That tutorial video is super helpful and simple.

Here is my final GIF:

Libby is a goat 01

 

Song blog post title: Better Than Revenge – Taylor Swift

Please Bring Honour to Us All (Say It Like the Peanut Butter Assignment)

The next component of my final project I worked on was visual. I decided to go back and revisit the “Say It Like the Peanut Butter” assignment we had to do during week 3 of ds106. I forgot how to make a GIF, so I had to go back and look at Jim Groom’s tutorial again. Thank goodness his is really detailed!

First, I got this video off of YouTube using PwnYouTube:

And then I opened it with MPEG Streamclip, and trimmed it so I just had the scene I wanted. Next, I saved the scene as photos, and opened them as several layers on GIMP. After doing a couple of tweaking here and there, I ended up with my GIF! Here it is:

Mulan

This assignment wasn’t really as hard as I remembered… Maybe it’s because I’m getting better at this ds106 stuff? (: Anyways, again, let me know what you think in the comments below!