light chasm from lukasz on Vimeo.

had the pleasure to team up with the very talented robyn whispers to collaborate on a audio / visual performance. we only had a week to prepare and decided to go with a black and white, op-artish theme for the projection visuals, matched with robyn’s very striking black and white attire which during the performance became part of the projection surface.

i wanted to create a custom vj app for the performance and have been getting more proficient in openframeworks so decided to give it a go as a technical and creative challenge. i began by coding the basic visual elements such as the black and white sun rays, the checkered background and playing around with blend modes in opengl. it took me a good 2 hours to work out how to do inverse blending… no reference for it anywhere! so here it is,

glEnable( GL_BLEND );
glBlendFunc( GL_ONE_MINUS_DST_COLOR, GL_ONE_MINUS_SRC_COLOR );
// draw your shapes here.
glDisable( GL_BLEND );

i wanted to control the visuals through my iphone via OSC, that way i could put my laptop away and become part of the crowd… so i wrote a wrapper class for OSCemote (an OSC iphone application) that told my program what buttons were being pressed and the slider values. hope to extend it further for accelerometer values which i think will be far more interesting way of controlling visuals and with the possibility of using body movements in a performance to react visuals.

next i plugged in some FFT classes from the openframeworks forum and viola, audio-reactive visuals. it goes to show the maturity of openframeworks where you can grab a bunch of classes created by the community and plug them straight in without any hassle.

here is the source if any one is interested in running it, made for of_0.06

really enjoyed building vj software from scratch just because you have so much more control over what you can make. im now toying with the idea of taking it further and creating a nodel based interface, so something like quartz composer or pure data interface but for openframeworks. the mind boggles…

bowie cam from lukasz on Vimeo.

the back story is… some friends at the world’s end studio have a biegel named david bowie and it jumped out of a 2 storys window and broke its leg. the dog that thought it could fly… so they put on a david bowie fund raiser party for the pooch’s operation.

ive been itching to get my face tracking projections out there and thought the night was a good opportunity to do something quick and fun. bowie cam is just that… it pastes a face of david bowie over yours so you can get down just like the freaky old bastard. there a four face mask modes it cycles through – two of mr bowie, one being of the pooch and a ziggy lighting bolt across the face. the interactive projection was good fun and people got it straight away, although i suspect some people were just happy to see themselves on the big screen.

it was also a good lesson never to depend on venue lighting. for those that have been to q-bar in sydney will know that its a pretty dark venue, something out of a david lynch film with all the red lighting. so had to improvise and mount a lamp to expose people in front of the camera a little better. even then, it was a fine line… if they got too close, their faces were washed out and the haar finder was unable to pick up their features and when they got too far, they would disapear into the shadows. so i think overall the accuracy of the face tracking was down to about 20% of its normal accuracy. still, good to try it out in the wild.

get the ofxCvHaarTracker source for openframeworks with example.

Time Bomb – Interactive Graffiti (StupidKrap & Holler) from Mike Hill on Vimeo.

timebomb is an interactive graffiti installation that I collaborated on with Maddi Boyd (KissKiss) from StupidKrap. check out the promo video to see what its all about…

here’s a little technical insight into the project.

the timebomb application is based on memo’s fluid dynamics library for openframeworks, ofxmsafluid. its a fantastic opensource library that memo has done a lot of amazing things with and i’ve been able to use it as the basis for fluid time distortion.
interaction input comes from a webcam, the live feed is analysed and used to create ripples in a fluid image. those fluid values are then applied to the pixels of a video, the pure white pixel (0xFF) equals a pixel taken from the top frame of the video and a black pixel (0×00) equals a pixel taken from the bottom frame of the video, all other shades of grey represent pixels between the first and last frame. confused? well hopefully the video of the debug screen will explain it better.

the video on the top left is the actual time-lapse we shot over 5 days.
next to it is the final output with time distortion applied to it.
all other frames below show the camera input and the ripples created in a black and white fluid image.

timebomb debug from lukasz on Vimeo.

here is the final effect on its own.
this is what is going to be projected onto a blank canvas at the exhibition.
people will be able to time-distort the graffiti piece through their body movements and uncover the hidden layers that lay beneath the surface of the finished piece.

timebomb from lukasz on Vimeo.

crimcam from lukasz on Vimeo.

people usually experience seeing their own image either in the photos or video and almost always in a positive and social context. i wanted to bring the viewer into a more sinister and perhaps more confronting environment, to allow them to see themselves in a negative context and to suggest they are not as happy and innocent as they portray themselves to be.

crimcam was built using openframeworks and openCV which makes it possible to perform motion tracking, blob tracking, face detection.

will be posting the source shortly.

@julapy

my two favorite things, abstract geometry and audio reactive visuals.
working on the new beck’s beer site was a treat with a great base design and massive scope for innovation.

i won’t bang on about the creation process but i will say that the cube was modeled using blender, exported as a DAE file, painlessly plugged into papervision and off we went…
if you are new to blender like i was i recommend reading through the manual, its the best place to start and will allow you to tinker and create as you are learning.

had a few days spare towards the end of the project so thought it would be nice to add an audio reactive element to the site. it is the beck’s beer brand and it is heavily associated with electronic music so i reproduced the geometry of the cube segments and added them to a 3d backdrop layer… the space junk fragments float in darkness, illuminated and pushed on by the beat of the music.

still trying to work out what to make open source from this project so if theres anything you’d like me to release, please let me know and ill do my best to post it on here.

on the weekend i started working on my latest piece in processing titled cilindrico collapse. had a good run, getting everything done i had planned to do. main things were, coding the 3D motif which ive named arc bars, and after many painful attempts ive finally worked out how to use pure opengl lights inside a processing sketch. so now i can have all the pretty shapes and colours, with shading!

ive also inculded the ability to export the sketch to a amazingly large proportions using marius watz’s tile saver class. perfect if you want to print your work.

thought id make the source code available now, before it gets messy with experimentation.
you will also need toxiclibs to get it running.
enjoy.

had the opportunity to exhibit the latest dear samantha work at the dark hall exhibition yesterday as part of the glorious undead festival. marcel and bronwyn did a great job transforming the kudos gallery into a forest of digital glow spotted with iridescent installations. the most impressive was a sculptural video installation by daniel kirkwood titled ‘dc city, glistening (a seasonal cycle)‘ using projection mapping, shown in the gif animation above. i’ve seen a lot of projection mapping on the interweb but this was the first time to witness it first hand and it was a real treat.
have to try it out myself very soon.

lately ive teamed up with a photographer and a good friend of mine, sebastian andrews, for an ongoing side project. we’ve talked about doing something together for years but our interestes were difficult to converge unti we finally discovered stereography which has become the middle ground for both our work and a exciting collaboration.

stereography involves taking two photos from slightly different angles and switching between them to give the impression of 3D. the technique is very striking. it breathes life into a still image. i fell in love with it when i stumbled upon the cursive buildings blog which i have to give props to as it opened my eyes to the different possibilities of simple two frame animations.
suddenly the ol’ gif wasn’t so daggy anymore.

in our stereo images we like to capture subtle movements that compliment conventional still photography. it is a way of reminding the viewer that this is not only a flat image but also a time and place. coincidently we are beings with two eyes that allow us to judge distances and i suppose stereography makes sense to the brain… it exposes another layer that enriches the image with not only perspective information but also style. focus can be shifted towards or away from a subject… it is another parameter to play with and one that can create powerful results.

so cutting the ribbon, here is the hub to our stereography work.

http://www.dearsamantha.com/

id also like to draw your attention to the wordpress theme, lovelly isn’t it?
churned it out one night… tinkering with with css and the wordpress api.
wanted something very minimal so it didn’t take away from the content, also wanted to list every post in the left navigation bar since i like the idea of showing all the work all at once.

bookmark it. rss it. subscribe to the mailing list.
oodles of stereo images to come!

6beersofseparation.com.au has scored a FWA!!!
ever since i got into flash ive always wanted one of these… and its nice to finally have one next to your name.
although it has been a team effort from holler sydney and our second FWA in the 2 years we’ve been going.
alright!

in short, they allow for intuitive rotation around each axis.
normally if you rotate around one axis and then around another, you get a combination of those two rotations and its not really where you want to be.
quaternions allow to rotate around each axis without effecting the rotation of the other axis, so imagine a orientating a aeroplane model in a 3D flying game…
an aeroplane can be rotated around each axis and these angles are referred to as roll (x-axis), pitch (y-axis) and yaw (z-axis).

roll is then the aeroplane direction moving up and down.
pitch is the aeroplane direction moving left to right.
and yaw is the aeroplane swaying from side to side.

so finally worked out the mathematics behind this by reverse engineering some existing arcball code.
below is the processing implementation done with pure opengl, it is using some handy classes in toxi’s geomutils.

the steps are,
1) work out the rotation vectors around each axis, simply by rotating the vector around an axis.
2) work out the rotation quaternion for each axis, by getting the dot and cross product of each rotation vector from its origin.
3) multiply the rotation quaternions of each axis. – this will give you the overall rotation quaternion.
4) convert the rotation quaternion into a matrix and apply that rotation matrix.
5) draw your aeroplane! done.

			float DEGTORAD = PI / 180;

			Vec3D xrot, yrot, zrot;
			Quaternion xrotQuat, yrotQuat, zrotQuat, rotQuat;
			Matrix4x4 m;
			float angleX, angleY, angleZ;

			angleX = angleDegreesX * DEGTORAD;
			angleY = angleDegreesY * DEGTORAD;
			angleZ = angleDegreesZ * DEGTORAD;

			xrot = Vec3D.Z_AXIS.copy().rotateX( angleX );
			yrot = Vec3D.X_AXIS.copy().rotateY( angleY );
			zrot = Vec3D.X_AXIS.copy().rotateZ( angleZ );

			xrotQuat = new Quaternion( 1, new Vec3D( 0, 0, 0 ) );
			xrotQuat.set( xrot.dot( Vec3D.Z_AXIS.copy() ), xrot.cross( Vec3D.Z_AXIS.copy() ) );

			yrotQuat = new Quaternion( 1, new Vec3D( 0, 0, 0 ) );
			yrotQuat.set( yrot.dot( Vec3D.X_AXIS.copy() ), yrot.cross( Vec3D.X_AXIS.copy() ) );

			zrotQuat = new Quaternion( 1, new Vec3D( 0, 0, 0 ) );
			zrotQuat.set( zrot.dot( Vec3D.X_AXIS.copy() ), zrot.cross( Vec3D.X_AXIS.copy() ) );

			rotQuat = xrotQuat.multiply( yrotQuat ).multiply( zrotQuat );
			m		= rotQuat.getMatrix();

			FloatBuffer rotMatrix;
			rotMatrix = ByteBuffer.allocateDirect(4 * 4 * 4).order(ByteOrder.nativeOrder()).asFloatBuffer();
			rotMatrix.put
			(
				new float[]
				{
					(float)m.matrix[0][0], (float)m.matrix[0][1], (float)m.matrix[0][2], (float)m.matrix[0][3],
					(float)m.matrix[1][0], (float)m.matrix[1][1], (float)m.matrix[1][2], (float)m.matrix[1][3],
					(float)m.matrix[2][0], (float)m.matrix[2][1], (float)m.matrix[2][2], (float)m.matrix[2][3],
					(float)m.matrix[3][0], (float)m.matrix[3][1], (float)m.matrix[3][2], (float)m.matrix[3][3]
				}
			);
			rotMatrix.flip();

			gl.glPushMatrix();

			gl.glTranslatef( loc.x, loc.y, loc.z );
			gl.glMultMatrixf( rotMatrix );
			gl.glTranslatef( -loc.x, -loc.y, -loc.z );

			// draw here.

			gl.glPopMatrix();