Archive for the 'Vidget – Discussion' Category

Page 2 of 2

Vidget 3

This is the latest version of my interactive networked video project.

Click on the image to load Vidget 3 in Quicktime Player. (It is quite small but very processor intensive – especially as it first loads)

This version is a mix between the my first vidget which featured a text based interface for mixing up to three video clips on top of eachother, and my Quicktime Flickr photo viewer which let you search for and view images based on a search word.

The interface has been redesigned and now features a grid of 25 draggable images which represent video clips. These may be dragged and dropped onto three coloured ‘layers’. The blue layer is the uppermost with green below and red at the bottom. Each of these layers has a number of ‘graphics modes’. Like Photoshop layers, these may be combined in a number of modes, ranging from fully transparent to fully opaque. Each of these layers also has a number of playback controls which allow the user to play the clip faster or slower, forwards or backwards and step through frame by frame.

To the right of the three colour layers and their controls is a small white text field. This allows the user to search for images from Flickr. The ten most recent pictures tagged with the search word entered are loaded as thumbnails below. These thumbnails may be dragged and dropped onto any of the layers and combined with other moving and still images.

I have resized the output movie area so that everything fits on one screen.

Behind the scenes, the vidget has also been greatly updated. Rather than being limited to a set number of video clips determined at the time of authoring, this version dynamically loads all content including thumbnails. The names of these files are drawn from an XML file. This file may be updated with a simple text editor to add or delete more clips. The movie automatically loads the first 25 thumbnails from the XML list as it initially loads but may load the next 25, and the following 25 via the 1, 2 and 3 buttons at the top right of the controls.

At the moment the whole movie pauses whenever thumbnails are loaded, either via a Flickr search or by skipping to the next 25 thumbnails of video clips. I am working on ways around this.

The LiveStage Pro source files may be downloaded here: vidget3.zip

del.icio.us continued

Sorry, my del.icio.us post was a little full of TLA (three letter acronyms).

I’ll try to explain a little bit more clearly.

Steve Harrington writes:

“I don’t get what is significant about RSS let alone RSS feeds or RSS feeds of bookmarks. Couuld you give an example and why you see this is cool -i.e. what does it help you accomplish fasterbetterqucker?”

OK, RSS was originally developed as a way of syndicating news headlines, summaries and the like. For example a news site like slashdot.org or news.bbc.co.uk may put out an rss feed of its current (latest) stories. This is like a stripped down version of the regular html version: no ads, no styles, nothing fancy, just the information. Rather than being formated like a normal html page with tags for bold, italics, etc. an RSS (or the competing format ATOM) feed will be formatted in XML with more general, database like tags like item, link, and description. This format is readable by a special news reading program and some newer web browsers (the next version of Apple’s Safari for example). So with an RSS feed and a program to read it, a user can get all the headlines and summaries very quickly and see if their favourite news site has been updated.

This format is also designed for computer-to-computer rather than computer-to-user communication and so is relatively easy to parse or interpret with a fairly simple program (much easier than HTML). So if I use del.icio.us to make an RSS feed of the URLs to video clips rather than web pages, I can make a simple program that takes these URLs and displays the associated video.

When you post a link to del.icio.us you can assign ‘tags’ to it. By tag I do not mean a piece of code, but rather a keyword. So say I linked to a clip of a monkey on a skateboard I could tag it ‘monkey’, ‘skateboard’, ‘silly’, ‘video’, etc. What is cool is that del.icio.us will generate an RSS feed for each of these tags so I could search for all links tagged ‘monkey’ by username and it will return an RSS formatted list.

For an example of how this could work, see my Quicktime Flickr photo viewer. It takes a word you type in and reads an RSS feed of images tagged with that word from the Flickr photo sharing site. It then takes these images and displays them as thumbnails. The same sort of thing could be applied to video content.

I hope this clears things up a bit :-)

del.icio.us

I had a quick play with del.icio.us today. It’s like a public bookmarks list, they call it ‘social bookmarks’. Its also like a stripped down blog engine with two key features that I think are very cool.

1. It generates RSS feeds of bookmarks.
2. Each entry can be ‘tagged’ and categorised – mmm, metadata ;-)

1+2 = It can generate RSS feeds for each tag.

So I was thinking, what if rather than linking to web pages I link to video files. And what if rather than giving a text description, I include a reference to a jpeg thumbnail. Now I could theoretically link to any piece of video I find or generate on the web and find it by searching for its tag. This would work just like my flickr viewer except for video/sound/anything.

Kent St week 3

I just got home from playing some visuals at Kent St. The show went pretty well but unfortunately the internet connection was down. This meant I could use only the clips I had on my laptop – no flickr image leeching :-) . I’ve seriously gotta make/process some more clips and/or explore some more different effects because by the end of the three hour set I was thoroughly sick of all my clips.

I added a couple of new buttons to the interface so that I could have more than 25 clips at a time to choose from but they didn’t work as I had planned. Rather than getting the next 25 clips from my xml file, they got only got one extra clip and replaced the first. Luckily I was able to edit the xml, cutting the top 25 clips and pasting them back at the bottom, then re-loading the thumbnails. Whenever I load an xml file everything pauses for a good few seconds, even if the file is stored locally. I think I’ll just try to make more space for thumbnails so that next time I don’t have to reload as often.

Plug & Play @ Kent St + Vidget 3 preview

For the past couple of Thursday nights I have been playing live visuals at a night called ‘Plug & Play’ at a bar called Kent St (located confusingly on Smith St in Collingwood). The night is run by two fine gentlemen named Jean Poole and Future Eater and is a nice relaxed place where each week people come to plug in their audio/video/laptop/playstation/casio devices and play. The venue also has a good broadband connection which allows for international djs/vjs to perform remotely and for me to test my latest vidgets. Version 3 is just about ready for posting here and combines the layering/mixing of clips of the first version with the photo searching and xml reading of the Flickr Viewer.

Here is a screenshot of the new drag and drop interface. The grid of images is loaded dynamically based on an xml file which means I can set the vidget up to play different content without rebuilding the entire project in LiveStage Pro. Almost everything is modular now. The ten thumbnails on the right are the results of a Flickr search for the tag ‘blue’. Each of these thumbnails is draggable to the three clip holders at the top of the screen (red, green, and blue). These refer to the three different layers of video which are output to a screen or projector. Up to three video clips or still images may be mixed/layered together.

After playing with this prototype version at Kent St last week I’m definitely going add some more space for thumbnails as I ran out of content after a while. I am also going to explore some more of the graphics modes for combining the images.

Oh yeah, I’m playing there again this week so if you’re in Melbourne come down. Its free and starts at about 8pm @ Kent St, 201 Smith St Collingwood.

About Vidgets

I’ve been toying around with names for what I am making in this project: ambient, networked, desktop, interactive, video machines? Noisy, digital, VJ, software instruments?

It gets confusing when I describe the works as Quicktime Movies: “like short films?” no, for the moment I’m not really interested in narrative; “what’s so interesting about putting a video file on the internet?” well the movies can actually talk to each other and the user can control how they play; “so its like Choose-Your-Own-Adventure?” um, kinda, not really…

I think I was on the right track when I started thinking about the works as machines, like Russolo’s ‘noise machines’, Aarseth’s ‘machines for the production of variety of expression’, Deleuze and Guattari’s machines, and Lou Reed’s Metal Machine Music.

The question then became, “how do these machines work in a desktop environment?” The works are like screen savers except that rather than going away when you move the mouse, they potentially get better because you can manipulate them. They are like games except that to a large extent the user makes up their own rules and goals and can choose their own level of participation. They are like demos and visualisers except that the programming is very basic and the graphics are composed of video files rather than generative algorithms. Unlike all of these, the works needn’t take up the whole screen. They should be able to run alongside other programs, like visual music in the background. Like widgets.

The idea of video-widgets became vidgets and I think I like the sound of it.

About Widgets

I was familiar with the term ‘widget’ as both a kind of gadget to be used in examples (I always picture being in a year seven information processing and management class doing a graph with the title ‘Widget Sales up 17%) and an element of an interface (eg. a play/pause button widget), but recently the term has become quite a trendy buzzword and is used to describe a class of applications or desktop accessories which sit somewhere in between being ‘content’ like a basic web page, and ‘application’ like a word processor or design tool.

For the past couple of years a program called Konfabulator! has been providing Mac OS users with a suite of functional widgets and the tools to create their own. Check out their site and download the free version. Some great examples of widgets developed by the makers of Konfabulator are weather forecasts which automatically update themselves drawing on weather feeds, photo viewers, calculators and iTunes remote controls which display song information in real time. I had heard of Konfabulator ages ago but I wasn’t reminded of it until I watched the Apple WWDC Keynote presentation. In a very long presentation focussing on the the next version of Mac OS X, Tiger , amongst a number of very cool new features was one called Dashboard.

From the website:
One Dashboard, Many Widgets
The Dashboard is home to a new kind of application called Widgets. Widgets are mini-applications written in JavaScript that are designed for fun as well as function. They keep you up to date with timely information from the Internet such as stock quotes or the latest view from your favorite Web cam. They can also provide quick, simple access to frequently-used applications such as a calculator, a playback controller for iTunes and a contact look-up for Address Book.”

One of the best things about widgets such as the ones developed by Konfabulator and copied by Apple is that they know their place on the desktop and in the network. What I mean by this is that each widget has a single function and does it well, and that it is able to interface with other programs and files on local and remote systems. A good example would be the standard calculator which comes with the current version of OS X. While a basic calculator is a useful tool, making a calculator which is ‘aware’ that it is on a computer which is connected to the network means the user no longer has to look up currency conversion rates manually because the calculator program can automatically update rates from a remote service.

I don’t think this ‘new kind of application’ is all that new, but it is definitely an interesting one to be explored in art practice.

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

Quicktime Blogroll

Using the same techniques as before, this movie accesses my BlogRolling blogroll RSS feed. More on this later – time for bed.

Random Site – An XML Reading Quicktime Linker Movie

I’ve finally got my head around getting Quicktime to read XML files!

This has been a long and frustrating process as for a while any mention of XML would cause LiveStage Pro to unexpectedly quit. I’m still not sure what was going wrong there but I think the key to making everything work smoothly was using lots of strings to remember the paths to different information stored in the XML.

Here it is:

Continue reading ‘Random Site – An XML Reading Quicktime Linker Movie’

Text to String

This is a little movie I made to test how Quicktime deals with real time text input. It is also the first step in a project to dynamically source video material from any URL. In future examples I will use this same method to paste a URL and load it into another window.

Click the poster movie to load the real one. Click above the line and enter some text. The movie copies the contents of the top text track to a string and adds it to the start of the bottom text track. I initially had the movie execute this action only when you clicked. In a purely ‘functional’ interface this is how I would do it but I wanted to stress the real time aspect of the process so I have the movie add text on the ‘Idle’ event handler. This means the text will start cascading down the second track as the user types without waiting for them to finish.

The LiveStage Pro source files can be downloaded here.

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.

Inter-Movie Text Communication

This is an experiment in inter-movie communication. With Quicktime a movie can send information from one movie to another. The movie files can communicate when they are either embedded into one web page (like this page) or when they are open in separate windows in the Quicktime Player application (you can download the two movies to test this).

In this case the orange movie on the left sends some text across to the white movie on the right. While this may not seem all that amazing, it could be sending much more interesting information and the movie receiving the information could be processing or interpreting it in interesting ways. I’ve chosen to send simple text just because it it is a very handy way of testing if a script is working.

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

The first movie xtexttestsender.mov is made up of a sprite track and a text track.

The sprite track contains one sprite, which has the following script assigned to the “Mouse Click” event.

MovieNamed(“xtexttest.mov”).TrackNamed(“Text 1″).SetTextEditstate(kscriptediting)
MovieNamed(“xtexttest.mov”).TrackNamed(“Text 1″).ReplaceText(“BANG”, 0, 0)

The second movie xtexttest.mov is simply a single text track. The important things are that the movie is called “xtexttest.mov” and that the text track is named “Text 1” so that the above script finds its target. The first line of the script is telling the track named “Text 1” in the movie named “xtexttest.mov” to make the text field editable by a script, setting it to “kscriptediting“. The second line is telling the movie to insert the text “BANG” into the same text track. The ““BANG”, 0, 0” tells the movie not to overwrite the text which was previously in the track. If we had changed the first number to 2 the first two letters of “Here” would have been removed, if the second number was two the last two letters would have been removed.

I have included the LiveStage Pro .lsd files for the two movies here: xtexttestsender.lsd xtexttest.lsd

So anyone with a full copy of LSP or even a demo can have a play with my scripts. In this case the script is very simple, but I’m starting to post all my .lsd files so you should be able see the scripting getting more complex as I learn more.

Re: vog001 – LiveStage Pro for dummies

In my application for admission into the MA program I proposed to use a cycle of “Action-Research”, so was time I actually got down to some interactive video action.

My first experiment was going to be a very simple sequence of video loops which would play infinitely until the user clicked on them, at which point the next loop would load. I knew how to do this using html (I’ll explain how this works in detail in another post) but I wanted to have a play with LiveStage Pro and see how its scripting/programming language “Qscript” works. I also wanted to work out how to have each of the loops pre-load so that there would be instant feedback between clicking on one loop and triggering the next.

After a few hours of playing with LiveStage Pro I decided to read the manual. I usually pick up the basics of a new program pretty quickly since most applications share similar conventions for tools, timelines and assigning actions and variables but I think my experience with programs such as Director, Final Cut Pro, DVD Studio Pro and Storyspace actually slowed me down a bit in this case.

In Director and Final Cut Pro for example, everything revolves around the time line and while you can reference content files such as movies and sounds, the final product you are usually aiming for is a fairly self contained “Projector” file (Director) or a discrete ‘final’ quicktime movie or MPEG-2 ready to go to tape or DVD. In Livestage Pro (LSP) the timeline doesn’t function the same way and the output is infinitely modular and stackable. Rather than making a self contained movie, LSP is biased towards referencing sub-movies which can, themselves, reference sub-movies. Any of these movies can contain “Sprites” and scripts which control and manipulate each other [If you can get them to work :-) ].

While the timeline is a bit different to other programs, the scripting and actions which make movies interactive had me confused and frustrated for a long time. The manual says that each script has two parts: a target (something like ThisMovie) and an action (something like SetRateTo) and can be triggered by an event (something like Mouse Up). I found a couple of good references on Qscript at totallyhip.com (The makers of LSP) and Qscript Crash Reference, but it was only when I found samples at totallyhip.com that I was able to get anything to work.

Whenever I tried to run multiple movie tracks and activate and de-activate them with Qscripts the program would unexpectedly quit, so I ended up trying to get the program to do something else. The other idea I wanted to explore was varying the playback speed of a movie in real time depending on user input. Luckily I found a sample file which did just that. By replacing a flash track with one of my movies and changing a few constants I was able to make a movie that actually responds to user input without crashing!