Accidental Allure

In the past I’ve made a few experiments with randomly layering and combining images: Glen Finlas -evaluate-sequence subtract and Averages (The Prisoner) for example.

A couple of weeks ago I started playing with combining images in the browser. There are several ways to go about this, I found a nice script to blend two images on a canvas and gave that a shot. It worked well and gave interesting results.

I though that using the Flickr API I could gather a list of images and randomly blend them two at a time.

Flickr’s API will return a json list. I started using the flickr.interestingness.getList which produced some interesting (sic) combinations. However when I started to get the license of the photos most were not labled for reuse.

I switched to using a standard search ( ) which allowed me to search for license that allowed reuse.

I also switched to using CSS and background-blend-mode, this allows you to have multiple images set on a background and blend them.

For example using these images:

And this code:

<div style="border:solid 1px;width:500px;height:400px;background-image:url(''),url('');background-blend-mode:multiply;"></div>

give me this:

With this in my toolbag I could pull in a flickr feed, extract image URLs and info about each photo and randomly combine them. They are displayed for 10 seconds each.

This gave me this:

Random Flickr Blendr

Here are a few random blends, screen captured:

I’ve found the pictures quite compelling.

On interesting this was the change I noticed when I swapped from the interestingness list to a search for creative commons images ordered by interestingness-desc. The images became more subtle and less HDRish, i think thy are more interesting and less glossy. An unusual win for Creative commons.

Over in DS106 land the page was used for a daily create:

#tdc1588 Turn @johnjohnston’s Random Image Pairing into a Self-Help Book Title | The (new) Daily Create

Which turned up some nice images and a fairly crazy bunch of titles.

My Own:


What was also interesting was some responses to the page:

So I an quite pleased with the result of this bit of experimenting. I’ve learnt a little more about CSS, images, JavaScript and even practised a bit of git. On the git front I’ve installed ezyang/git-ftp which is a quick and efficient way of pushing changed files to a website via FTP and works very well indeed. Saves working directly on line or opening an FTP application.

#DS106 Flickr Daily Creates Pummelvision style

I’ve been playing around with downloading groups of flickr photos and making very quick videos from them. Just blogged some of the process over on my main blog. Being a wee obsessive about this sort of stuff, I’ve created a script that will download all my photos with a particular tag, say dailycreate, and string them together into a movie.

You need to have the commandline ffmpeg application installed and have created a flickr app so that you have an api key. You need to know your flickr id too.

This works for me, copy the code below, replace the bold bits and paste into the terminal. Probably best to run this in a folder. Depending on how many photos you have it cold take a while.
FILELIST=$(curl '' | sed -ne 's/.*\(http[^"]*\).*/\1/p');echo $FILELIST;for i in $FILELIST ; do curl -O $i ; done;a=1;for i in *.jpg; do
new=$(printf "%04d.jpg" "$a") #04 pad to length of 4
mv -- "$i" "$new"
let a=a+1
done;sips --resampleHeight 768 *.jpg;sips --padToHeightWidth 786 1024 *.jpg;ffmpeg -f image2 -i %04d.jpg -c:v libx264 -pix_fmt yuv420p firstmov.mp4;ffmpeg -i firstmov.mp4 -filter:v "setpts=4.0*PTS" flickr-dailycreate.mp4

This wee bit:

ffmpeg -i flickr-dailycreate.mp4 -i backgroundloop.mp3 -map 0 -map 1 -codec copy -codec:a aac -strict experimental -b:a 192k -shortest flickr-dailycreate-audio.mp4

would add some audio if there is a backgroundloop.mp3 in the same folder.

The Case of the Missing Tag

Photo edited from Labels by Mrs Magic Some rights reserved

Yesterday the DS106 daily create was Create an outograph- an image where the subject has been cut out

This technique was coined by beat poet Ted Joans; see some examples from Believe the Impossible

Upload your photo to flickr and tag it dailycreate and tdc725

Sounded interesting and easy enough to do in a few minutes. I made a few and learned a we bit more about photoshop in the process (basically, select, new layer via copy and then adding a Fill layer using the selected layer as mask). I’ve found I’ve gone to photoshop a little bit more recently as its selection tools are better than fireworks’s.

I uploaded the photo to Flickr and added the correct tags:

Taking Myself out of the photo

At that point there were no other photos tagged tdc725. This morning I checked the photo flickr and clicked to see photos with the same tag. I saw quite a few but mine was not on the list, and therefore not on the Daily Create page. I’ve seen this a few time before and tried removing and adding the tag to no effect. Then I googled and found: Flickr: The Help Forum: Ive added tags but its not working (yet?)

This post gave a clue and worked for me:

Just in case it helps others – I found that if I went into the privacy settings for a photo and re-saved (it was already set to anyone) then they pretty much appeared immediately in public tag searches.

from: Flickr: The Help Forum: Ive added tags but its not working (yet?)

I clicked Show More after Additional info on the photo page.
I then clicked Edit after Anyone can see this photo
I clicked Save on the dialog, even though it already said anyone could see the photo.
The phot showed up in the tag search immediately Flickr: “tdc725”.


FlickrSounds Revisited

Or have a look by clicking this image:
flickrsound example

Following on from my last post, I’ve paused in animating gifs when I started thinking of the sounds of gifs, this is not quite adding sounds to gifs but making image slide shows with sounds. Made with a new version of flickrSounds, very much in progress. The first version, produced a list of images and sounds, this one produces a slide show of images which play sounds. I’ve not really figured out a good interface for creation yet but have been enjoying stretching my baby steps JavaScript with a bit of json saving.

At the moment the toy just gives iframe code which might not play that nicely with some blogs. Easy enough to extract the url and link to it. If more than two folk use it I’d add a field for that.

The new version of flickrSounds saves a json description of the images and audio selected. The Show page loads this json pulls in the images and audio and produces a slide show. I’ve only tested in Safari, Firefox and Chrome on a mac.

As usual I am not sure how useful this is, Ben Rimes found it interesting but no one completed it as a ds106 Assignments: flickrSounds“>ds106 Assignment. The main thing is I had some fun.


Thanks to a comment by Ben I’ve had a think about the images being of different sizes. Check Show and compare to this Show inside, the second is chosen by adding &l=t to the url.

I got this picture from google

What is Creative Commons?
What is Creative Commons? | Flickr – Photo Sharing! by Enokson

I’ve been using Creative Commons media since I discovered the web 2 world. It makes perfect sense to me. I’ve just added the same license to this blog Creative Commons Attribution-Noncommercial-Share Alike 2.5 UK: Scotland License as I use on my ‘real blog‘ I slap a straight Attribution, Noncommercial, Share Alike on my flickr photos.

I was annoyed when this one, cables, was used Is this theft?, not because I wanted money, but I just like the idea of sharing. That one broke the Noncommercial bit. I never did hear from them.

On the other hand, someone mailed me through flickr mail and asked if they could use this photo in a book, I was delighted. I got a book, but no cash crossed my hands.

As a primary teacher I always found it hard to teach attribution to young (say 10 year olds). Sometimes I though they had got it, but then thy would attribute photos that wee not marked as reusable. I recall one pupil, very pleased with a blog post who attributed: I got this picture from google.
At that point I decided there should be a wee kids license, this would allow youngster to attribute all the various license, CC, GLP etc as used under the wee kids, I don’t fully understand copyright but I am trying license.
Once I though I had the perfect chance to explain. I found that several My Space (remember that) sites were hot linking blog headers my pupils had made as backgrounds. I hoped to engender some indignation. On showing the class the response I got was COOL!
The other thing I did to try and help young pupils attribute was to make a variation of the flickr search sites. A flickr CC search toy. This you search for CC flickr photos, it gives you the embed code with attribution (unlike Flickr’s own, which just links. It also will produce a photo with the attribution stamped onto it. Hopefully making it much easier for primary pupils to find images and use them while helping attribute.

The Stamping option produces a photo like the one above, adding a strip of attribution to the bottom.
(The coding and design of A flickr CC search toy is pretty horrible, but I think it does what I wanted it to do.)