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 (flickr.photos.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('https://c2.staticflickr.com/8/7587/26482589423_daa3bbdbd1.jpg'),url('https://c2.staticflickr.com/8/7012/6677861899_ef6e012bc8.jpg');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:

tdc1588

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.

Record Riffing

It started with a tweet:

Then Alan: Spinning Albums from Reclaim Records made this:

Which was asking for a gif:

jim-reclaim

This was a little quick and dirty, it used my original Dancing Jim from ds106 Assignments: Dancing Jim all over the world. I knocked it up just before bed time last night.

Method:

  1. Download video (I use YouTube downloader tool – Fastesttube!)
  2. Export some frames with MPEGStreanClip
  3. Import into fireworks, as layers and distribute to frames.
  4. Import gif 3 times an 1st, 10th and 19th frame
  5. Export to gif, bit of loss 256 colours

This morning I remembered a cleaned up version of the gif: August 2013 GIF Challenge #2: Dancing Jim All Over the World | I am Talky Tina and a tip to clean up further: He’s a Maniac! And He’s Dancing Like He’s Never Danced Before | de•tri•tus.

I grabbed that and:

jim-reclain-3

Finally I though to add some music:

Having downloaded Minutemen – I Felt Like a Gringo from YouTube and pulled out a bit of audio, crushing to 32bps, with audacity.

GifMovie with my GifMovie Plugin.

If you can’t tell I love the connections in this #DS106 story.

#tdc1547 Van Gogh goes #DS106

First Daily in a while, so though it was worth a quick post.

#tdc1547 Make a Van Gogh – Make him go for DS106 | The (new) Daily Create

The original DS106 image from DS106: The Open Online Community of Digital Storytellers by Jim Groom — Kickstarter Not sure who to credit as Google didn’t turn up a backstory.

The Van Gogh picture from File:Vincent van Gogh – Self-Portrait – Google Art Project.jpg – Wikimedia Commons where it says:

This is a faithful photographic reproduction of a two-dimensional, public domain work of art. The work of art itself is in the public domain for the following reason:

The author died in 1890, so this work is in the public domain in its country of origin and other countries and areas where the copyright term is the author’s life plus 100 years or less.
This work is in the public domain in the United States because it was published (or registered with the U.S. Copyright Office) before January 1, 1923.
This file has been identified as being free of known restrictions under copyright law, including all related and neighboring rights.

Which is good enough for me.

Process

vg-layersDownload both images. Open in Photoshop.

The Quick Selection Tool is my Friend.

  1. Select Van. and make new layer via copy.
  2. Duplicate that layer into DS106 image.
  3. Quick  Selection tool to cut out rear figure to new layer. Then headphones and cables to new layers too. Hide figure.
  4. Move VG layer behind main layer resize to fit.
  5. Image-> Adjustments -> Black & White…

vg-b-w

I messed about till I got it as B&W as I could.

Cropped and exported to jpg.

Other possibilities

I did think about the dark glasses:

make-art-vg-2-dg

But think the eyes had it.

 

I also though about tracing the VG picture to make it more in the style of the DS106/Sonic Youth.

Or sending the ds106 image to the twitter bot that does impressionist images…

Updates

Worth noting I flipped the VG image.

More important we know the DS106 Artist:

And I claim a couple of assignment stars: ds106 Assignments: Remix an Album Cover 😉

A Short Intermission

We see a deluge of media dumped into twitter, Facebook, tumblr with no context. Fwooooooooooom it goes, down the stream, with no context. Wheeeeeee.

Too bad, because I think you are missing out if you are not narrating your work.

from: The Good, The Bad, and The Puppy (and some pondering on Making / Making of)

Alan reminds us of the importance of narrating our work and learning, so here is a short story about mine at the weekend.

Over on twitter I was pointed to The Walk of Life. This is a amusing site playing with the idea the The Walk of life works with any movie ending as background music. The creator has carefully edited a spectrum of movie endings to prove his point.

A nice wee twitter chat bubbled up, until Mariana asked David what he though would be a better tune. He proposed, intermission, from the end of the Monty Python movie.

A this point I though that is might be easy and fun to make a webpage that could show a variety of videos with that music behind it.

First I needed the music. As I was reading twitter on my phone at the time, I copied the url to the intermission clip on youtube and passed it to Workflow.app. There is a workflow to convert YouTube videos to mp3s and save them to your phone. I put it in dropbox.

I then search YouTube for movie endings. Searching for ‘movie endings’ found collections of 10 best movie endings and the like, but changing the search to particular movies title and ending indicated there were enough to play with.

Moving to my computer I had a look through old projects to see if I had youtube player code handy. I did, but found out pretty quickly (these were broken) that the YouTube API had changed. Over to Google and I got this:
YouTube Player API Reference for iframe Embeds  |  YouTube IFrame Player API  |  Google Developers

The plan was to get one movie playing with intermission in the background then change it so that different movies could be used instead.

I created a empty html page and put the intermission mp3 in the same folder. I was not intending to do anything fancy like turn the audio on and off when the movie played or paused (I don’t think that would be too hard). so I just created an audio tag: No controls so that the player would not show; autoplay and looping on.

<audio src="monty_python_and_the_holy_grail-_intermission_music.mp3" id="intermission" looping></audio>

Next I copied the example player code from the API page. I now had a page that played the movie and the audio at the same time in an appalling fashion.

Digging round the api pages, I found out how to mute the video, start it playing as soon as it loads and hide the controls.

Starting it and hiding the controls is done in script that loads up the iframe, autoplay: 1, & controls: 0.

Muting is just player.mute();

One of the problems with using google for this, is that there is often more information and answers that point to older and unsupported APIs. Sometimes it is better to look through the docs than type questions into the address bar.

Loading other movies. You can load movies into a player with:

player.loadVideoById(videoid);

Using the movie ID, the movie ID is easy to find from a youtube page URL:

https://www.youtube.com/watch?v=O0wOD9TWynM

So I could hard code a few buttons to load some different movies.

Next I want to allow folk to use their own choice of movie, so I added a field to paste in a YouTube URL. From that I would need to extract the v parameter, google took me to: javascript – how to get youtube video id from url – Stack Overflow that worked a treat.

Finally after a tweet from Alan suggesting a movie I added the ability to pass the webpage a youtube ID in the url:

http://intermission.surge.sh?v=Mwq0mgvC1eY.

Of course all of the code can be viewed in the source of Sounds Bad!.

I decided, for ease and fun to use Surge to publish the page. Surge is very neat for this sort of project, it allows, for free, the publishing on static web content from the commandline.

So what have a learned. I didn’t end up with anything earth shattering. I’ve got a couple of new snippets of JavaScript that could be used elsewhere. I’ve had a bit more practise in simple JavaScript and html. I enjoyed the process.

The featured image on this post is a gif ripped carelessly from the Monty Python and the Holy Grail- Intermission Music youtube video with MPEGStreamclip and stuck together with Fireworks.

Along the Daily Trail

I’ve not been keeping up with #western106 much other than a couple of artonthecouch posts.

But I have done the odd Daily Create. I am noting them here as some sort of record before they are lost in twitter.

The 4th February:

Create an Oregon Trail Game Screen for DS106

ds106-nyan

A quick google for the Oregon Trail found a pile of bitmap art. Seemed like a nyan cat riff might be appropriate. Downloaded the gif, opened in fireworks and chopped away.

5th February:  Create some stop motion using Vine

I’ve not got a vine account so just make a 6 second stop motion video. Snapped some photos with my iPhone (sitting on a lego mount), stitched together with the 5secondApp and exported as a video. I had to speed it up a bit to get 6 seconds, here is a 17 second version.

 

7th February  Add to the Code of the Cowpoke

A one line response:

8th February  5 Years Since Dr Oblivion Disappeared: Craft an Western…

coyboyoblivion

The idea of Cowboy G-Men is a a wee bit mind boggling. This is a really badly edited file. Quick & dirty. I did run a quick fliter over the cover to try and match the Doctor’s face, but didn’t spend enough time on it to do a good job.

11th February  Treasure of the Hills

We were to draw a map. Remembering the ‘lights out for the territories’ above I remembered that the map is not the territory. So my tweet went:  this mondrian is not the territory

mondrian-map

Which lead to a nice bit of twitter banter.

and so on…

12th February  Extra Terrestrial Visitors from the Far Frontier?

nyan-cow

Was a no brainer, back to FireWorks for a quick edit. The cow head was found on Flickr with a no known copyright restrictions filter.

Yesterday:  Caption Remington

an-unbranded-cow

I was trying to hint to other folk that they should license their DS106 content to make it review and remix friendly.

The stream for the daily create has been pretty active and it is great to see all of the different responses. I am not sure I’ll get to doing much more on #western106 but I am certainly enjoying the odd 15 minutes on the daily create. Thanks to Alan (and Mariana) for the continual work on organising the fun.