Close
Tutorial

(ESPAÑOL) Introducción a Ecuaciones Paramétricas : Círculo (Parte 1: CHOPS) For Beginners & Intermediate

Hola a todos, después de mucho tiempo de adquirir conocimientos a través de la gran comunidad conformada por Touchdesigners por fin puedo hacer mi aporte para que los mismos coders y nuevos coders puedan comprender mejor el funcionamiento de los grandiosos operadores que nos obsequia el equipo de Derivative. 

Preliminarmente al tutorial quiero dar una pequeña introducción al porqué de esta serie de post / tutoriales que estarán saliendo.

 

Siempre me ha motivado mucho la ciencia de las matemáticas y como dicha ciencia ayuda mucho a entender descubrimientos y comportamientos casi sino es que exactos de las demás ciencias existentes, por consiguiente, debido a que siento que el arte es un campo necesario para que el desarrollo del humano sea pleno y placentero, me he dedicado a la búsqueda de entender de qué manera podemos generar arte a través de las matemáticas.

 

Buscando información en internet llegue a una serie de libros fantásticos sobre las diferentes ciencias y en esta serie de libros hay uno dedicado al diseño, en el cual aborda los patrones de diseño desde tiempos remotos hasta lo más reciente.

 

Les dejo el link del libro por si desean adquirirlo (100% Recomendado):

https://www.amazon.com/gp/product/1907155155?ie=UTF8&tag=woodenbooks-20&linkCode=as2&camp=1789&creative=9325&creativeASIN=1907155155

 

En los apéndices de este libro me encontré con una gráfica donde diferentes curvas matemáticas son mostradas, la cual despertó en mi la pregunta "¿Como poder recrear dichas curvas en Touchdesigner?" Así que después de una exhaustiva búsqueda, encontré la manera de recrear la mayoría de dichas curvas.

 

Algunos objetivos de los próximos tutoriales serán:

  • Traducir funciones matemáticas a Touchdesigner usando CHOP's y Python
  • Modificación de parámetros en tiempo real para editar las curvas realizadas
  • Comprender más a detalle algunas funciones de operadores como Function CHOP, Script CHOP, entre otros.

 

Así que, sin más preámbulo, continuemos con la parte emocionante.

 

¿Por qué el circulo?
 

Muchos preguntaran: ¿Porque un tutorial sobre el circulo, si este operador viene por default en Touchdesigner? Y es por eso mismo que al ser la curva default, podemos entender de una manera más simple la conversión de las ecuaciones, así como la manera en que serán presentada esta serie de tutoriales. Así que primero lo primero:

 

Crearemos un círculo con la familia SOP en este caso escogeremos el operador Circle, y escogeremos la opción Open Arc del parámetro Arc Type:

Touchdesigner viene con una increíble serie de operadores los cuales nos permiten convertir nuestra información de una familia a otra, y para este estudio lo que necesitamos es convertir nuestra información SOP a información CHOP, la cual nos permite ver las posiciones en x,y,z de cada punto de nuestra figura SOP.

 

Así que el siguiente paso será conectar nuestro operador Circle1 al operador SOP to de la familia CHOP. Esto se puede hacer de manera fácil al hacer clic medio en nuestro mouse sobre la salida de Circle1 y después dirigirnos a la familia CHOP donde solamente nos mostrara los operadores a los que nuestro Circle1 puede ser conectado, escogemos SOP to y lo acomodamos en nuestro network:

Por último, para reconfirmar que dicha información en nuestro operador CHOP nos genera un círculo, conectamos un Null al CHOP Sopto1 y después convertir nuestro CHOP a SOP con el operador CHOP to de la familia SOP y podemos repetir el proceso de conexión descrito anteriormente para evitar pasos extra:

Y efectivamente, nuestra información CHOP crea un círculo idéntico al operador Circle 1.

 

Así que lo siguiente que te preguntaras: ¿Pero bueno, matemáticamente que es un círculo y como puedo hacerlo desde cero con CHOP’s?  Vamos a descubrir cómo en los siguientes párrafos.

 

 ¿Qué es un círculo?

 Definición tomada desde Wolfram MathWorld:

"Un círculo es el conjunto de puntos en un plano que son equidistantes de un punto O dado. La distancia r desde el centro se llama radio y el punto O se llama centro. El doble del radio se conoce como diámetro d = 2r. El ángulo que subtiende un círculo desde su centro es un ángulo completo, igual a 360 grados o 2pi radianes"
Aplicar esta definición no nos ayuda mucho ya que nuestra información sería muy diferente a lo que nos arrojó nuestro operador SOP to, por lo que tendremos que abordar la conversión de manera diferente.
 
 ECUACIONES PARáMETRICAS
Definición tomada desde Wolfram MathWorld: 
 "Las ecuaciones paramétricas son un conjunto de ecuaciones que expresan un conjunto de cantidades como funciones explícitas de una serie de variables independientes, conocidas como "parámetros."Por ejemplo, mientras que la ecuación de un círculo en coordenadas cartesianas puede estar dada por r ^ 2 = x ^ 2 + y ^ 2, un conjunto de ecuaciones paramétricas para el círculo está dado por:"
 

Dónde :

  • r = Tamaño del radio de nuestro circulo.
  • t = Longitude del ángulo.
  • x = Posición en eje X del ángulo dado.
  • y = Posición en eje Y del ángulo dado.

 

 Para esta serie de tutoriales estaremos trabajando con las ecuaciones paramétricas, para poder recrear nuestras curvas paramétricas, conforme avancemos encontraremos curvas que solo tienen ecuaciones polares, las cuales tendremos que averiguar cómo convertir a ecuaciones paramétricas, pero dejaremos esto para otro tutorial, cuando la oportunidad se presente.

 

Tomando en cuenta las ecuaciones anteriores podemos decir que necesitamos dos variables (r & t) para nuestra posición en x & y, también necesitamos usar las funciones de seno y coseno para cada posición, por lo que la lista de componentes que necesitamos en nuestra red son las siguientes:
 
  • Constant CHOP: Aquí es donde definiremos nuestros parámetros, así como nuestra constante en z para no tener que modificar la conversión a SOP.
  • Select CHOP: Un operador muy funcional para poder seleccionar canales individuales desde otros operadores.
  • Math CHOP: Operador con el cual podemos realizar diversas operaciones matemáticas.
  • Pattern CHOP: Este componente nos ayudará a definir el valor de nuestro ángulo.
  • Function CHOP: Este es de mis operadores favoritos, ya que realiza diferentes funciones matemáticas al operador que se introduzca.
  • Merge CHOP: Con este operador juntaremos nuestros canales para solo tener una salida que sea funcional al momento de convertir nuestra información CHOP a SOP.
  • Rename CHOP: Nos servirá para asignar el nombre correcto para la conversión.
  • Null CHOP: El muy funcional null CHOP que nos servirá para realizar la exportación de nuestra información.

 

 Paso 1:

Crear un Constant CHOP en el cual declararemos:

 

  • Samples: Longitud en muestras/puntos de nuestro circulo, en este cso le daremos valor de 40 (Que es igual al valor default de circle1).
  • r: Radio de nuestro circulo el cual será de 1.

 

 PASO 2:

Crear Pattern CHOP:

 

  • En el parámetro Type escogeremos la opción Ramp
  • En nuestro parámetro Length exportaremos el canal samples de constant1.

 

Paso 3: 

Tenemos que conectar el operador pattern1 a dos operadores Function CHOP, los cuales realizaran la operación de coseno(posición en X) y seno(posición en Y) de la rampa, después escogemos la opción Cycles del parámetro Angle Units en ambos operadores y tendremos el siguiente resultado:

 

 

PASO 4:

Utilizar Merge CHOP para unir nuestros dos canales y colocaremos un Select CHOP para seleccionar el parámetro 'r' que se encuentra definido en el operador Constant1:

 PASO 5:

Multiplicar nuestras funciones (cos t,sin t) por el valor del parámetro r, para esto conectamos los operadores select1 y merge1 a un Math CHOP, en el cual tenemos que modificar el parámetro Combine CHOPs  a 'Multiply':

 Después conectaremos un Rename CHOP al operador math1 para nombrar correctamente nuestros canales X & Y respectivamente, para esto introducimos los valores “tx ty” en el parámetro To:

 pASO 6:

Necesitamos introducir el valor en el eje Z (aunque no se use), para la conversión de nuestras ecuaciones a SOP. Para esto debemos hacer lo siguiente:
  • Copiar y pegar el operador pattern1. En la copia(pattern2) realizar los siguientes cambios:
    • Cambiar el parámetro Type a Constant.
    • Cambiar el parámetro Amplitude a 0.
    • En la pestaña Channel cambiar el nombre del canal en el parametro Channel Names a ‘tz’.

 

 Por ultimo utilizamos otro Merge CHOP para unir nuestros canales y finalmente agregamos un Null CHOP para exportar/convertir el resultados de nuestras ecuaciones a SOP.
 Así es como quedara nuestra red de CHOP's lista para ser convertida a SOP:
 Antes de realizar la conversión podemos comparar nuestro CHOP final con el primer operador que convirtió el circulo SOP a CHOP y podremos ver que son idénticos:

Por lo que podremos asegurar que todo el proceso que realizamos dibujara un círculo en la familia SOP. Para esto lo que tenemos que realizar es hacer el proceso de Conectar/Exportar el operador 'null2' a un operador CHOPto de la familia SOP:

¡¡Y finalmente después de tantas operaciones logramos construir nuestro Circulo desde cero con ecuaciones paramétricas!!

 

Por último, siguiendo los siguientes pasos podremos ver que el parámetro r modifica el radio de nuestro circulo:

 

En el siguiente tutorial explicare la diferentes manera en que podemos hacer nuestras curvas con CHOPS, para asi poder empezar con curvas diferentes y ver las maneras en que podemos aplicar sus formas ya sea para realizar instancias o bien usarlas como caminos para geometrias u otras cosas. 
 
P.D: Tambien estoy en proceso de hacer un video tutorial de todo esto, les avisare cuando este listo! Gracias por su tiempo.

 

 

RECURSOS:

https://mathworld.wolfram.com/Circle.html

https://mathworld.wolfram.com/ParametricEquations.html

 

Asset Downloads

Experience level