Archive for the 'Design' Category

Quicktime Flickr photo viewer

Click image to load in Quicktime Player (it seems to be a little funky in a browser)

This is a little Quicktime movie that lets you view photos from Flickr, a photo sharing and social networking site. When users upload their images they associate them with tags, so a picture of a tree may have the tags ‘tree’, ‘green’, ‘eucalyptus’ etc. The entire database of photos is searchable by tag, by author, by series and other organisations. Each of these has a RSS or ATOM feed associated with it. This is what I am using here to access the 10 most recent uploads for a given tag.

To search the site and view the photos, just type a tag, say “cow” (no quotes) into the small white text field and press return. If you press return without entering any text you get the 10 most recent uploads from any category. Once the thumbnails load you can click to view at a larger size on the right.

The movie uses Quicktime’s ability to read and parse XML files such as RSS feeds and access files from the network.

Source files and more detailed explanation soon…

Interactive Andy Warhol Marilyn Prints


This is a great example of an ‘ergodic’ interactive work with a very clever, but simple concept produced well. This site allows you to create your own ‘Marilyn’ prints in real time on screen with an embedded flash file.

Andy Warhol’s Marilyn prints

Vidget 1: an interactive networked VJ application for Quicktime

Its been a bit quiet around here for a while and this is why. I’ve been working pretty solidly on this piece for the past couple of weeks leading up to a gig I co-organised last week. Segmentation Fault is a semi-regular experimental music & visual night we put on every couple of months and proved to be a good motivation (ie. deadline) to get a work together for. in my research I am mostly interested in applying VJ aesthetics and methods to the desktop environment where the user becomes the performer, but its always fun to perform in front of an audience of humans in a room.

Now its time to release this draft to the world and see what people think. Click on the images below to load the two parts in Apple - QuickTime Player.

The scrambled looking black, white and green image will load the ‘output’ movie. This is the movie to be projected on a screen or viewed on a second monitor. It is designed to run at full PAL resolution (720 * 576) to suit the TV output of my laptop. If you want to try it out on a single monitor setup, you can load the movie and select ‘Half Size’ from the Movie menu in Quicktime Player. This movie is really just a kind of holder for up to three other movies. To load different clips into the ‘output’ movie you will need to use the ‘interface’ movie below.

This movie controls which video loop is loaded in which layer of the output movie. Along the top of the window are the numbers 1, 2 and 3. These represent the three layers with 3 being the ‘highest’, 1 the lowest and 2 in between. Next to each of the numbers are playback controls for each layer. Once clips have loaded they may be played forwards and backward, in slow and fast motion and stepped through frame by frame. Next to the playback controls are the graphics mode controls. These control the ways in which each of the layers are blended.

‘Blend 0′ means the clip is completely transparent. It is probably a good idea to switch to this setting if you are going to load a big clip as it will take a while to load and display a still image whilst it is doing so. ‘Blend 100′ means the clip is 100% opaque so any other clip below it will not be seen.
‘Add Max’ adds the bright portions of the clips image over the clips below, leaving the dark areas transparent. ‘Add Min’ adds the dark portions of the clips image over the clips below, leaving the lighter areas transparent. ‘Sub Pin Blk’ subtracts the bright areas of the clips image from the ones below so white snow on a black background will result in black snow on a transparent background. ‘Inverse Or’, ‘Exclusive Or’ and ‘Inverse Exclusive Or’ produce other effects but to be honest I’m still not sure exactly how they work :-).

These graphics modes probably won’t be much fun to play with until some different clips are loaded into each of the layers. To do this I have designed two different patch loaders. If you click on the 1 or 2 with red # symbols next to them the # will change to a *, telling you which loader is active. The first thing to do is select which layer or ‘channel’ to load the clip into. These are selected by clicking the large 1, 2 or 3 at the top. Next a clip may be selected from the list at the bottom half of the controls. The clip’s name and id number are displayed and when the ‘Do It!’ button is pressed the clip will start to load. (If you are wondering why it is called ‘Do It!’ go see Starsky and Hutch :-))

Note: there may be a couple missing - such as the ‘live input’ at the bottom right, so if you get a ‘broken movie’ image just try another clip.

The Livestage Pro project files can be found here: interfaceproject.zip outputproject.zip

Office Voodoo

Office Voodoo is a great example of an interactive video project that uses a cinematic/televisual aesthetic with real life actors whilst maintaining meaningful real time user interaction. It is rare to a project which achieves all these aims at once.

Office Voodoo features footage of two bored workers as they sit in an office. By physically manipulating ‘voodoo’ dolls with red flashing eyes, two users may control the characters’ emotional states. Depending on the combination of the two characters’ moods a real time editing engine cuts together shots which form a kind of ‘algorithmic sitcom’, as the site says. The editing engine respects the conventions of shot / reverse shot and continuity editing, making for a fairly seamless TV like program.

While I haven’t played with it myself, the About Office Voodoo movie on the site shows examples of people using the system and the effects of their actions on the characters. It reminds me of being a director holding casting auditions where I would get actors to act out a scene in a couple of different ways. My favourite was when I asked an actor to rap a David WIlliamson play.

From the site:

“With advances in compression standards and faster, larger hard disks, the film form is finally freeing itself from the inherent linearity of the celluloid or tape substrate, as it becomes chunks of data that can be retrieved instantaneously. This explosion of the film medium is redefining our approach to narrative filmmaking and over the viewer’s control of the time flow and the plot. In the attempt to carry on the tradition of mimetic storytelling with real actors, this piece brings together the craft of cinema with automated editing techniques, trying to replicate in new media semiotics what 1920s soviet filmmakers like Kuleshov did to film with montage. Here, the knowledge of the editor is represented in the machine, and the rules are scripted according to user interaction. As a filmmaker and a programmer, the author is telling a story not only with audiovisual media but also with computer code.” [my emphasis]

More Links:
Michael Lew
Media Lab Europe

Remote control 0.2

CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">



CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">



Click the poster movies above to load the real ones. The second one will take a little while to load (3.9Mb)

Alternatively (recommended) download the two files, ControlTOBE.mov (Controller) and TOBE.mov (Player) and open them both in Quicktime Player.

Ok, this is a half finished draft of a basic Quicktime vision mixer. Like the inter-movie text communication movies I posted earlier , this project comes in two parts: one movie to control another. I actually created the text sender movies to troubleshoot when I was making this movie.

The ‘player’ movie contains three video tracks. The ‘controller’ movie features a number of clickable sprites which tell the ‘player’ movie what to do. By clicking on the green or red buttons on the left hand side of the ‘controller’ the tracks in the ‘player’ movie may be enabled or disabled. In the middle of the ‘controller’ movie there are two gradients with a percentage number, these control the opacity of each of the two ‘upper’ video tracks. By clicking on the gradients at various different places along the horizontal the numbers should change and the tracks should fade in or out. On the far right of the ‘controller’ movie is the ‘invert’ button. This inverts the top video track so that white is black and black is white etc.. The other button at the bottom of the ‘controller’ is the ‘add’ button. It is the latest addition and it also controls the top movie (I’ll move it up top in the next version). Rather than simply inverting the video track, the ‘add’ button produces an additive effect (like a Photoshop layer) which changes depending on the presence or absence of the underlying two video tracks.

This draft was designed as an experiment in building a VJ instrument in Quicktime with Livestage Pro for a recent Segmentation Fault gig I was organising. The ‘player’ movie is designed to automatically go to full screen on the video output of my laptop while the ‘controller’ sits on my screen out of sight. I built a more complicated version with about 20 different video tracks for the gig but unfortunately most of the effects such as fading in and out and layering decided not to work on the night. I think I’ve worked out the problem so I’ll post a new version soon.

The buttons usually take a couple of clicks to get going but they should work after that.

Flash interactives

ClownStaples is a source of many interactive flash animations. My favourite (while not strictly interactive) is a pun on the loading of flash animated splash screens. It proceeds in an increasingly complex series of loading screens without end. Unfortunately since the site his hosted by Geocities it is often unavailable due to limited data transfer.

Video Content Management Sytems

A while ago Adrian Miles’ posted Video Blogs, Vidblogs and Vogs, presenting an ongoing discussion about the nature and definitions of video weblogging.

He writes:

“At the moment all video blogs are video inside text orientated CMS [Content Management System] engines. But here’s a simple idea (more complex backend), you make a movie that has a sprite and a text track. The text track is there to show a number. The sprite reads an external XML file which simply indicates how many trackbacks that video has.”

So I set about looking for examples of alternative content management systems which deal natively with video rather than text. I’m still working out how to get Quicktime movies to read and write to my own XML databases using Livestage Pro.

WaterCooler provides a very slick looking and functional interface for their content management system in a small 265k host movie.

Navicast provide another ‘aqua’ styled interface to their CMS, this time with more controls such as three levels of compression quality and playback size. The selection and organisation of clips is, however, not as well executed as WaterCooler (for example the first movie loads by itself - slowing down access on a slow connection before the user has made a choice).

The two sites provide good examples of what is possible using the Quicktime Player as a front end for content management, accessing online clips and data. While both feature linear movie clips, a similar approach could be used to deal with interactive and dynamic ‘hyper’ media. This is a direction I am looking to explore as I learn more about the tools.

Customising Moveable Type templates with CSS

This looks like a really helpful resource for making Moveable Type weblogs look a bit better than the default settings. I’ve still got a bit of a way to go making this blog a bit prettier but I think this will help.

mediatinker.com

Panse - Public Access Network Sound Engine

I found this link through the Oxff mailing list which is a discussion space for real time video performers (vjs etc) and programmers using patching and coding based software such as Puredata (+GEM) and Max (+Jitter).

panse - public access network sound engine

From the site: PANSE is an open platform for the development of audio-visual netart, open to all

The PANSE experiments are made up of various browser windows which each feature a flash animation and or controls such as sliders and buttons. These windows each control (or are controled by) an audio synthesiser which sends a real time generated MP3 stream back to you. The more of the little windows you have open the more complex the sounds and visuals become as they interact with one another. This sort of thing makes me want to learn Max or PD! I love the way anyone can post their own projects to the site and they can work alongside everyone else’s.

Segmentation Fault

I’ve set up a new weblog for the audio/visual performance nights I organise with a couple of friends. The first Segmentation Fault gig was held on 11/11/03 I’ll be adding some images and sounds to the new weblog soon. The Segmentation Fault weblog will be updated by all of those involved so it should be interesting to watch the various different perspectives on the process as we prepare for the next.