# Sesc - Programação para Ilustradores ## Criação de Retículas com Programação ## `hackmd.io/@villares/prog-ilustra-r4` ### Conversas paralelas :) - Particle systems: https://natureofcode.com/particles/ - Mapas OpensStreetMaps com Python - OSMNX https://geoffboeing.com/2017/08/isochrone-maps-osmnx-python/ - Python Tutor https://pythontutor.com/ ### Estudo da imagem com quadrados progressivamente menores - Ref do [painel da Elza Soares](https://g1.globo.com/sp/sao-paulo/noticia/2023/07/22/mural-em-homenagem-a-elza-zoares-no-centro-de-sp-e-reinaugurado-neste-sabado-aniversario-de-93-anos-da-cantora.ghtml) - Ref [artista que fez a obra da Elza](https://www.felipecama.com/nus-after) #### Primeira tentativa com drag do mouse ![image](https://hackmd.io/_uploads/Skjiwuh1A.png) ```python from collections import namedtuple Quad = namedtuple("Quad", "x y w cor") tamanho = 100 grade = [] def setup(): global img size(700, 700) img = load_image('ada.jpg') rect_mode(CENTER) grade[:] = gerar_grade() def draw(): image(img, 0, 0) no_stroke() for quadrado in grade: # x, y, w, cor = quadrado fill(quadrado.cor) square(quadrado.x, quadrado.y, quadrado.w) # fill(q[3]) # square(q[0], q[1], q[2]) def mouse_dragged(): for i, (x, y, w, cor) in enumerate(grade.copy()): if mouse_over(x, y, w) and w > 10: del grade[i] grade.extend(split(x, y, w)) def split(x, y, w): resultado = [] ws4 = w / 4 q0 = (x - ws4, y - ws4) q1 = (x + ws4, y - ws4) q2 = (x - ws4, y + ws4) q3 = (x + ws4, y + ws4) for qx, qy in (q0, q1, q2, q3): cor = conta_gotas(qx, qy, img) resultado.append(Quad(qx, qy, w/2, cor)) return resultado def mouse_over(x, y, w): return (x - w / 2 < mouse_x < x + w / 2 and y - w / 2 < mouse_y < y + w / 2) def gerar_grade(): grade = [] colunas = int(width / tamanho) filas = int(height / tamanho) print(tamanho) for num_fila in range(filas): y = tamanho / 2 + tamanho * num_fila for num_col in range(colunas): # num_col 0, 1, 2 ... 19 x = tamanho / 2 + tamanho * num_col cor = conta_gotas(x, y, img) grade.append(Quad(x, y, tamanho, cor)) return grade def conta_gotas(x, y, img_source): xi = int(remap(x, 0, width, 0, img_source.width)) yi = int(remap(y, 0, height, 0, img_source.height)) return img_source.get_pixels(xi, yi) ``` ### Noise - Tutorial de Noise https://abav.lugaralgum.com/material-aulas/Processing-Python-py5/noise.html #### Noise do Processing (Perlin Noise) ![image](https://hackmd.io/_uploads/BJjJh_31R.png) ```python tamanho = 10 step = 0.005 offx = 2000 offy = 1000 def setup(): size(700, 700) def draw(): background(240) no_stroke() colunas = int(width / tamanho) filas = int(height / tamanho) print(tamanho) for num_fila in range(filas): y = tamanho / 2 + tamanho * num_fila for num_col in range(colunas): # num_col 0, 1, 2 ... 19 x = tamanho / 2 + tamanho * num_col fill(0) #d = random(0, tamanho - 2) d = noise((offx + mouse_x - x) * step, (offy + mouse_y - y) * step, frame_count * step) * (tamanho + 5) circle(x, y, d) def key_pressed(): global step if key == '-': step *= 0.9 if key == '+': step *= 1.1 ``` #### OpenSimplex Noise ```python tamanho = 10 step = 0.005 offx = 0 offy = 0 def setup(): size(700, 700) def draw(): background(240) no_stroke() colunas = int(width / tamanho) filas = int(height / tamanho) print(tamanho) for num_fila in range(filas): y = tamanho / 2 + tamanho * num_fila for num_col in range(colunas): # num_col 0, 1, 2 ... 19 x = tamanho / 2 + tamanho * num_col #d = random(0, tamanho - 2) n = os_noise((offx + mouse_x - x) * step, (offy + mouse_y - y) * step, frame_count * step) d = remap(n, -1, 1, 0, tamanho + 2) fill(0) circle(x, y, d) # n = os_noise((offx + mouse_x - x) * step, # (offy + mouse_y - y) * step, # (frame_count + 50) * step) # d = remap(n, -1, 1, 0, tamanho + 2) # fill(200,0 , 00) # circle(x, y, d) circle(x, y, d) def key_pressed(): global step if key == '-': step *= 0.9 if key == '+': step *= 1.1 ``` #### Exemplo de noise com Numpy - https://github.com/villares/sketch-a-day/blob/main/2023/sketch_2023_02_04/sketch_2023_02_04.py ## Ideia extra para pensar No livro *Code as Creative Medium* Levin e Brain (2021): > **Subsample and Downsample** Write a program that pixelates an image to produce a low-resolution version. Begin by subsampling the image (destination pixels are selected from the original). Then, downsample the image (destination pixels are local averages). Nossa estratégia no curso foi de subsample (pegar alguns pixels de exemplo da imagem maior), como implementar o downsample (calcular a média de cor de uma região de pixels?) e qual a consequência? Desconfio que reduz o contraste...