Actividad 3: Bucles e Iteración.

[damiananache]

Planteo de ejercicio de creación algorítmica de un dibujo geométrico

Elijan una obra de Vera Molnar (Hungria, 1924) de la selección que les comparto a continuación. Luego diseñen un algoritmo que permita hacer una obra similar. No hace falta que recreen con precisión una de esas obras sino que las tomen como inspiración o punto de partida. Piensen en una realización a mano, por una persona, con lapiz o pincel, sobre un lienzo o papel, en vez de pensarlo para una computadora y una impresora o pantalla. Hagan foco en la estructura global por sobre el detalle. Finalmente, documéntenlo como les resulte mas cómodo, puede ser en prosa, en pseudo código o diagrama de flujo, pero por favor, no que sea en código de ningún lenguaje específico. Hagamos el foco en el planteo algorítmico y no en la programación.

Les comparto un ejemplo, inspirado en Quadrilateres (1986)

> inicio
> tomar un papel y elementos para dibujar con colores negro, gris y rojo) 
> dividir la hoja en 3 filas y 3 columnas, formando una matriz de 9 posiciones y definiendo así 9 casillas de escritura
> iniciar un índice de escritura para la matriz
> repetir el siguiente bucle desde el indice = 1 hasta índice = 9 incrementando su valor por unidad en cada repetición 
[
    > ir a la posición de escritura definida según el índice
        > definir aleatoriamente la cantidad de colores posibles para imprimir en esta casilla (1, 2 o 3)
    > repetir la siguiente estructura 30 veces 
    {
    > definir los parámetros de dibujo de un cuadrado según:
        > posición: centro de casilla
        > tamaño: random entre 70 y 90% de tamaño casilla
        > trazo contorno: 0,5 % del tamaño casilla 
        > color contorno:  random según la cant. definida para esta casilla (opciones 1, 2 o 3 de los siguientes: negro, gris ó rojo)
        > rotación angular: random +/- 10 grados
        > dibujar "cuadrado" según los parámetros definidos en el paso anterior
    }
]

> fin 

Esta obra ya la usamos como modelo, por favor, trabajen a partir de las siguientes:

1968-69-Interruptions_1

1968-untitled_1

1974-Hypertransformations_3

1985-Repentier

2004-9_Doubles_signes_sans_signification-5

[MartinSobel]

> tomar un papel
> elegir algun lapiz o birome con el trazo mas fino posible

> procedimiento generarNeoGothTribalBezier
> elegir un punto que esté a la mitad en el sentido horizontal de la hoja
> trazar una linea levemente curvada en algun sentidio
> trazar otra linea que tenga una curvatura casi similar a la primera pero que empiece y termine en el mismo punto que la primera

> repetir el procedimiento 3 veces

estoy intetando implementarlo acá

[multiv-ac]

Elegí la obra Hypertransformations:

> inicio
> tomar un papel cuadrado y un lapiz negro
> definir los parámetros de dibujo de un cuadrado según:
    > offset vertical: aleatorio dentro de un rango  pequeño
    > posición: centrado en la hoja horizontalmente con un posible offset vertical
    > tamaño: comenzar con un cuadrado que ocupe el 80% de la hoja
> repetir el bucle hasta que el tamaño del último cuadrado dibujado sea muy pequeño:
[
> dibujar cuadrado según los parámetros definidos
> reajustar parámetros:
    > achicar de forma constante el cuadrado
    > si el cuadrado tiene un tamaño igual o menor a un tercio de la hoja:
        > agrandar los valores mínimos y máximos del rango del offset
    > de forma aleatoria decidir si aplicar el offset vertical hacia arriba o hacia abajo
]
> fin 

https://editor.p5js.org/vgsabri/full/BBiiEFRG2

[M11SH4]

Sobre la primer obra de Vera Molnar:

Instrumentos/materiales: 1 hoja cuadriculada, 3 microfibras/lapices o combinación de estás, de 3 tonos/colores diferentes.

Seleccionar sobre la hoja un sector para dibujar, sobre el conjunto de 4 cuadrados, en la base de hoja, un cuadrado. Repetir esta acción 2 veces más sobre la misma linea horizontal, uno al lado del otro dejando cierto espacio entre medio, obteniendo así el conjunto de tres cuadrados continuos. Repetir lo mismo por debajo de estos 3 cuadrados. Repetir una vez más, por debajo de esta segunda linea de 3 cuadrados, obteniendo así tres lineas horizontal y verticales con tres cuadrados de largo y tres cuadrados de ancho. Los colores que se usan en el inicio, son a elección propia. luego, volver a rayar, por sobre los mismos cuadrados dibujados, con los otros tonos/colores que se selecciono como herramienta para realizar esta acción. No es necesario dar sobre la misma linea de tinta, cuando mas irregular, mejor, dejando entrever los diferentes trazos y colores/herramientas de dibujo.

[ksdn1113]

hypertransformations (pensé que era 1968_untitled1, fe de erratas), posible algoritmo en pseudocódigo para dos medios distintos

analógico:

requisitos previos -una hoja cuadrada -un marcador de color visible para la hoja -una regla/elemento de medición (deseado sólo si se quiere precisión)

procedimiento:

1> encontrar el centro de la hoja en el eje horizontal (usar regla)
2> visualizar una linea recta que vaya desde la arista superior hasta la inferior de la hoja, cruzando por el centro de la hoja encontrado previamente.
3> encontrar el punto medio aproximado de la linea recta visualizada, y notar esa posición.
4> desde la ubicación previamente notada , desplazarse por la línea recta visualizada. la distancia debe ser aleatoria y menor a 1/40 del alto total de la hoja, sea para arriba o para abajo. 
5> una vez atravezada la distancia, visualizar un punto. notar ésta nueva posición.
6> a partir del punto visualizado, dibujar un cuadrado con arista igual al largo de la hoja, multiplicado por 1/40 (un aproximado para tener referencia. podríamos decir 4mm por ej). tomar el punto visualizado como centro del cuadrado.
7> Una vez dibujado el cuadrado, repetir el paso 4 y 5.
8> repetir paso 6, sólo que al largo usado previamente, sumarle 1/40 del largo de la hoja por cada cuadrado que se dibujó previamente (1+n/40, donde n sería la cantidad de cuadrados dibujados hasta ahora)
9> repetir pasos 7 y 8 hasta que dibujes 30 cuadrados en total.

posible implementación en processing/p5js:

cant_cuadrados = 30;
tamaño = 800;
largo_min = tamaño/40;
agregado = tamaño/40;

function setup() {
    createCanvas(tamaño,tamaño);
    rectMode(CENTER);
    noFill();
    background(255);
    strokeWeight(2);

    pos_x = tamaño/2;
    pos_y = tamaño/2;
    contador = 0;
}

function draw() {
    while(contador < cant_cuadrados)
    {
        pos_y = pos_y + random(largo_min, -largo_min);
        largo = largo_min + agregado*contador
        rect(pos_x, pos_y, largo, largo);
        contador = contador +1;
    }
}

[outofnames2]

Hypertransformations:

• tomamos como referencia el centro de la hoja
• dibujamos un cuadrado de x tamaño ( x deberia ser lo suficientemente grande para que quepan mas cuadrados dentro)
• dibujamos el siguiente cuadrado dentro del anterior haciendo una interseccion con su lado superior o inferior
• repetir hasta quedarse sin espacio

[ksdn1113]

ola me agarró curiosidad y me puse a experimentar con p5js para hacer las obras interruptions y untitled.

les comparto un primer borrador precario para untitled, ya que para interruptions alcanza con modificar un pequeño detalle.

size = 800;
line_length = 30;
initial_pos_x = 100;
initial_pos_y = 100;
counter_x = 0;
counter_y = 0;
tracker = 0;
offset = 25;
limite = 700;
flag = true;

function setup() {
    createCanvas(size, size);
    strokeWeight(2);
    rectMode(CENTER);
    background(random(100,255),0,random(150,255));
    pos_x = initial_pos_x;
    pos_y = initial_pos_y;
}

function draw() {
    tracker = int(random(4));
    if(tracker != 0 && flag)
    {
        push();
        translate(pos_x,pos_y);
        rotate(tracker*PI/4);
        rect(0,0,line_length,1);    
        pop();
    }
    pos_x = pos_x + offset;
    if(pos_x >= limite)
    {
        pos_y = pos_y + offset;
        pos_x = initial_pos_x;
    }
    if(pos_y >= limite)
    {
        flag = false;
    }
}

para que actúe como interruptions, debería de alargarse un poco el largo y de eliminar el casteo del tracker.

les comparto algunos resultados que hice jugueteando c:

[FontanaUNTREF]

Elijo "Interruptions" de Vera Molnar como inspiración para el algoritmo.

1.Preparar el papel y los lápices y unos dados 2.Dividir el papel en una cuadrícula con varias filas y columnas.

3. Empezá a recorrer la cuadrícula, celda por celda.

Para cada celda:

4. Elegí al azar si querés agregar una interrupción o una forma geométrica.

-Tirá los dados: si sale un numero bajo, digamos menos de 6 podes utilizar una interrupcion -Si optás por una interrupción: -Pensá qué tipo querés: Una línea que cruce de punta a punta o algo distinto? -Seleccioná dos puntos dentro de la celda. -Realizá el dibujo. -Si preferís una forma geométrica: -Podés elegir entre un cuadrado, círculo u otra forma. -Elegí si querés que sea grande o pequeña. -Definí dónde la ubicarás dentro de la celda. -Repetí estos pasos hasta recorrer todas las celdas de la cuadrícula.