My 'real' blog doesn't play nicely with DS106 so I've imported the ds106 posts to this one for ds106 fun.

all in the game

Posted: September 13th, 2014 | Author: | Filed under: Uncategorized | Tags: , , | No Comments »

Wire Characters Season 1

My last couple of posts have been about using and setting up

Videogrep is a python script that searches through dialog in videos and then cuts together a new video based on what it finds. Basically, it’s a command-line “supercut” generator.

I’ve been thinking about how to use it, especially since Jim Groom gave it a rousing reception( Wiring Supercuts & The Game Supercut ).

I’ve always liked the suspect board on the wire, where the detectives pin up pictures of suspects in a mindmap fashion, and wondered if I could make a board with Supercut videos of the characters. Turns out I can: Wire Characters Season 1.

A man must have a code

The Wire Season 1 Episode 07   one Arrest

First thing I had to do was make the supercuts, I just used the method described in the previous post, with one wrinkle. Some of the characters are refered to by more than one name, some times Kima is Greggs, I wanted to catch all of the references. It turns out that the default search for videogrep is a regular expression. Now I don’t know much (anything) about regEx, but a quick google game me the pipe character as OR, so:

python ../ -i /Users/john/Movies/The\ Wire/Season\ 1 -s 'Kima|Greggs' -o Kima.mp4

Gets clips with either Kima or Greggs in the subtitles.

I then convert the mp4 files with miro video converter, using iphone as the setting, this lets me hear the clips which lose sound on my system. I open the output movies with QuickTime Pro find a still and hit copy. Switch to Fireworks and paste into a new document, save as a jpge with the same name as the video apart from the file extension.

I’ve now got a folder full of movies and images and just need a html file to display them.

I wanted to do a few things with the display of the videos, I wanted them to be is some sort of disarray as if pinned on, not all lined up. I also was making this in between all of the supercutting. This lead me to put the videos on the page with Javascript rather than hard coding all the tags. If you are really interested you can view the code on the page, I’ll just blog a few concepts here. I did hardcode an array of the names, without the file extensions and a matching one with the character names. It was them easy to loop through these arrays creating video elements and populating them with the video source and the jpg images as posters.

The CSS gives the div wrapping the video a white background and a drop shadow, some javascript rotates the divs (JavaScript Rotate | KaisarCode) and randomised the margins between them and the white border width.

I also used the javascript to scale down the video to fit more across the page and css to set the page width to 1600 pixels (side scroll I am afraid).

when it’s not your turn

I also missed a few things out.

  • The files are big, converting them with miro made them bigger, I guess I could use ffmpeg to do a better job of that, I could also scale them down to the size they are displayed.
  • The videos do not play in Firefox on a mac, firefox does not support the video format in the video tag. I had a very quick try using mediaelement.js to add flash for firefox but it looked like it would be too much work to display properly. I could also convert all the files to ogg for firefox, I might try that in combonation with scaleing them down a bit at a later date.

Update: I’ve run all the videos first throught te commandline ffmpg to downsize them to 360×240 and then ffmpeg2theora to create ogg versions.

Dope on the damn table

So while some of this has been for self education around javascript and css there are a few ds106 style things that spring to mind from the exercise.

The supercuts get the parts of the video where a character is mentions, sometimes this is never when they are on screen. I had to use other parts of the movie to get posters for some characters. The supercuts let you focus on the character from other characters points of view and the POV of the writers and directors. Some characters I love and feel are important are not refered to much by name, the video file sizes gives a view of this, Ellis Carver’s video is tiny (I love how his character in season 1 hints of his growth during the wire as a whole).

Although I’ve now watched most of season 1 (third time round) I’ve struggled to watch with a critical eye, or even an eye to a gif, the programme is too absorbing and emotionally involving. It has reinforced the series as my favourite tv. I am especially noticing the parts when charcters show complexity beyond normal tv. Kima, presented very positivly, leads the charge to kick and beat a youth that hits the rather usless police Pogue (or Mahone). The emotion showed by the character at the end of episode 10 and the beginning of 11 is viceral, rewatching brings back the shock from the first viewing in a suprisingly powerful way.

Watching the supercuts allows you to step back a bit, pulls information about a character together in a suprising way letting you see the character and how their story is told in new light.

and all the pieces matter

Posted: September 9th, 2014 | Author: | Filed under: mashup, Tutorial | Tags: , , | 1 Comment »

Gif using gifboard

This is a quick intro to installing a tool for making supercut movies. Written in haste, consider it a rough draft.

Videogrep is a python program run from the command line. This is quite different from using applications with a GUI. I am hoping to write up a few different tools I use for playing DS106 and will try and come back and expand on this.

More about Videogrep: Automatic Supercuts with Python – Sam Lavigne.

Code: antiboredom/videogrep · GitHub.


  • I am no expert in using the command line. I’ve failed on quite a few attempts at installing.
  • As with a lot of software you can make mistakes, bad things can happen. You will be giving the software author control over your computer.
  • I am using Mac OS X
  • There is not a lot of detail here, I’ll come back and improve if it seems useful.
  • It is probably sensible to read all of the linked pages here rather than just go on trust.


Videogrep depends on a few python modules and programs. These are installed with pip (A tool for installing and managing Python packages) which you may need to install.

You also need to install FFMPEG (FFmpeg is a free software project that produces libraries and programs for handling multimedia data. ). One way to install FFmpg is with homebrew, which you need to install first!

Homebrew and ffmpeg

Homebrew, is a package manager it is installed and used via the commandline so you will need to open the terminal app.

You run stuff in the terminal by typing (or pasting) after the prompt my prompt is johnj:~ john$ if I am in my home directory which is called johnj

On the Homebrew site you can copy a line of text which if pasted into the terminal will install homebrew when you press return. I’d go to the site and copy from there rather than from here.

ruby -e "$(curl -fsSL"

The script explains what it will do and then pauses before it does it.

Once the script has finished it will recommend running:

brew doctor

To check all is ok, so type that and hit return, wait a while and the prompt returns. you can now install FFmpeg. The videogrep notes suggest you do with this:

brew install ffmpeg --with-libvpx --with-libvorbis

So try that, type it in at the prompt in the terminal, lots of text should stream by, by the time it stops FFmpeg should be installed. You can check by typing

ffmpeg -h

Which will display the help.


Next you want to install pip, which lets you install other stuff. Again at the prompt type:

easy_install pip

Some text will go by and the prompt should come back.



Down load the zip file from antiboredom/videogrep · GitHub unzip and put it somewhere handy, your desktop folder for example.

The folder is called ‘videogrep-master’ I’ve just left it as that.

Inside the folder is a txt file requirements.txt this lists the python modules that you need to install, you don’t need to open it. Back in the terminal, cd into the videogrep folder:

cd path/to/folder

to do that type cd at the prompt and drag the folder into the terminal window, I see:

johnj john$ cd /Users/john/Desktop/videogrep-master

hit return and type:

pip install -r requirements.txt

and return again a ton of text will scroll past as past.

At the end, unless you have errors you are ready to go.

First cut

You need a video file and an srt file to match, there names must be the same except for the extension, eg:

  • The Wire Season 1 Episode 06 – The Wire.avi
  • The Wire Season 1 Episode 06 – The

If you followed the above steps your prompt should show you are in the videogrep-master folder:

johnj:videogrep-master john$


python --input path/to/srt file  --search pieces --output pieces.mp4

more text scrolls past the terminal. A video pieces.mp4 appears in the folder, it is the supercut video.


Problems along the way

I had a couple, first in installing the requirments.txt I kept getting errors about pattern. To solve this I went to pattern, downloaded pattern and installed it. I then removed that line from requirments.txt and saved it before running pip install -r requirements.txt again.

The second problem I had was the movies created had no sound. I didn’t fix that, I just used miro video converter to convert the files to apple or iphone ones which did the trick. I am guessing this could have been fixed with ffmpeg too as miro video converter is, as far as I know, a gui for ffmpeg.

a little slow, a little late

Posted: September 7th, 2014 | Author: | Filed under: Uncategorized | Tags: , , , , | 1 Comment »

Be a Little Slow

You cannot lose if you do not play.

My first post here since April! I missed the whole of the burgeon experience and have done only a handful of daily creates. I am not saying sorry, I have made a few artefacts and experimented with some stuff that is pretty #ds106. There is no really useful instructions in this post, but links for the willing.

I’ve been meaning to post about this for a while, I did a few tests in June and tweeted a bit about it. It is pretty cool:

Videogrep is a python script that searches through dialog in videos and then cuts together a new video based on what it finds. Basically, it’s a command-line “supercut” generator.

from: Videogrep: Automatic Supercuts with Python – Sam Lavigne

Here is a quick test:

And a link to another: blade runner know

I’ve not even scratched the surface of videogrep, there are some pretty amazing ideas on the link.

I had a wee bit of difficulty installing videogrep, and had, as I recall, to wander round googling to get things running. The videos produced lacked sound, but running them through miro video converter fixed that. I am guessing if you are command line savvy enough the code could be adjusted.

Here is a supercut for Barksdale in episode 1 of the wire.

gifboard Jungle 1

More Jungle gifboards

On the back of the jungle supercut I revisited using gifboard to create automatic subtitled gifs. I notice Jim pointing to something similar. yesterday.

Both gifboard and videogrep are command line applications and not for the faint hearted.

I dusted off gifboard for a quick slice of the wire:

Rolling Bones


With a little encouragement from Mariana, I dipped my toes back into glitching world, I am afraid no movie glitchs I made were of any interest, but I had better luck with sonicification of images after Alan posted Image Bending in Audacity.

Repeating Gifs

I’ve long admired some gifs I’ve seen on tumblr that repeat across the page, during the recent giffight on emblems here are mine I figured out how to do this:

Rooster Gang

Basically a lot of copy and pasting.

Emblem Multi 500

During the emblems giffight Andrew Forgrave produced some great anaglyph gifs and some tutorials around them from which I gained a lot (globe-of-doom-anaglyph-1 | Flickr – Photo Sharing!).

The Wire

I’ve been a big fan of the wire so hoped to throw myself into some ds106 activity, turns out re-watching series one I mostly get caught up in enjoying it and following the plot, not much analysis going on here. Hopefully I get some fun before the series is out.


Posted: April 21st, 2014 | Author: | Filed under: animatedgif, Assignment | No Comments »

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.


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.

Go Jim, Stop Jim

Posted: April 10th, 2014 | Author: | Filed under: web | Tags: , , | No Comments »

Riffing off this: Educator, Learner | Animate (SOME) of the GIFs! – Educator, Learner
And recalling this: Not an animated gif

Click Jim to toggle the animation.

I’ve piut this in Mozilla Thimble if you want to remix or look at code: toggle sprite.