Boing

Click the pic to toggle sound.

This tweet lead to this post, Spring into Action this Fall by Todd which lead to Todd tweeting @johnjohnston So maybe we should add some sound to the bobbing heads? which lead to this.

Of course Todd started the headless meme with another t-shirt earlier and cogdog played along

I was trying to think about how to explain ds106, but I guess this does it;-)

For me ds106 is a bit like non competitive tennis with self replicating balls that can be played on any court you like with any rules you like with the addition of be nice.

Credits:

Sound: Freesound.org – “Boing.wav” by juskiddink licensed under the Attribution License.

Image: Todd using the one I tweeted as a starter.

 

 

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.

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.

Update

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.

Sounds Like a Train

Alan’s challenge

Step it up a notch and match your train gif to a song using http://gifsound.com

reminded me of flickrSounds, so I made a wee train quote with pictures and sound, much to my surprise I found a train for for this and train sounds for bound.  Back to giffing soon.

this


by Abhinav (The Ludhiana Edition)
Attribution License

deep effect 3.wav

train


by swoofty
Attribution-NonCommercial-NoDerivs License

Train Horn 2.wav

bound


by sporkwrapper
Attribution-NonCommercial-ShareAlike License

Ja Loco 02.mp3

for


by astrangelyisolatedplace
Attribution License

For your safety please remain seated

glory


by FarOutFlora
Attribution-NonCommercial-NoDerivs License

IWPW 10 Thoughtful Driftings.aif

flickring clouds

Rolling the remix dice I get: haiku it up [remixed]: Media Bender — Remix Machine

Original assignment: haiku it up For the writing assignment, take a random Dailyshoot photograph and create a haiku using that image Remix Card: “Media Bender”: Change up the media for the original assignment- take a video assignment into audio or design.

So I grabbed some images from here: Take a picture of a cloud and tell us what it looks like to you using A flickr CC search toy to get the ones with suitable licenses. I skipped the cloud pictures that had annotations or drawing and and was left with six strong pictures. I wrote a haiku to go with them, dragged the images into iMovie and added a voice recording and a by Kevin MacLeod.
Nothing that any primary 5 or 6 could not do. I am not terribly please with the audio, using a usb headset mic, recorded so many times my voice loses all meaning. Better mics not avaliable and I wanted to get these 2 stars down quickly and get back on the ds106 horse.

Flickr Photos by
Dare to dream7: Attribution-NonCommercial-Share Alike License
@DrGarcia: Attribution-NonCommercial License
cogdogblog: Attribution License
Michael Branson Smith: Attribution-NonCommercial-Share Alike License
Rowan Peter: Attribution-Share Alike License
Music: Kevin MacLeod