Posted by & filed under CSS, flash, JQuery.

I used to build my carousels in flash, but i seemed a good challenge for me to build a nice looking carousel in jQuery. Of course the carousel should have the same functionality as a flash carousel. Thus said the carousel should get all the content from the html itself, include paging, the possibility for some text over the image and have nice transitions.

I searched the web for available plugins and the jQuery Cycle plugin seemed the best start. The only task left for me was finding a way to display text over the images and style the carousel. The result is astonishing and since the content is html it has a lot of advances over flash, SEO, accesibillity and much easier to implement for backend developers. However flash still has to advantage ( or disadvantage ) that it compiles your code which makes it less easy to copy it.

The result and code ( of the jQuery carousel ) can be found here

Posted by & filed under graduation, Max/MSP, Processing.

After a tough year I finished my graduation project . The result is a browser which translates html and style properties into sounds. Unfortunately it is not possible to make the current application webbased. A lot of research needs to be done to increase the accuracy of the sonification of the web. In the future I hope to post some video’s to demonstrate the working, for now the sonification can be heard here.

Documentation

The full paper

Abstract

Is it possible to make an interpretable sonification of the web? To answer this question the Musical Browser was build, The Musical Browser makes it possible to explore the web, and sent the HTML to the parser. The parser translates this model into data which a sound synthesizer understands. The synthesizer software turns this model into sound. This separation made it easy to experiment with the sonification.

Several tests were conducted with custom created, preselected and random webpages. These test provided a granular approach to interpretation. From webpages with a distinct property, (very dark webpage) to more average webpages (colorful webpage). For the last test predictions were made about webpages after hearing the sonification of these webpages.

The result is that the musical browser’s sonification is interpretable for the HTML tags and some style properties of a webpage. But the sonification is not sufficient to make an exact prediction of the visual display of the webpage.

Posted by & filed under flash, flex.

I always thought that arraycollection were only accessible within Flex. Last week however I needed to access some complex data from a webservice in flash. To access the webservice I used a very handy flash extension, which provided the remoting classes from Flex into flash. The result however contained a ArrayCollections. Luckily I found out that is was perfectly possible to parse the data from the arraycollections into arrays and object. I knew that the result had to contain a Clips Array within each Chapter as you can see in the debugger screenshot. Now in flash I could access these Clips like this

var _chapters_ar:Array = _chapters.list.source;

for( var i:int = 0; i < _chapters_ar.length; i++ )
{
     var _clips_ar:Array =  _chapters_ar[i].Clips.list.source;

     for (var j:int = 0; j < _clips_ar.length; j++)
     {
        ...
}

see screenshot below

debug view in flash

Posted by & filed under graduation, Max/MSP, Processing.

During my graduation project I needed to get a 2 dimensional list from Processing to Max/MSP. I knew my best option was Open Sound Control. First you need to CNMAT objects for Max/MSP, these objects make Max/MSP work with OSC. Processing needs the oscP5 library

OSC does not make it possible to send multidimensional arrays, therefore this only works with multidimensional arrays with the same data type. Now the code, processing sends an Integer array of an index and 4 values.

Processing Code

import oscP5.*;
import netP5.*;

OscP5 oscP5;
NetAddress myRemoteLocation;

void setup()
{
  size(400,400);
  frameRate(25);
  /* start oscP5, listening for incoming messages at port 12000 */
  oscP5 = new OscP5(this,5555);

  myRemoteLocation = new NetAddress("127.0.0.1",5555);
}

void draw()
{
  background(0);
}

void mousePressed()
{
  /* in the following different ways of creating osc messages are shown by example */
  OscMessage myMessage = new OscMessage( "processing" );

  myMessage.add(new int[] { 1, 2000, 1000, 5, 5, 2, 400, 500, 5, 6, 3, 200, 560, 5, 6 }); 

  /* send the message */
  oscP5.send(myMessage, myRemoteLocation);
}

Max/MSP part

Now in Max/MSP we need to update the objects to their maximum buffersize and their maximum listsize. To extract the data we need to slice the list to remove the “processing” String and then divide the list in chunks of 5, the last step is to unpack these object to get to the data.

max msp patch screenshot

As you can see you need to set the buffersize for the OpenSoundControl object in bytes. For the zl object you can set the maximum list size.

update ( 09-03-2010 )
You can download a sample application with a processing patch as well as a max/MSP patch.

Posted by & filed under CSS.

During webdevelopment I have encountered many client with their own jargon, most often with very long words. It was not always possible to prevent long words breaking out of box. A few weeks ago i was testing the possibilities of CSS3 and which tags could be used in most modern browsers, thus excluding IE6. There were few but the cs3 property: word-wrap: break-word; did work. Of course it doesn’t provide you with perfect hyphenation which would be very difficult for all existing languages, but it will keep your layout clean. on the demonstration page.

works in  IE7+, FF 3.5, Chrome 2+