Category: animatedgif

8 Gifs in search of a title

8gifs-5characters_2

So I am trying to get an idea of the twilight zone before the next round of DS106 starts. It looks like you can watch any of the first 3 seasons on The Twilight Zone Video CBS.com if you live in the USA. I may have to investigate some sort of fake us ip device to see these.

In the meantime I’ve been wandering round youtube. Watching the odd fragment and episode. I’ve watch a couple but Five Characters in Search of an Exit was the first to make me pay attention. According to Wikipedia the title at least is based on Six Characters in Search of an Author and No Exit it has been a while since I saw 6 Characters or read No Exit, but the links, especially to No Exit are clear.

I am beginning to get into the zone, but I found the exposition from Rod Serling a bit much, great voice but I think this episode would be better without the explanation.

On second watching I grabbed gifs as I went through. There is plenty of banging, ringing and the idea of repetition in the tale, I hope some of this comes over in the combi gif above.

The gifs are all short, 7 frames. I combined them by importing them into fireworks.

I am pretty sure there are a few good pun titles for this gif just beyond my grasp… can’t get out of the zone, sort of thing.

After knitting together the gif above I though that two of the frames would work, here is the major begging Rod not to talk so much.

please_rod

I am wondering about redoing this one with Jim Groom in the Rod Serling position.

I guess this is a Multi-Frame GIF Story as well as a From the Twilight Zone, and Beyond … Assignment.

I though the gif at the top looked better on a black background, so wrapped it in a paragraph:
<p style="background:#000;padding:45px">

Once you are on the DS106 Train

A new chapter of ds106 is starting.

ds106zone is an idea Dr. Garcia had about framing the Summer session around a Twilight Zone inspired thematic

from: bavatuesdays | a “b” blog

I’ve not idea about the twilight zone, well off my culture radar, so I am speed reading wikipedia and it looks like I’ll need to take a youtube trip. But DS106 is irresistible! A quick check to see if my blog is still in the mix:

So:
test

A little fast, but I am working quickly. Giffing through the night.

window

It will be a scream on the DS106 Train.

trainscream

A train ride you never wake up from!

wake

I am not counting, but ds106 Assignments: From the Twilight Zone, and Beyond … and ds106 Assignments: All Aboard The GIF Train.

Ripping up a Shredder Head

So a new rather interesting DS106 assignments, For The Remix!

A series of photographs taken by Jonathan Worth of author Cory Doctorow are now available for you to remix, regenerate, and to make new art, especially in light of the themes and topics of his books.

The deal seems to be you should think deeply, share your idea and processes. More details: FTR! For The Remix! | remixing cory doctorow and How Do You Think Yoda Got So Wise? – CogDogBlog.

So I had a look a the pictures, watch Jonathan’s introductory video and though I might stretch to a quick gif.

Looking at the thumbnails, Mr. Doctorow’s office is impressive, with a nice range of cables and kit. I was hoping to play with the idea of printing some of the head shots, riffing of the idea of Jonathan sharing digital copies for free while selling prints. This idea he borrowed from Cory’s famous publishing method.

On downloading the high rez image I found what I though might be a useful printer was in fact a shredder, so I got rid of that idea:

shreader

I like the idea of taking a 45mb, 4000 dpi, 8000 odd pixel image and ripping a 500 pixel, 128 colour, 72 dpi gif out of it.

Here is how

Unlinke most ds106ers I use Fireworks for giffing, mostly because I am familiar with it as I got a really great deal on Fireworks 8 but being a teacher years ago. Fireworks has some nice features for giffing. An image can have layers and frames, layers can persist across frames.

Here is what I did:

  1. The downloaded image opened automatically in preview.
  2. I cropped out the shredder and switched to Fireworks.
  3. Created a new document, Fireworks assumes you want to use the clipboard and set the image dimension to that, about 3000 pixels.
  4. Paste in the clip.
  5. Switch back to preview and copy one of the cory heads from the thumbnail sheet.
  6. Back to fireworks.
  7. The original layer is set to be shared across frames, I make a new layer, not shared. (This from the popup menus in the layer palette) and paste in the head.
  8. Draw a white rect for a frame and group it with the head. (I think I saw a polaroid ref somewhere?)
  9. I then used the polygon tool to cut out the lower section of the shredder.
  10. Make a new layer, set to share across frames, paste in the bottom half of the shredder.
  11. Move this new layer to the top, so that the head, animation layer is sandwiched between the two other layers.
  12. Move the animation layer so it is about to go into the shredder.
  13. Using the frames palette, I duplicate the first frame. Move the head into the shredder a bit.
  14. Repeat.
  15. Use the frames palette to adjust the delay on each frame.
  16. Resize the whole image to 500 pixels across.
  17. Export to animated gif.

method

Some folk still want to print

After all that I still wanted to print, so a quick search of flicker finds Printer Tiger

THis was a little trickier as I needed to skew the head a bit, I think photoshop has better tools for this.

print

Credits

Images of Cory Doctorow, Jonathan Worth, Creative Commons — Attribution 3.0 Unported — CC BY 3.0

Printer Tiger, Marco Varisco, Creative Commons — Attribution-ShareAlike 2.0 Generic — CC BY-SA 2.0

Dancing Jim Over the World

Last night a old gif of mine got tweeted:

and I replied:

As I love recycling, I dug out the old gif, which I also use for my Jim Groom Internet glasses and giffed it up a bit:

jim_groom_office
jim_groom_white-house
jim_groom_peking

I think there are already assignments that this sort of fits into. ds106 Assignments: Noiseprofessor’s Jim Groom Art perhaps, but perhaps giffing Jim around the world could be one in its own right?
In case you want to join in here is a Dancing Jim Template An animated 9 frame gif with transparent background. The back ground is pretty big to make it easy to edit. Here is how I do it with Fireworks.

  1. Open the gif
  2. Make a new background layer that is Shared across frames
  3. Add an image to this background layer
  4. Move background around to get Jim in the right place
  5. Optionally cut out part of background and past into new foreground layer, so that the figure is partially behind, EG the shoulder of the office guy above.

The original gif is getting a wee bit tatty now, having been through the gif wringer and at some point it may be worth revisiting the original film and extracting another.

All backgrounds from Morguefile.com free stock photos, no attribution needed.

Update: I made this an assignment: ds106 Assignments: Dancing Jim all over the world

Not an animated gif

Using this png and CSS sprites.
jgsprites

Copying CSS sprite sheet animation – jsFiddle
Using my much reused favourite (of the ones I’ve made) animated gif. I converted it to a long strip.

So the CSS without the vendor prefixes


.jg {
	margin:auto;
    width: 203px;
    height: 203px;
    background-image: url("jgsprites.png");
	animation: play 1.5s steps(9) infinite;

}

@-webkit-keyframes play {
from { background-position: 0px; }
to { background-position: -1827px; }
}

I had to strip all of the returns out of the CSS and paste it into the WordPress blog editor to get it to work.