Posts Tagged ‘processing.org’

ProjectedQuads source code

Sunday, January 31st, 2010

ProjectedQuads
On request from several people I decided to finally release source code of my projection mapping projects. I wanted to make a Processing library from it anyway at some point but I delayed it so many times that it might never happen.

Features

- unlimited number of quads
- support for static images and dynamic generative animations
- loading and saving configuration to a text file

Download

ProjectedQuadsTest.zip [7kb]

How to use it?

Let’s say we want to display an image with perspective correction. First declare variables for our image and quad that will display it.

PImage img;
ProjectedQuads projectedQuads;

Then in setup() function load the image, create projectedQuads object, set number of quads and assign textures to them.

void setup() {
img = loadImage("checker.png");
projectedQuads = new ProjectedQuads();
projectedQuads->setNumQuads(1);
projectedQuads.getQuad(0).setTexture(img);
}

All we have to do in draw() function is just call projectedQuads.draw();

void draw() {
projectedQuads.draw();
}

Run the sketch and adjust corners of the quad using mouse or keyboard. Attached example source code explains how to use more quads and display dynamic graphic generated in processing.

Some other projects that I use this code for:

- “3xI” reactive projection mapping during Vivisesja festival. Read more about it on my blog.

3xI

- During Shiftcontrol’s end of they year meeting I did small projections to add some life to the globetrotters pub where it took place.

Projection mapping in 3d

Wednesday, December 9th, 2009

Encouraged by previous results I decided to try to play more. This time in 3D. By 3D I mean projecting on the object in such a way that it looks like you are actually projecting from different sides of it.

2D in 3D – Lets say we want to project a rectangle on one of the sides of a cube. It’s easy when the projector is exactly in front of the target side.

projectin2Din3Da

If not then we will quickly observe a keystone effect. Simply speaking the image will be distorted.

projectin2Din3Db

How to overcome that? We just have to project image that looks like the projector ’sees’ it.

projectin2Din3Dc

Ok. So now we know the theory let’s talk about how to apply it in practice. All I need is some way to distort an image so it looks like a ‘viewed from the side’. There is a Processing library for that, vvvv patch, or even specialized app called VPT (video projection tools) . Non of them allowed me to program my own visuals on arbitrary number of surfaces (and vvvv is Windows only..). So I made my own Processing sketch which for defined number of rectangles displays handles in each corner that can be dragged around to match target geometry.

corner pin mapping

Corner – As a first victim or my new projection I have chosen a corner in our studio.

Cube – After some time I noticed an empty box lying on a desk… guess what I did..

3D in 3D – is projecting 3D graphics on a 3D object. While it can be done it’s quite limited. The problem is that it looks good from only one point of view. As you can see on the image below in case ‘a’ when we are standing in front of the projected surface everything looks good. We can get the feeling of depth and so on. But immediately once we start moving more to the left or right and viewing angle increases the image becomes more and more flat – case ‘b’. The last case ‘c’ shows what would we expect

fake3d

I had one attempt to display something 3D but it wasn’t very successful to I decided to spend my time tweaking my 2D code.

IMG_0385_3d_in_3d

More examples? Look here or here.

Projection mapping in the office

Saturday, December 5th, 2009

Projection mapping is making projections in a way that they match the surface they are projected on. This way we can use projector for something much more interesting than flat powerpoint presentation like VJ projections. As I was invited for vivisesja this year I decided to play a bit with Processing and see what I can do during two weekends.

2D in 2D – This is how I call projecting 2D graphics on flat (or almost flat) surface. We have some cool pipes going across room and wall in our studio so I chose them as my projection target.

Equalizer – first test was simple. I have audio reactive bars and I want to project them so they match the pipes. How to do that? I made a sketch that displays 4 rectangles. I was doing it by hand in code so I spend some time to make them match the pipes perfectly. This gave me a mask that I could use for limiting projection only to the pipes. Having positions of the rectangles I programmed animated bars so they matched this positions. Results were super good, as expected :)

equalizer

The only trick here is to adjust projector brightness so the black is invisible on the wall.

Sunset – it’s time for some magic. What would happen if we invert the mask so we project everywhere beside the pipes?

sun

People usually say that’s the best one of my first tests. It’s somehow counter intuitive and surprising when watched for the first time.

The only issue with this one is that when observed from a side you get shadows from the pipes so it doesn’t look so good anymore.

sun_shadow

Sunset – this time I wanted to play with some more complex mask and couch next to the pipes looked like a perfect target. I took a photo of the couch, draw an outline of it, filled the shape with white and projected it back on the couch.

stars

Of course my shape wasn’t perfect so I had to retouch it a bit to remove all the gaps. I made a Processing sketch that was constantly reloading the image for projection so every time I pressed Cmd+S I was able to see the changes almost realtime.

Want more (especially large scale) projection mapping examples? Look at this, this, this and this.

MSAFluid and motion tracking

Wednesday, June 3rd, 2009

Recently I did small interactive installation together with shiftcontrol and Obscura at Re-New festival in Copenhagen. We used MSAFluid solver for processing and custom application for motion tracking done in OpenFrameworks.

Here is the video:

Some screenshots from motion tracker:
picture-11b
picture-4

We used IR camera and some IR light from behind to improve the tracking. I found some interesting issues like that jeans doesn’t reflect IR light. Strange..

Anyway it was nice to play a bit with projections in the public space. Next time will be better.

Standing On The Shoulders of Giants

Monday, May 4th, 2009

3362680746_95d46d884f

Last month I was helping Jacob Sikker Remin with his first solo exhibition.

First thing was to program light tubes animation. Jacob constructed a cube out of them I asked I we can program them so they light moves like in a snake game. Hmm. Sure :) After 2 hours I had a prototype in Processing.

picture-4

Then we ported it to Arduino so he can install stand alone version at the exhibition. The results were amazing. I wish I was there..

sotsog2-253

3486477879_c01ac990ff_o

sotsog2-35

Next I was given a piece of text by Jacob that he wrote after being inspired by Enzio Manzini lecture on future of design. My task was to automate process of filing screen with a sentence and make an animation out of this sequences. Here is the result mixed with music, drawings and animation contributed by Jacob’s friends and his wife:

That later was remixed by Rosa Menkman into this:

sotsog2-18

You can find more photos in Jacob’s flickr set :
standing on the shoulders of giants – exhibit pics.

OpenProcessing.org

Sunday, March 8th, 2009

openprocessing-sml

OpenProcessing is a ‘flickr’ish place for Processing addicted generation.

I have some old sketches waiting to be shown to the world so today I decided to join that crowd. Here is my gallery : Portfolio of Marcin Ignac at OpenProcessing.org.

vorg-at-openprocessing

It’s nice that you can watch the sketches in you browser and even download source code. Have fun!

TUI exhibition

Wednesday, February 4th, 2009

At the end of the Tangible User Interface course there was an exhibition as always. Almost half of our class didn’t sleep that night to get our stuff done but it was worth it :)

3247678462_177a828b52_o

In the final show we used three laptops with two webcams connected to each of them. All networked together via WiFi and connected to the beamer projecting images on the wall.

11111-3246851625_9563a904fd_o

People liked it much more than I expected. They played with the cameras, experimented with them and used them to spy other people.

111111-3247681476_d836553223_o

3246852469_c8d3990da7_o

11111-3242247781_39871d707c_o

I was really happy after the show. Much more than the day before :)

Tangible User Interfaces – networked cameras

Sunday, February 1st, 2009

Uff. TUI course is over. It was a long month with a lot of work and many moments of frustration.

We spent first week on concept development. Initially we had a lot of problems figuring out what we really wanted do. Before starting this course I thought that we will be working on some multitouch or reactable stuff. But to my surprise brief for this course forbad us from using screens in our projects. Hmmmmmmm.

Also during the first week we were introduced to laser cutter.

img_0651

This wonderful machine can cut any shape you can imagine and draw in a vector graphics program from paper, cardboard and even plexi glass up to 5mm. It can also engrave on wood and aluminum.

img_0653

img_0661

We had a lot ideas, some bad and boring, other even worse. Finally after looking for inspiration in nature we decided to create object that can work on their own but at the same time they are part of a bigger group. Something like insects. This way idea of networked cameras was born. Project code name “many eyes”. It was a simple idea. We have several cameras, when you click one of them, every other camera takes a photo at the same time. As we experienced later, simplest ideas a hardest to implement…

3211902203_f708762086_o

To better explain our idea during reviews in the end of the week we quickly developed some scenarios (drawings by Ujjval) :

3247722678_524ded9ae3_o

3246892761_cea9a7a5af_o

3247722920_0c0918c5c0_o

During second week we focused on refining our idea and building an experience prototype.

I started by programming a Flash web application.

3212745830_eb5c675f81_o_001_21

You opened a web page that displayed a live capture from your webcam. When you pressed a button a picture was taken on each computer viewing this page at this time. Pictures were saved and send to the server where you could watch them on another site. We did some test and even tried to shoot matrix like photos but laptops are too big and too clunky to fully convey the experience.

3212746078_cb3d6c8387_o_001_2

A the same time Ujjval (we were together in a team) prepared some wooden mockups.

3212746932_410b81549e_o

If they were small enough they could be even wearable. Imagine these crazy photos if you could take it with you to the party :)

3211901671_9acd03b1ea_o_001

If you think they are too small to be possible to create look at this chewing gum sized camera.

Ujjal also taught me how to make an origami camera. If you want to make one for yourself here is a tutorial on Flickr : Origami camera.

3212749144_ddbe6607fd_o

Another way to simulate the experience was to use already existing cameras. So we decided to use several SLR cameras to trigger photos by using remote controls. Original remote controls are quite expensive so we built our own :) You need just a couple of wires and optocoupler. After a few minutes of experimenting and checking which pins in remote control plug do what we need we ended up with this:

3211902429_888fac5249_o

In the final test we had two Arduino boards talking to each other wirelessly. One with button and second one connected to the ‘remote control’. It worked :)

It was end of second week and we still weren’t happy with our idea.

P3 Guld

Monday, January 26th, 2009

Last Friday in cooperation with copenhagen based shiftcontrol studio I played as a VJ during danish public radio P3 music award show! This was my second time as a VJ and it was a big one :]

img_2916

During the last week we prepared two applications in Processing. Jørgen was playing during Mike Sheridan show:

Jorgen playing during Mike Sheridans act.
Mike Sheridan

I was playing during The Wong Boys show.

Vorg playing during The Wong Boys show.
The Wong Boys shot

I will post better photos and videos in next couple of days but you can already watch P3 Guld ceremony on DR website.

Monome

Monday, November 3rd, 2008

Monome is a very well refined piece of electronic. It’s a simple matrix 8×8 buttons highlighted by LED’s that is fully programmable. You can use it as as toy, midi controller or whatever you like :) Here is a Pong game made in 20min.