Estudio de la función Seno(): SinusDON

 

La función Seno (Sin()) nos puede servir para modular algunos aspectos interesantes en nuestras creaciones, como pueden llegar a ser el Diámetro de nuestro Círculo o el lado del cuadrado o rectángulo donde va embebido nuestro Patrón repetitivo.

Aquí hemos utilizado un circulo por medio de:

 circle(x, y, D);

Siendo x e y las coordenadas del centro de la circunferencia y D el diámetro.

Teniendo en cuenta que la función draw() se ejecuta 55 veces por segundo podremos aprovechar esta funcionalidad para hacer o bien que el diámetro se agrande o se disminuya teniendo en cuenta que la función Seno() es una función que funciona bajo un rango de altura entre 1 y -1, pudiendo ser aprovechado para que nuestro patrón varíe su proporcion, de forma cíclica, continuamente. 

Si nos apoyamos en la variable implícita frameCount, la cual nos arroja el numero de ejecuciones de la función draw(), podremos disponer de una modulador del Diámetro de un sencillo modo:

f = sin(frameCount);

Esto hará que todos los Patrones dibujados varíen su proporción al igual. No obstante, cuando probéis esto os daréis cuenta que su velocidad es impresionantemente alta. Esto es debido a que, por omisión, se trabaja en Radianes. Es necesario añadir en la función setup() algo para permitirnos trabajar en Grados, es decir, números:

angleMode(DEGREES);

Por medio de esto comprobaremos que todo cambia. Todos los patrones dibujados (o bien por un circle condicionado por for; o bien por sistemas de particulas), todos esos elementos tienen el mismo tamaño y cambian su tamaño a la vez y sincronizadamente. 

Pudiera darse el caso que deseáramos variar la velocidad del aumento y decremento de los diámetros. Ello lo conseguiremos modulando el angulo a calcular por la función sin().

f = sin(frameCount * v ); 

Siendo f la modulación del diámetro; frameCount la variable continua que nos devuelve la serie de números necesarios para acompasar los movimientos y v la modulación de la frecuencia que controlara la longitud de onda, lo cual bifurcará en la velocidad de propagación de la onda.

si damos a v un valor de 0.5 ira la mitad de rápido mientras que si le damos un valor de 2.0 ira el doble de rápido.

Para  controlar el desfase, es decir, que no todos los patrones realicen el crecimiento a la vez, sino que creen una cierta armonía cíclica. Necesitaremos de dos cosas: un punto generador de las ondas y un modulador de las mismas.

Los valores de este modulador de ondas nos proporcionara la pronunciación de la propagación haciendo que para valores muy bajos (0.1, 0.5, etc.) se propague de forma muy suave y para valores altos (1.5, 2.5, etc.) se acentúe su propagación, no su velocidad. Incluso si le damos valores muy altos como, por ejemplo 20.9, pudiera deformar ficha propagación.

En cuanto al punto de origen de propagación de las ondas que hemos mencionado: se tratara de un punto origen que creara el sentido en el cual se propaguen las ondas. 

Una buena técnica proporcionada por quien considero un gran maestro, Julien Gachadoat, en su curso de Domestika (y no me pagan, simplemente lo hice y agradecí hacerlo) es precisamente condicionar esa propagación al centro de cada elemento. Dicho de otro modo: modularlo desde el centro del circulo a un punto de generación dado. Esto podemos conseguirlo por medio de la función dist() la cual requiere cuatro parámetros: la x y la y de los dos puntos a medir:

dist(x,y, x2,y2);

Correspondiendo los dos primeros parámetros x e y al centro de nuestro patron (en nuestro caso un circulo), y x2 e y2 a las coordenadas del punto de generación de ondas.

Obviamente seria una buena idea crear al inicio de nuestro programa dos variables globales con el fin de parametrizar nuestra maquina y poder probar de un modo sencillo varias alternativas: por ejemplo:

let x2 = l/2;    

let y2 = l/2;

Siendo l la variable global donde definimos el tamaño de nuestro canvas o lienzo de dibujo.

Una vez que la maquina de dibujo funciona podríamos cambiar la función circle() por una función square() para que en lugar de círculos nos visualice cuadrados. Teniendo en cuenta que square() toma como punto de ajuste la esquina superior izquierda del cuadrado generado.

Para evitarlo y conseguir un efecto mas armónico, podríamos definir en el setup() el ajuste rectMode(CENTER), lo cual hará que se ajuste al centro del elemento creado. 

También podríamos añadir a square() un cuarto valor que indicara la redondez de sus esquinas para conseguir un juego de formas realmente interesante, algo parecido a cuadrado que se empequeñece y se convierte en un circulo.