Particles Typography (3D Version) - Goodthink - Code and experiments

Particles Typography (3D Version)

A 3D version of the particle typography sketch.

You can type text and tweak different parameters in real time. The possibilities seems endless, every different combinations between colors, typeface, gravity, particles attractions, blending modes, glRender modes, etc, etc.. produce different results, I could keep playing with it for hours.
The algorithmic is not really complex (outline the text, extrude, attach a 3D model to each particles) what makes it fun is the parameters.

Here’s the video, the footage are real time captures the only editing done was adding the title at the beginning and the music.
Vimeo definitely doesn’t do a good job while encoding thin lines, gradients, etc… So if you’re interested in the video please watch it in HD on Vimeo. Or even better you can download a HD quality mp4 here (100Mb)

And those are the screenshots.

Same images with higher resolution on Dropbox

The libraries used are Traer Particles + Geomerative
Check this post for more details and sources.

Published on October 1, 2012 11:24 am.
Filed under: Code Tags: 3D, Geomerative, P5, particles, Processing, traer, Typography

No Comments

Sorry, the comment form is closed at this time.

thumb_sorting

Sorting Norway

Another pixel sorting experiment, visit this post for similar sketches
Details »

Published on February 6, 2013 11:10 pm.
Filed under: Code, Video Tags: P5, pixelsorting, Processing, video

thumb_instableed

Instableed

This sketch is based on Kim Asendorf‘s pixel sorting algorithm. Photos are loaded from Instagram based on a set of hashtags, music is just an MP3 played through minim (Processing library) and the rest is generated in realtime by the program, in a similar way than this post. Scroll down for a bunch of content…

Published on February 1, 2013 1:24 am.
Filed under: Code, Video Tags: instagram, Processing, video

thumb_slit_scan

Slit Scanning

Some test made with a processing sketch by Amnon Owed

Published on January 28, 2013 8:17 am.
Filed under: Code, Video Tags: P5, Processing, slitscanning

thumb_ltdo

Let The Dog Out – Instagram Mosh!

Here’s a new processing experiment, my first try to make a messy dirty rendering, it was very relaxing and fun to program since the only thing you want to do is fuck things up as much as possible!! The original inspiration come from that post

Published on December 22, 2012 11:19 pm.
Filed under: Code, Video Tags: Generative Design, GLSL, P5, Processing, Shaders

thumb_jungle_book_310

Jungle Book Puppets (Kinect Skeleton Tracking)

A bit of a different post here. My daughter really likes the jungle book and especially the dance scene in the temple ( http://youtu.be/O3Le7yqCOSY ) so I wanted to make a test and try to control a puppet with the Kinect so that she could eventually dance with Mowgli or Baloo or something when she’ll walk at some point.

Published on October 1, 2012 1:12 pm.
Filed under: Code Tags: Kinect, P5, Processing, Puppets

thumb_particles_type04

Particles Typography (3D Version)

A 3D version of the particle typography sketch.

Published on October 1, 2012 11:24 am.
Filed under: Code Tags: 3D, Geomerative, P5, particles, Processing, traer, Typography

thumb_particles_type01

Particles Typography

Small program done in processing to generate text out of particles. Real time text input and different options to change physics, images, fonts, etc, etc…
The libraries used are Traer Particles + Geomerative

Published on September 27, 2012 8:55 am.
Filed under: Code Tags: Geomerative, P5, particles, Processing, traer, Typography

thumb_kinect_scary

Scary Kinect

Another messy experiment done with processing and Kinect in OpenGL.
Details »

Published on August 12, 2012 10:07 am.
Filed under: Code Tags: 3D, GLGraphics, Kinect, P5, Processing

thumb_funkynect_vs_darknect

Funky, Darky, Nect

This is my first attempt to play with openGL and Kinect data. The result is rather wild and intriguing… This sketch by itself is kind of pointless but opens some interesting doors for later; The GLGraphics library by Andres Colubri work wonderfully well and it really multiplies the possibilities of Processing. I will definitely dig deeper and try to make something a bit more “clean” with it :-) For example integrating different materials, play with different 3D shapes (spheres, proper quad_stripes and triangle_stripes, triangles mesh, etc…). make the shape / colors responsive to music / movements, improve the behavior of the 3D shapes, etc, etc… The result of the lighting is very interesting as well.

Published on August 1, 2012 10:56 pm.
Filed under: Code Tags: 3D, GLGraphics, Kinect, P5, Processing

thumb_touchOSC

iPad Grid Led display (OSC)

I’ve been playing around a bit with touchOSC and processing and tried to build a small led grid display on the iPad. The program is communicating with touchOSC on the iPad through oscP5 library: Processing is loading the image displayed on the screen, extract the greyscale values for each pixel and send it to the iPad, nothing very challenging. The only issue was that touchOSC is “loosing” a lot of messages when receiving, and the bundle system is not working very well. It is clearly more useful and reliable to use touchOSC as a controller to send message (to control processing variables) than to try to receive a big amount of messages with it.

Published on July 26, 2012 2:51 pm.
Filed under: Code Tags: iPad, OSC, P5, Processing, touchOSC

thumb_sag

Sagmeisterizer

A little sketch in reference to this project by Stefan Sagmeister. I tried to make a program that generate something similar. I originally wanted to make it run in real time (i.e: you type a letter and it appears on the screen instantly) but to achieve a result close to the original work of Stefan Sagmeister, each letter have to be scaled and smoothed to make them more round; The smoothing part is quite CPU intensive (see explanations below). I made a few experiments based on that sketch afterward where it was not a problem at all to render everything in real time (check them here) but for that one it’s a bit of a b****.

Published on July 16, 2012 9:32 am.
Filed under: Code Tags: Generative Design, Geomerative, P5, Processing, Stefan Sagmeister, Typography

thumb_video_effect_01

Video Effect – Movie

This program is also running some effects on a video stream, in this particular case it’s a video playing but it can also be the webcam feed (see this post)

Like the other post the program divides the image in pixel grids then each pixel have parameters that can be controlled (scaling, x y position of each corner of the polygon, fading speed, filled / outlined, etc…)

Published on July 2, 2012 5:50 pm.
Filed under: Code, Video Tags: Generative Design, Processing, video

thumb_webcam_effect_02

Video Effect – Webcam

Alright so this program is running some effects on a video stream, in this particular case it’s the webcam feed but it can also be a video playing (see this post)

It doesn’t do anything complicated: dividing the image in pixel grids then each pixel have parameters that can be controlled (scaling, x y position of each corner of the polygon, fading speed, filled / outlined, etc…) basically a sum of effects put together make pretty tripping and unexpected results, as it’s often the case while playing with Processing. I plan to dig deeper on that one as well, an interesting effect to explore is to have each “pixel” or rather each polygon, act as intelligent agents with some rules and behaviors, on that particular sketch the only rule they follow is to go in one of 8 directions, but we can do much more interesting things than that. We could also play with gradients, alpha, and overlay effects, etc, etc… endless ;-)

Published on July 1, 2012 8:27 pm.
Filed under: Code, Video Tags: Generative Design, Processing, video

thumb_text_exp_07

Type Experiments

Some experiments related to the Sagmeisterizer (see this post)

The text typed on the keyboard is converted in polygons (with Geomerative lib.) then we use the coordinate of each point of the polygon to update the vertices of a GLModel (GLGraphics lib.) that we then copy and scale along the z axis. Add a bit of random and stuff and here you go… There is a lot more to do with this sketch (as usual) I should parametrize some variables so that they can be altered in realtime with the keyboard or the mouse, play more with colors, etc, etc… But as the title state this is just an experiment! :-P

Published on June 25, 2012 10:43 am.
Filed under: Code Tags: 3D, Geomerative, GLGraphics, P5, Processing, Typography

thumb_kinect_02

Kinect Sound Visualizer

A first version of a visualizer for the Kinect that react to the sound. It generates, lines, stripes, dots, 3D shapes (spheres, cubes) etc… Some parameters of the shapes vary according to the music.

Published on April 22, 2012 12:48 pm.
Filed under: Code Tags: Kinect, P5, Processing

thumb_kinect_01

Kinect Tracking

Here’s a basic sketch to experiment with 3D tracking with Kinect and Processing.

Nothing complicated: once the user is calibrated the camera is focusing on him and switching focus point every 5 seconds. Focus points can be any joints of the 3D skeleton (head, torso, hips, hand, etc…). After each change of focus the camera then makes a random motion (dolly, pan, zoom, etc…). If the user is detected but not calibrated the camera focuses on the user’s center of mass, if the user is neither detected nor calibrated then the camera focuses few meters away in front of the Kinect.

Published on April 12, 2012 11:28 am.
Filed under: Code Tags: 3D, Kinect, P5, Processing

thumb_3D

3D (very) simple test

Just a simple test to compare the performances of native 3D render and Andres Colubri GLGraphics library.

The program displays 500 ‘shaking’ spheres with 3 different light types:

Directional
Point-light
Spot-light

Point-light and Spot-light are following mouseX and Y.

Published on February 16, 2012 10:35 am.
Filed under: Code Tags: 3D, GLGraphics, Processing