Hello!

I'm trying to make an exploding text. Right now i attach a single letter to a growing ellipse, in the moment the ellipse is "touching" the letter. The effect looks nice, but it looks not very natural. My code:

 for(int i=0; i < headline_new.length(); i++) {


   myPosX[i] = count*cos(TWO_PI/headline_new.length()*i); // Kreis erstellen
   myPosY[i] = count*sin(TWO_PI/headline_new.length()*i);
   noFill();

   
   stroke(#b8bddd);

   if(dist(width/2, height/2, width/2-(headline_new.length()/2)*10+i*10, height/2) == count) { // Wenn der Buchstabe auf dem Kreis liegt...
   letters_status[i] = true;
   }
   
   if (letters_status[i] == true) { // Text an den Kreis heften
   pushMatrix();
   translate(myPosX[i]+width/2, myPosY[i]+height/2);
   fill(#b8bddd, random(30,100));
   text(letters_new[i], random(0,2), random(0,2));
   popMatrix();
   }
   
   else { // Text stehen lassen
   pushMatrix();
   translate(width/2-(headline_new.length()/2)*10+i*10, height/2);
   fill(#b8bddd, random(30,100));
   text(letters_new[i], random(0,2), random(0,2));
   popMatrix();
   }}
 
 count = count + 0.25f; // Counter hochzählen
 if (count >= 600) {
   count = 1;
 }

Anyone got a better solution for this problem?

Greets

The sketch seems not to run online, so here's the full code:

String headline_new = "Es gibt etwas zu Essen!";
String letters_new[] = new String[500]; // Array fŸr die Buchstabenkette

PFont fontRegular;
float count = 1; //Counter anlegen

boolean letters_status[] = new boolean[500];

float [] myPosX = new float[500]; //Array fŸr die Position der Buchstaben
float [] myPosY = new float[500];

void setup() {  

   size(600, 400);  // Grš§e festlegen, Vollbild

   fontRegular = createFont("Monaco", 16); // RegulŠre Schrift Festlegen, Monospace
   textFont(fontRegular);
   smooth();
   
   headline_new = headline_new.toUpperCase();
   for(int i=0; i < headline_new.length(); i++) {
   letters_new[i] = headline_new.substring(i,i+1);
 }
}  

void draw() {
 background(#364d76);

 for(int i=0; i < headline_new.length(); i++) {


   myPosX[i] = count*cos(TWO_PI/headline_new.length()*i); // Kreis erstellen
   myPosY[i] = count*sin(TWO_PI/headline_new.length()*i);
   noFill();

   
   stroke(#b8bddd);

   if(dist(400, 200, 400-(headline_new.length()/2)*10+i*10, 200) == count) { // Wenn der Buchstabe auf dem Kreis liegt...
   letters_status[i] = true;
   }
   
   if (letters_status[i] == true) { // Text an den Kreis heften
   pushMatrix();
   translate(myPosX[i]+400, myPosY[i]+200);
   fill(#b8bddd, random(30,100));
   text(letters_new[i], random(0,2), random(0,2));
   popMatrix();
   }
   
   else { // Text stehen lassen
   pushMatrix();
   translate(400-(headline_new.length()/2)*10+i*10, 200);
   fill(#b8bddd, random(30,100));
   text(letters_new[i], random(0,2), random(0,2));
   popMatrix();
   }}
 
 count = count + 0.25f; // Counter hochzŠhlen
 if (count >= 600) {
   count = 1;
 }
}

You might want to use particles. Physics http://www.cs.princeton.edu/~traer/physics/ is quite a cool library. I used it to make words contract and expand.

I posted an example at http://vimeo.com/627948. I guess it's very well possible to have movement that's more like an explosion.

The video should be public now.

Just a few words, in case you might wonder. There are a number of fixed particles at the positions where the letters come together in the center. All the other particles are non-fixed and each has an attraction to one of the fixed ones. Depending on the mode, they move towards the center (contract) or away (expand). The letters are then rendered at the positions of the (non-fixed) particles.

Cheers
Nadja

thanks for your replies. i played around with traer.physics a bit, and i seem got get the results i wanted. yeah!

greets from berlin