Animación inicial

float size = 1;
int etapa = 0;
int cont = 0;
int contarmenu = 0;

void setup(){
  size(400,400);
  textAlign(CENTER,CENTER);
}

void draw(){
  animacion();
}

void animacion(){
    if(etapa == 0){
    fill(204,255,255);
    noStroke();
    rect(0,0,width,height);
    stroke(0);
    textAlign(CENTER,CENTER);
    fill(0);
    textSize(size);

    text("Fractals, multiplication \ntables and light rays:\na Mandelbrot's tale",200,200);
    if(size < 30) size+=0.5;
    if(size == 30){
      etapa = 1;
      delay(1000);
    }
  }
  if(etapa == 1){
    fill(255,15);
    noStroke();
    rect(0,0,width,height);
    stroke(0);
    cont += 1;
    if(cont == 130){
      etapa = 2;
      //delay(1000);
    }
  }
  if(etapa == 2){
    fill(204,255,255);
    noStroke();
    rect(0,0,width,height);
    stroke(0);
    fill(0);
    textSize(30);
    text("¿Qué es un fractal?",width/2,50);
    textSize(10);
    text("Un fractal es un objeto geométrico cuya estructura básica,\nfragmentada o aparentemente irregular,se repite\n a diferentes escalas.\n\nEl propio término fue acuñado por\nBenoît Mandelbrot, cuyo fractal\nveremos en este programa",width/2,170);
    textSize(12);
    text("En el caso del Conjunto de Mandelbrot,\nse define fácilmente con una fórmula:\nz(n-1) = z(n)² + C,\ndonde C es el número complejo que queremos conocer\nsi pertenece al conjunto o no.",width/2,300);
    textSize(9);
    text("(Pulsa cualquier tecla para continuar)",width/2,390);
    if(contarmenu == 1){
      background(204,255,255);
      textSize(12);
      text("Existen infinitos conjuntos de Mandelbrot\ndependiendo del exponente que uses a la hora de calcularlo.\nAunque el general es con exponente 2,\nse puede generalizar la fórmula.",width/2,height/4);
      textSize(13);
      text("Si buscas en Google podrás encontrar fácilmente\nimágenes de cualquier conjunto general\n de Mandelbrot.",width/2,250);
      textSize(9);
      text("(Pulsa cualquier tecla para continuar)",width/2,390);
    }
    if(contarmenu == 2){
      etapa = 3;
      contarmenu = 0;
      delay(200);

    }
  }
  if(etapa == 3){
    fill(204,255,255);
    noStroke();
    rect(0,0,width,height);
    stroke(0);
    fill(0);
    textSize(30);
    text("¿Qué son las tablas\nde multiplicar?",width/2,100);
    textSize(13);
    text("Es broma...\nimagino que a estas las conocerás.\nPero, ¿alguna vez te has preguntado\nqué pasaría si las representáramos\ngráficamente?",width/2,230);
    textSize(9);
    text("(Pulsa cualquier tecla para continuar)",width/2,390);
    if(contarmenu == 1){
      background(204,255,255);
      textSize(20);
      text("Para ello, dividiremos en varias partes\niguales un círculo como este:",width/2,60);
      noFill();
      circle(200,150,80);
      text("Por ejemplo:",width/2,230);

      circle(200,300,80);
      fill(0);
      circle(200,260,4);
      circle(200,340,4);
      circle(240,300,4);
      circle(160,300,4);
      textSize(9);
      text("(Pulsa cualquier tecla para continuar)",width/2,390);
    }
    if(contarmenu == 2){
      background(204,255,255);
      textSize(12);
      text("Y luego uniremos cada punto\n con su correspondiente según\nla tabla que elijamos.",width/2,100);
      text("Por ejemplo:\nSi hiciéramos la tabla del 2 con 4 nodos\nel 1 se uniría con el 2,\nel 2 se uniría con el 4,\nel 3 con el 6\n y el 4 con el 8.\n\nAunque solo se divida en 4 nodos,\npodremos calcular dónde caerían el 6 y el 8\npor geometría.",width/2,250);
      textSize(9);
      text("(Pulsa cualquier tecla para continuar)",width/2,390);
    }
    if(contarmenu == 3){
      background(204,255,255);
      textSize(13);
      text("Tranquilo si no estás entendiendo nada...\nPronto lo verás en acción y entenderás todo.",width/2,height/2);
      textSize(9);
      text("(Pulsa cualquier tecla para continuar)",width/2,390);
    }
    if(contarmenu == 4){
      etapa = 4;
      contarmenu = 0;
    }
  }
  if(etapa == 4){
    fill(204,255,255);
    noStroke();
    rect(0,0,width,height);
    stroke(0);
    fill(0);
    textSize(30);
    text("Por último...\nRayos y reflexión.",width/2,80);
    textSize(13);
    text("Como tal vez conozcas si has estudiado\nalgo de física, cuando un rayo incide en\n una superficie se refleja con el mismo\nángulo con el que ha incidido\nrespecto a la normal, tal que así:",width/2,210);
    pushMatrix();
    translate(200,320);
    strokeWeight(2);
    line(-50,0,50,0);
    strokeWeight(1);
    stroke(0,0,255);
    arrow(-30,-40,0,0);
    stroke(255,0,0);
    arrow(0,0,30,-40);
    stroke(0);

    popMatrix();
    textSize(9);
    text("(Pulsa cualquier tecla para continuar)",width/2,390);
    if(contarmenu == 1){
      background(204,255,255);
      textSize(13);
      text("Pues bien, resulta sorprendente\nlo que pasa si lanzamos varios rayos\nen una superficie circular desde el centro...",width/2,200);
      textSize(9);
      text("(Pulsa cualquier tecla para continuar)",width/2,390);
    }
    if(contarmenu == 2){
      background(204,255,255);
      textSize(17);
      text("Aunque parezca increíble,\nla figura que forman coincide\ncon el nodo principal\ndel conjunto de Mandelbrot!", 200,200);
      textSize(9);
      text("(Pulsa cualquier tecla para continuar)",width/2,390);
    }
    if(contarmenu == 3){
      background(204,255,255);
      textSize(20);
      textAlign(CENTER,CENTER);
      text("¿Dónde está la gracia\no la relación aquí?",200, 60);
      textAlign(LEFT,CENTER);
      textSize(14);
      text("-No solo el conjunto de Mandelbrot con exponente 2\naparece en la tabla del 2, si no que TODOS\nlos conjuntos de Mandelbrot aparecen.\nEs decir, si buscas el conjunto de Mandelbrot\ncon exponente 3 y haces la tabla del 3\ncon el modo 1, verás que el módulo central coincide.\n\n-Aparecen, así, relacionados, tres\nfenómenos de ramas diferentes, como son\nlos fractales y las tablas de multiplicar (matemáticas)\ny la reflexión (óptica física).",20,230);
      textAlign(CENTER,CENTER);
      textSize(9);
      text("(Pulsa cualquier tecla para continuar)",width/2,390);
    }
    if(contarmenu == 4){
      background(204,255,255);
      textSize(20);
      textAlign(CENTER,CENTER);
      text("A partir de aquí, podrás\nexperimentar por tí mismo...",200, 60);
      textAlign(LEFT,CENTER);
      textSize(14);
      text("-En el modo 1 podrás crear tus propias\ntablas de multiplicar y experimentar con ellas.\n\n-En el modo 2 podrás ver cómo cambian las tablas\nen forma de animación.\n\n-En el modo 3 podrás ver, de forma colorida,\nla reflexión de rayos de luz en una superficie circular.\n\n-En el modo 4 podrás calificar el trabajo.",20,230);
      textAlign(CENTER,CENTER);
      textSize(9);
      text("(Pulsa cualquier tecla para continuar)",width/2,390);
    }
    if(contarmenu == 5){
    }
  }
  println(etapa);
}

void keyPressed(){
  contarmenu += 1;
}

void arrow(float x1, float y1, float x2, float y2) {
  line(x1, y1, x2, y2);
  pushMatrix();
  translate(x2, y2);
  float a = atan2(x1-x2, y2-y1);
  rotate(a);
  line(0, 0, -3, -3);
  line(0, 0, 3, -3);
  popMatrix();
}