A gif was posted on the DS106 community just for fun. Some of us got interested and made suggestions about how to turn it into a cinemagraph. I have been wanting to learn how to do this for a while. Here is the result of many days and many tools:


This post is a stab at describing what I did and what I learnt, as a way to sum up and reflect on visual week 5 on DS106.

The original gif was made from a clip of a film by Luis Buñuel, I am not sure what was used to produce it but it was not optimised for animated gif on an editor and it would not load on Tumblr as an animated gif. I downloaded and opened it in Gimp. The gif was 19 frames, running at 100ms. The size was 506 x 285 and 12.1MB. 

What interested me was the idea of turning it into something like this. It meant I had to learn how to keep everything still in the image except the area I wanted animated. I did not have a clue how to do this. I knew it had something to do with masking, and that Gimp should do it. I tried this tutorial, but as Christina Hendricks says in the blog post on this, the tutorial is helpful to understand masks but not so helpful in teaching the specifics. I contacted Andrew Forgrave on Twitter and he directed me to his instructions. They were helpful but the most helpful thing was that he directed me to a screencast by Jim Groom that explained more detail I was missing. Christina had also found both of these guides and was able to produce a great animated gif from both of these in Gimp. It should have worked for what I wanted to do too. I spent hours in Gimp, creating masks learning about how to work with them. I simply could not get this to work. It turns out, a key thing in Gimp is 

I ended my day frustrated and deleted everything I had done. Mistake. I had reduced layers to 10, aligned frames, and done a lot of preparatory work that I could have used later. 

I started again the next day with this tutorial:

This was very helpful and showed exactly what I wanted to do. It did however, assume that I knew about guides, aligning multiple frames, and then it explains the process really fast so I had to listen very carefully. But at the end of this attempt – several hours, several tutorials, several trials – I had a kind of cinemagraph. It was not quite right but I was pleased that I had learnt how to use Gimp to make this type of animated Gif as it was something I wanted to learn how to do well. My taste still impeccable but not yet matched by my ability to execute, as Ira Glass reminded us the other week. Other DS106 participants came to my rescue making suggestions about how to improve on my efforts. Even if my attempt was described as ‘slightly creepy’ I could see I was on the right track.

I have been thinking for a while now that Gimp is not the most user friendly bit of software. Christina put it well:

It has many non-intuitive elements and I am an old hand at learning difficult software. Quirky might be a kind of way to describe it. Flexible, might be another as it allows the user to set many parameters and does not assume what user may want to do. You have to set everything. Take the example above. The reason you apply the mask after you have added it, is that you might want to save the mask for future use. You want the mask clean to use on a new image. Makes perfect sense once you know how and why. Personally, I think it was designed by aliens and I have not managed to warm to it in spite of many tutorials and tries. It was time to test Photoshop. 

One hour in Photoshop in an effortless and enjoyable fashion I was able to implement all the suggestions that had been made and posted the final version above on google plus. I loaded the image – I was able to crop it easily selecting all the layers. Select blur tool, zoom it, use it at 50% blurring to blend the eyes in all the layer. Watch the animation without having to squint or select more commands than any sane person needs to select, over and over again. Easy. Optimise for web in a couple of strokes and off to lunch with a job well done. 

I have learnt a number of things with this cinemagraph attempt. Software and user need to gel if we are to create with it. Getting frustrated with too many keystrokes or a non-intuitive design is not conducive to creativity. Choosing the right software can make the difference between useless and thrilling. I am thrilled that I have made my first cinemagraph, I felt useless with my Gimp attempts. I thought I would never be able to engage with this fascinating medium, but after my Photoshop experience I know that if I suck, it will not be about the software but about my talent or lack of it. This stuff takes time to learn, and we need to ask for help when we are stuck. 

I recognise that there is a cost issue here. I also know that at the time of writing (September 2013) Adobe are offering a 30 day free trial which if timed properly might well enable DS106 participants to learn the tool and use for most of the course for free. There is also an educational discount. I don’t want to sound like a paid advert, but the experience was day and night for me at least. Another DS106 participant made this comment:

Nice job! I had a similar elation when I moved from Photoshop Elements 11 to Photoshop CS5. Not having to merge layers, easily adjusting animation frame rates for individual layers, and previewing immediately allowed me to be so much more creative as well as save time. Let the fun begin!

Let the fun begin, indeed. There is no holding me back now – I shall animate the world, as I agree with  Andrew Forgrave when he says:

There’s nothing like being animated! It sure beats being unanimated.