Repetition, Repetition, Repetition

As we move into Week 2 and get more information, it appears that a major theme in The Prisoner is repetition (a long with reflection and recursion I hope).

Before I start thinking about the audio assignments, I knocked up a few gifs from The Chimes of Big Ben:

oscilloscope 1

tape 01

lamp01

I repeat a well trod playflow.

  1. Open video in MPEGStreamclip
  2. Select in and out points
  3. Trim (command T on a mac)
  4. Export to Other Formats…
  5. Choose Image Sequence
  6. I usually click options and choose Jpeg and 12 frames /second
  7. Export
  8. Right Click on First File in export list
  9. Open in Fireworks
  10. Select all the other images in series & Drag to FW window
  11. Cmd-A Select All
  12. Open FW Frames window, Choose Distribute To Frames from the Window
  13. This creates a series of frames.
  14. Further editing and setting the Export Options in the Optimise Window
  15. Export to Gif

I made a Say It Like Peanut Butter – YouTube video showing the process a while back. Fireworks, as I’ve blogged about before (more repetition), is great for gifs as it separates layers and frames. That make it much easier for me to understand.

A Touch of Don

Apologies for the large size of this gif 1.5MB, but 52 frames!
Apologies for the large size of this gif 1.5MB, but 52 frames!

The offshoot of ds106 that is #giffight has given me a lot of fun. Every so often the giffight tumble posts an image with the invite for anyone to use it to create an animated gif from. You post it to tumblr tagged giffight or tweet and it is added to the gifight tumblr.

The latest iteration came out of MBS — Started another Tumblr – Don Draper is Zen I’m… celebrating the end of Mad Men by placing a meditation Don Draper over an animated background Michael provided a nice psd file with Don Drifting into the OM.

I made a few and then saw this tweet:

Which got me thinking

At first I was thinking of some sort of server size thing using Gifsicle,
ImageMagick or GD – Manual and the like. These both need resources that I don’t have access to (unless the raspberry pi) and skills I don’t have.

I then wondered about the various JavaScript Gif mashup I’ve made (squares for example) and if I could do that. I also recalled bookmarking a new (to me) JavaScript library for creating animated Gifs, gif.js. It seemed faster than the one I’d used before.

After much testing and playing around I’ve managed to get to a place where I’ve got a webpage that makes Don Zen Gifs that you can add an image as a background, or generate some random stuff as a background and get a gif. The interface is a bit rough at the moment. Don’s Gif Zen

751kB
751kB
277kB a wee bit better
277kB a wee bit better

The gif.js library does all of the hard work. I could not get some of the functions to work and had to kludge around them. I can see them working on the Canvas example page but I failed to get them to work here.
Basically what my pages does is let you upload an image, it displays that on a canvas element then loops through the Don frames adding them over the background. I should have been able to export that to the gif, but this failed so I create hidden png images and pass them to the gif encoder.

The alternative buttons just generate randomish backgrounds in the same way as I did for squares.

The great thing about the JavaScript approach is it needs no really amount of resources on the server. All the work is done on the end users browser. That means it is quite slow on a mobile.
I’ve tested on Chrome, Firefox and Safari on mac and it seems to all work fine there now (I had some early problems in Safari & firefox) Chrome & Safari seem faster than FF. It also works on mobile Safari on my iPhone. I quickly tested IE9, a fail and 10, works on Windows using virtualbox but would be interest to hear for others.

Finally I’ve used the same idea to take the ds106 Assignments: Dancing Jim all over the world from a 2 and a half star assignment to a 1 star one.

Dance Jim Dance

dancin-jim

Free the Groom

Now this is weird.

jim_groom_dicejim_groom_dice-dance

Given we can’t waste time I dug out a processing script I’d used before. I can’t recall where I got the original, or what changes I made, but it looks like I simplified it a lot and exported a series of frames to gifs. Stitched these together in FireWorks.

pechaGif

a random ds106 gif A random Gif

A while back I posted about the DS106 random gif api, a rather daft piece of fun: 106 drop in » Blog Archive » Gif Scraping and a DS106 Gif API. The api seems to be working well and I’ve used it on DS106 GiF TV which is still a work in progress.

Yesterday I had a thought to make a simpler example of using the API and that an idea might be to riff off Alan’s pechaflickr making a version that showed animated gifs.

pechaGif

This afternoon I took a first run at this. I’ve not copied any of Alan’s code just borrowed the idea. The pechaGif loads 20 random gifs and them displays a start button. Clicking that will full screen 20 gifs for 20 seconds each.

The page just uses javascript and I’ve kept everything in one file in case anyone wants to use it to see how the gif API works.

I did not expect anyone to make use of this, but Mariana suggested:

 

So I guess I may add that to the assignment bank, might give it a go myself first.