Archive for the 'Web' Category

Send to Receive

Published on August 15, 2011 in Design, Hackathon, Tech, Video and Web. 0 Comments Tags: , , , , , .

Send to Receive is a WebGL particle animation that responds to SMS.

screen shot

You can see it running live here (you’ll need a WebGL capable browser such as Chrome).

It uses text messages to generate pseudo-random combinations of particle colour, background colour, size and speed to change the animation. It also uses a dictionary of colour words found via XKCD to find matching words in the text messages and use them to colour the particles.

The animation is based on a THREE.js demo project by Paul Lewis / @aerotwist.

DSC_0291

Send to Receive was created over two days at The Creators Project / Eyebeam #arthack hackathon. Read more about the other arthack projects and winners here.

By David Wolf with Twilio SMS integration & Sinatra backend by Jonathan Vingiano based on an idea by Crystal Butler.

You can download the source and fork it on GitHub here

HTML5 Audio Bubble Shooter

Published on August 5, 2011 in Hackathon, Tech and Web. 0 Comments Tags: , , , , .

screenshot

Click on the image to play (requires the latest Chrome Beta)

This game/demo was created in an afternoon at the Google HTML5 Hackathon NYC on Monday August 1st 2011 by Du Hoang (design), Michael Yin (game programming) and me (audio api integration).

Using the new HTML5 Audio API, the game does real-time audio analysis and beat detection on an mp3 file playing in the browser, triggering music bubbles on the beat and changing the game background gradients.

It’s pretty crazy what you can achieve in a few hours of hacking! It was lots of fun.

It requires the latest Chrome Beta. You will also need to enalble the Web Audio API by going to about:flags. See instructions and more examples here.

Based on http://www.propulsionjs.com/ and the HTML5wow GAL 9000 demo.

Audio: Show My Ass by Dominique Young Unique (via Pitchfork)

TechCrunch Disrupt NYC Hackathon

Published on May 27, 2011 in Hackathon, Tech and Web. 0 Comments

TechCrunch logo
Hackathon Day Two: The Apps Are In! (TCTV) In the early hours of Hackathon day two, bleary-eyed hax0rz roamed the conference hall, checking out each others’ apps. TCTV caught up with a few who were still standing to see how they fared after twenty-four hours, heads down in the code and design… (video)

Last weekend I participated in the TechCrunch Disrupt NYC Hackathon. Starting at 12.30pm on Saturday and working through until 9.30am on Sunday I worked with Jonathan Dahan on a prototype of Soundscape. We were interviewed by TechCrunch at that special hour of the morning when we were totally manic and couldn’t stand still! See the video here.

The mobile app we built lets you tag and identify songs when you’re out at a café, a bar or a club. It links the song information to the venue as well as whether you like or dislike the song.

Soundscape

The idea is to build up a musical map of what is being played where, so you can choose where to go based on your musical tastes and give feedback to the venue owners and DJs.

The prototype app was built using HTML5/JS/CSS through Phonegap with a server running Node.js and MongoDB. We used The Echonest for track information and foursquare for venue information.

The app was designed by Courtney Christopher.

del.icio.us daily links and RSS media feeds

Published on February 20, 2006 in Tech, Video and Web. 0 Comments

del.icio.us/dpwolf by David Wolf

I’ve set up del.icio.us, a clever social bookmarking service to automatically post my daily links in the blog. I figure this place could do with a bit more activity and by adding a couple of lines of description to each link I can share the sites which catch my attention with a bit more clarity without having to sit down and write a proper post. I use del.icio.us quite a lot as I often move between different computers and locations.

While the daily post service is great, the interface for setting it up is a little clunky and cryptic unless you know what you’re doing. Thankfully Kevin Lim has written a helpful little guide to setting up del.icio.us with WordPress. It basically involves entering a username and password for your blog, the address of the xmlrpc.php file on your server, what time you’d like the post to occur in GMT and which category you’d like the post to appear in.

iTunes downloading video from a del.icio.us RSS feed

Another cool del.icio.us feature I’ve been meaning to post about for ages is the addition of RSS feeds for particular media types. Traditionally del.icio.us has provided RSS feeds of links for each tag, for example the RSS feed for links tagged “example” http://del.icio.us/tag/example is http://del.icio.us/rss/tag/example. Now, (since about halfway through last year actually) you can also search by media file type and generate RSS feeds for these complete with enclosures for use in podcasting applications like iTunes or FireAnt. So it can generate a feed of all the mp3 files people link to directly, or all the QuickTime movies or JPEG or MPEG files. Additionally, you can add tags to generate feeds of a particular media type about a particular topic, for example http://del.icio.us/tag/system:media:video+80s give you a collection of 1980s themed video files (mpeg, wmv, mov etc).

While I use iTunes as a media RSS client at the moment to harvest source clips which may be manipulated in live performance eventually it would be great to add a built in video RSS reader to my experimental video appliations (vidgets) and do live video searches.

[A disclaimer: subscribing to a feed of all mpeg or wmv files linked to by random strangers on the internet can lead to the automatic downloading of porn or other things you may not want on your hard drive (especially on a work or uni computer) so be careful eh ;-) .]

Technorati Tags:

Glitcharama

Published on February 13, 2006 in Design, Tech, Video and Web. 1 Comment

A few months ago I began playing with manually corrupting jpeg files to see what kinds of artefacts I could create. I selected an image, compressed it down to a very small size (so I could easily manipulate large chunks of the data), opened it in a text editor (I like SubEthaEdit and TextMate) and added random text, copied pasted and generally shuffled the data, occasionally saving as new files.

Above is a QuickTime movie which animates through 12 of the resulting jpeg files. Click it to stop if it’s giving you a headache ;-) I re-compressed the jpegs just to be sure they wouldn’t crash QuickTime Player. Manually introducing errors and noise into files and then playing them is one of those “make sure you save any important files you have open” situations as things can grind to a halt.

I was playing with these images at Plug N Play at Kent St on Thursday night. I mentioned that I was planning on writing a php script which would similarly screw with jpeg images online and Sean told me about glitchbrowser.com.

From the site:

Computers are not allowed to make mistakes.

The glitch browser represents a deliberate attempt to subvert the
usual course of conformity and signal perfection. Information packets
which are communicated with integrity are intentionally lost in
transit or otherwise misplaced and rearranged. The consequences of
such subversion are seen in the surprisingly beautiful readymade
visual glitches provoked by the glitch browser and displayed through
our forgiving and unsuspecting web browsers.

This work was produced for New Langton Arts Packets programme,
by Dimitre Lima, Tony Scott and Iman Moradi.

Glitch Browser lets you enter a website’s URL and it will show you the page with all of the images randomly glitchified. For example, here’s the most interesting photos from Flickr through the Glitch Browser. Great stuff!

Technorati Tags: , ,

VJ Bertranol

Published on October 27, 2005 in Music, Tech, Video and Web. 0 Comments

VJ Bertranol

VJ Bertranol aka Bertrand Gondouin is a Sweden based VJ, video blogger and video software developer.

Through his company Mixnbrew he has developed a number of interesting bits of software including Symtonic A Flash based online video mixer application, Patchouli a video blogging uploader / content management system, and Scramble a granular video synthesis engine.

Good work and good to see the whole video blog / vj / network video crossover thing happening.

Technorati Tags:

The Guild website

Published on September 17, 2005 in Design, Tech, Video and Web. 0 Comments

Yesterday I finally finished setting up a website for The Guild of Commercial Filmmakers, a film production company where I work.

The site is powered by WordPress and makes extensive use of customised templates, css and custom fields. The design is by Nicole Dominic, sliced up and css/xhtml-ised by me.

One of the main functions of the website is to present an easily update-able show-reel of the company’s work (primarily TV ads). Some of the tricks I discovered whilst making the site may be of interest to the videoblogging crew or others wanting to use WordPress as a content management system for video. The next step is going to be working out how to customise the site’s RSS feeds to include this information.

screenshot of The Guild website

For each of the ads I make a regular post, storing a lot of information in custom fields, such as: the url of a thumbnail image; the url of a poster movie and the url of the movie itself. I store this information here rather than in the actual post text in order to separate content from styling and presentation, allowing me to refer to the same clip in a number of different ways from different areas of the site.

Continue reading ‘The Guild website’

MPEG Streamclip

Published on August 19, 2005 in Tech, Video and Web. 0 Comments

Squared 5 – MPEG Streamclip for Mac OS X is a handy little application which converts and demuxes mpeg streams. I found it a few weeks ago at work when I needed to recompress a large file from a client to put up on a website. By itself Quicktime Player will only export the video of a muxed mpeg file. MPEG Streamclip is designed specifically to convert mpeg 1 or 2 files to Quicktimes, or split them out to separate video and audio files (mpgs, m2vs, ac3s and aiffs). Very handy and free!

Interact with Quartz Compositions in Safari through JavaScript

Published on August 19, 2005 in Tech, Vidget - Discussion, Vidget - Download and Web. 1 Comment

mDimension Technology have developed a plugin for Safari which lets you not only view Quartz Compositions in a web page, but also interact with them via JavaScript. This is very neat!

So far I’ve been experimenting with creating custom applications (Vidgets) in Xcode which control Quartz Compositions, this plugin appears to give me most of the same functionality within a web page. To control and manipulate the composition, first you must follow the same methods of ‘publishing’ inputs and outputs from a composition as described here.

View source on these pages to see how to send and receive information to and from these inputs via JavaScript. I’m still working it out myself!

Here is a demo page from mDimension with a Quartz Composition embedded.

Here is a quick demo I made up based on the above page. It allows you to load an image by entering its url into a field and clicking outside of the field (don’t need to press enter), and change the spinning text similarly.

A Quartz Composition embedded in a webpage, being controlled via JavaScript

Technorati Tags: ,

QuickTime 7.0.1: Security enhancements

Published on July 14, 2005 in Tech, Vidget - Discussion and Web. 1 Comment

QuickTime 7.0.1: Security enhancements

This sucks. QT 7.0.1 no longer lets you access remote web locations from within a Quartz Composition when played using Quicktime Player. No more playing such compositions from the Quicktime Plugin in a web page either. This means no RSS feeds unless you run the composition in Quartz Composer itself or in a custom app.

This is the direction I’m heading anyway (making custom apps) but it means you can no longer distribute a .qtz file or a composition in a .mov which accesses network data and expect it to work on machine running Tiger unless the user has Quartz Composer installed.

These were some of the coolest features of Quartz which I was only just starting to explore before the plug was pulled. Hopefully these features will return some time soon.

Update 18/7/05

I don’t think I made this clear enough but the change was made in response to the potential security issue whereby network access from within a composition wrapped in a .mov file to be used to leak information to a malicious third party when used in combination with Quartz Composer’s ability to access sensitive information about the host computer (computer name, local ip address, current username, results of spotlight searches etc). See the original security report from David Remahl here:

Full-Disclosure: [Full-disclosure] [DR018] Quartz Composer / QuickTime 7 information leakage

Regular (non Quartz Composer) wired Quicktime movies have had the potential to expose some information about the host computer via network access for many years, however it was never to this level and I guess never seen as a security issue. As much as I hope to see things like RSS access return to Quartz Compositions when wrapped in .movs I don’t think it is likely.

It would be virtually impossible to modify Quicktime’s handling of QCs to differentiate between allowing nice, friendly information to be sent (get me links to all the recent images of “x” from flickr.com) and preventing nasty information such as (here is my username and ip address, please start trying to hack into my machine).

Using Quartz Compositions as screen savers expose the same potential risks but I guess in this case you are making a conscious decision to install a piece of software, as opposed to playing a .mov file unaware of its hidden code.

Technorati Tags: ,

Template Cinema

Published on July 13, 2005 in Note to self, Video and Web. 0 Comments

Template Cinema: A short film about nothing, by Thompson & Craighead

Template_Cinema is a collection of “low-tech movies made from existing data appropriated in realtime from the world wide web” by London artists Thomson & Craighead.

The works feature live camera feeds from various locations around the world accompanied by haunting mp3 scores, again appropriated from elsewhere online. Whilst beginning with film leader and ending with credits, these ‘templates’ are filled different every time they are viewed. Some are fixed views, others controlled by unknown ‘directors’.

The Template Cinema project began in 2002 with a networked installation: Short Films about Flying which featured live views of an airfield, snippets of audio from online radio stations and text from message boards.

In my own work I am interested in combining this is the sort of work (network/database cinema) with the real time malleability of sound art and VJ performance.

Also worth a look are these net.arty Web specific artworks and gallery works by Thomson & Craighead.

Dan Winkler’s this box of earth

Published on July 8, 2005 in Video and Web. 0 Comments

A new video by Dan Winkler

Dan Winkler has returned to his beautiful abstract video blog this box of earth after a long break. #19 is his latest piece but its worth having a look back at some of his earlier works like #05 which date back to June 2003.

Quartz Quartz Quartz ?

Published on May 18, 2005 in Note to self, Video, Vidget - Discussion, Vidget - Download and Web. 0 Comments

I’ve been having a good play with Quartz Composer over the last couple of weeks. It is very exciting and a bit scary at this late stage of my MA research: “Does it make what I’ve been doing for the past two years redundant?”; “Should I drop the whole interactive QuickTime thing and start from scratch in this new environment?”; “Should I ignore it for now and continue with QT because it is cross platform and more accessible?”.

In many ways it lets me do what I have been doing, experimenting with, and wanting to do (real time interactive online video) much more quickly and with exciting new visual results. In some ways it makes basic QT redundant but it is quite a different beast.

QuickTime excels on the network. Child movies can be sourced from anywhere, XML and QTlists while a pain to set up sometimes are very powerful and I’ve only really scratched the surface of their potential when combined with server side scripting such as php. Quartz Composer is much more at home on the desktop. It can import still image files from a URL but not movies. It can read RSS very easily, but is designed for human readable text and requires custom scripting to deal with generic XML files and attributes. I have had some success getting QC to load movies from the network via a local QuickTime link file pointing to a URL, but the targeting it is local, relative to the QC composition. It seems this link is lost if the composition is exported to a .mov file.

Here is a quick example (requires Mac OS 10.4). Apologies for the cheesy kaleidoscope imagery :-) once downloaded and unzipped, the .qtz file should play in Quartz Composer, importing link.mov which points to a video file on my server. The zip file is about 4k.

The cool thing is, in many ways this (Quartz Composer), builds upon what I have been doing in QuickTime and is mostly playable by both the QT player and plugin. While the linking to movie files online is problematic at this point, surprisingly live video and audio inputs are supported even in the QuickTime browser plugin! Here is an example which takes a live feed from a FireWire camera, layers it over itself on 3 differently coloured layers (red green and blue) and scales in real time based upon audio input from the computer’s built in microphone. Link to livergb.mov. This has been tested in Safari with a Sony HandyCam and my PowerBook’s built in microphone. Here’s the source .qtz file. While live video input into a movie playing in a browser is pretty exciting, unfortunately more simple things like keyboard and mouse input are missing.

Stay tuned for more examples as I play more…

Quartz Composer

Published on May 11, 2005 in Tech, Video and Web. 0 Comments

For me, the coolest new feature of Mac OS 10.4 “Tiger” is an application called Quartz Composer included with ‘Developers Tools’. It allows the user/developer to create patches for the real time generation and manipulation of images using the new Core Image engine via a visual patch based interface.

Quartz Composer shares much of its interface style and function with its predecessor PixelShox, an OpenGL based real time video application a mate of mine Khalid has been using for vj work for a while now. While it is no longer being actively developed (its developer has taken a full time position in the computer graphics field *cough* at apple *cough*), it’s worth a look if you have a Mac and have not moved to 10.4 yet.

Like PixelShox, Quartz Composer has a wide array of live inputs such as mouse and keyboard tracking, MIDI, audio and video inputs. One new input featured in Quartz Composer which has caught my eye is RSS processing using the new Safari RSS engine. While a more generic XML parser would have been preferable I’m sure I can have a lot of fun with RSS alone :-)

Quartz compositions may be incorporated in ‘real’ programs with Cocoa bindings and interfaces built with the ‘inteface builder’ application, used as screen savers (one of the default screen savers included with 10.4 displays the current Apple News RSS feed in an ‘eye candy’ 3d flythrough) and, drumroll…. played in QuickTime Player in 10.4!

QuartzComps has popped up as a blog for sharing and discussing Quartz Composer patches, as has the Apple Quartzcomposer-dev Info Page mail list (see the Mailing List Archives too).

For more info on Core Image, Core Video and Quicktime 7 see this page of ArsTechnica’s excellent and in-depth review of 10.4 – Mac OS X 10.4 Tiger : Page 16

Guess The Google

Published on April 25, 2005 in Web. Closed

Guess The Google

Guess The Google is a flash game which shows you a grid of 20 images from a Google image search for a particular word. You have 20 seconds to correctly identify the search word.

Its very neat and quite addictive but I’d love to see a version which searches flickr or a video sharing site. Also I’d like to see it search for a larger range of words (it seemed to repeat when I replayed).

via jill/txt » guess the google

Naoism : interfearence

Published on March 17, 2005 in Video and Web. Closed

Naoism – interfearence is a very slickly produced flash interactive video work (Jessica Helfand would label its typographic style a disciple of the ‘cult of the scratchy’ a la Seven). The work has a a simple branching structure presenting the user with a short video loop sourced from US archival footage and two choices, “join the party” or “escape from it all”. Each choice triggers the next loop and two more choices. The sound design is perhaps the best aspect of the work, providing a nice distraction from the stop – start nature of the interactivity. Fragments of voices jumble randomly over a beat as the work waits for the user to make their choice.

CocoaMySQL

Published on March 5, 2005 in Tech and Web. Closed

Another very handy little Cocoa program I came across recently is CocoaMySQL. Its basically a graphical user interface (GUI) for accessing MySQL databases. I recently installed WordPress (which stores user account information and more in MySQL) locally on my laptop as an experiment and CocoaMySQL helped demystify the installation process completely. Initially I didn’t really know how such a database worked but after examining it using this program it all started to make sense.

I’m a big fan of these applications which make UNIXy command line processes accessible to the lay-person.

Cocoal.icio.us a del.icio.us client for Mac OS X

Published on March 5, 2005 in Tech and Web. Closed

del.icio.us is a free social bookmarking site which lets you log in, post a URL, a brief description and use ‘tags’ to organise and categorise your links and browse those submitted by others. It even generates RSS feeds of bookmarks for each user. On its own this is very cool, and a good way to keep track of bookmarks across multiple computers / operating systems / locations.

If you happen to be using Mac OS X, Cocoal.icio.us allows you to access and manage your del.icio.us bookmarks, descriptions and tags without having to use a web browser by talking directly to the del.icio.us API (once you’ve told it your username and password). It also features a built in browser preview window, so you can click on a bookmark and to check that you got the URL right etc.

via http://del.icio.us/cnwb/

Google 2004 Zeitgeist Interactive Edition

Published on January 4, 2005 in Design, Tech and Web. Closed

2004 Year-End Google Zeitgeist – Interactive Edition

Re: Vidget 3.5

Published on December 23, 2004 in Note to self, Tech, Video, Vidget - Discussion and Web. Closed

Ok, this version (Vidget 3.5) follows on from previous versions:

Vidget 1

Flickr Image Viewer (Vidget 2), and

Vidget 3

Vidget 3.5 is an experimental interactive audiovisual performance device which allows the user to manipulate video in real time online. As well as mixing a number of video clips together, the user may search for still images from the Flickr photo sharing site and mix them together. For a instructions on usage see previous versions above.

Continue reading ‘Re: Vidget 3.5′