takethestreet/tools/bocetos.py
hacklab 2cece9947f Cinco bocetos de la calle con acabado a mano y regueros de colores
tools/bocetos.py: líneas con pulso y doble pasada, zigzag irregular con
pasada fantasma y chorreones, niebla de spray en el fuego y grano de pared.
De cada portal sale un reguero de un color hacia la piña.
2026-10-13 13:47:10 +02:00

205 lines
12 KiB
Python

# Genera docs/bocetos/boceto-1..5.svg: la calle en líneas negras y la gente en color,
# en monigotes de un trazo de spray en zigzag (a la manera de Suso33).
# De cada portal sale un reguero de un color (cada lucha) y todos se juntan en la piña,
# que en el centro arde en colores de fuego.
import sys, random, math, os
OUT = sys.argv[1]
INK = "#111"
FUEGO = ["#fffbe6", "#ffe066", "#ffb627", "#ff7b1c", "#f04e23", "#c8102e"] # del centro hacia fuera
LUCHAS = ["#8e44c9", "#3b5bdb", "#14965a", "#d6336c", "#2a9d8f", "#5b2a86"] # un color por reguero
FRIO = ["#5b2a86", "#8e44c9", "#3b5bdb", "#6c7ae0", "#b07cd8", "#2a9d8f", "#111"]
DEFS = '''<defs>
<filter id="spray" x="-30%" y="-10%" width="160%" height="120%"><feTurbulence type="fractalNoise" baseFrequency="0.8" numOctaves="2" seed="3" result="t"/><feDisplacementMap in="SourceGraphic" in2="t" scale="2" result="d"/><feGaussianBlur in="d" stdDeviation=".6" result="b"/><feGaussianBlur in="SourceGraphic" stdDeviation="4" result="n"/><feComponentTransfer in="n" result="n2"><feFuncA type="linear" slope=".3"/></feComponentTransfer><feMerge><feMergeNode in="n2"/><feMergeNode in="b"/></feMerge></filter>
<filter id="brocha" x="-5%" y="-5%" width="110%" height="110%"><feTurbulence type="fractalNoise" baseFrequency="0.03 0.2" numOctaves="3" seed="4" result="t"/><feDisplacementMap in="SourceGraphic" in2="t" scale="5"/></filter>
<filter id="grano" x="0" y="0" width="100%" height="100%"><feTurbulence type="fractalNoise" baseFrequency="0.7" numOctaves="3" seed="7"/><feColorMatrix values="0 0 0 0 0.1 0 0 0 0 0.1 0 0 0 0 0.1 0 0 0 -1.4 .62"/></filter>
<filter id="pincel" x="-5%" y="-5%" width="110%" height="110%"><feTurbulence type="fractalNoise" baseFrequency="0.04 0.3" numOctaves="3" seed="4" result="t"/><feDisplacementMap in="SourceGraphic" in2="t" scale="4" result="d"/><feGaussianBlur in="SourceGraphic" stdDeviation="3" result="n"/><feComponentTransfer in="n" result="n2"><feFuncA type="linear" slope=".25"/></feComponentTransfer><feMerge><feMergeNode in="n2"/><feMergeNode in="d"/></feMerge></filter>
<filter id="halo" x="-50%" y="-50%" width="200%" height="200%"><feGaussianBlur stdDeviation="50"/></filter>
<linearGradient id="gd" x1="0" y1="0" x2="1" y2="0"><stop offset=".62" stop-color="#fff"/><stop offset=".98" stop-color="#000"/></linearGradient>
<linearGradient id="gv" x1="0" y1="0" x2="0" y2="1"><stop offset=".02" stop-color="#000"/><stop offset=".25" stop-color="#fff"/></linearGradient>
<mask id="derecha" maskUnits="userSpaceOnUse" x="0" y="0" width="1600" height="900"><rect width="1600" height="900" fill="url(#gd)"/></mask>
<mask id="arriba" maskUnits="userSpaceOnUse" x="0" y="0" width="1600" height="900"><rect width="1600" height="900" fill="url(#gv)"/></mask>
</defs>'''
class Calle:
def __init__(s, W=1600, H=640, VX=1180, VY=110, F=520, EYE=5.0, FACH=-6.5, KI=-4.2, KD=3.6, Y0=0):
s.__dict__.update(locals()); del s.__dict__["s"]
s.o = []
def P(s, X, Yh, Z):
return s.VX + X * s.F / Z, s.VY + (s.EYE - Yh) * s.F / Z
def linea(s, a, b, w, op=.95):
"""Trazo a mano: temblor suave, grosor que cambia y una segunda pasada."""
L = math.hypot(b[0] - a[0], b[1] - a[1])
if L < 1:
return
nx, ny = -(b[1] - a[1]) / L, (b[0] - a[0]) / L
n = max(3, int(L / 40))
for pasada in range(2):
off, drift = 0.0, random.uniform(-1, 1) * w * .4
pts = []
for k in range(n + 1):
t = k / n
off += random.uniform(-1, 1) * w * .35
off *= .8
q = off + drift * math.sin(math.pi * t)
pts.append((a[0] + (b[0] - a[0]) * t + nx * q, a[1] + (b[1] - a[1]) * t + ny * q))
ww = w * (1 if pasada == 0 else .45)
# grosor variable: el trazo se parte en tramos con anchos distintos
for k in range(0, n, 2):
seg = pts[k:k + 3]
d = "M" + " L".join(f"{x:.1f},{y:.1f}" for x, y in seg)
s.o.append(f'<path d="{d}" stroke="{INK}" stroke-width="{ww * random.uniform(.6, 1.25):.1f}" stroke-linecap="round" stroke-linejoin="round" opacity="{op * (1 if pasada == 0 else .45):.2f}"/>')
def dibujar_calle(s, portales, cruce=None):
P, L = s.P, s.linea
zn = s.EYE * s.F / (s.H + s.Y0 - s.VY) * .8 # lo más cerca que sale en el cuadro
s.o.append('<g mask="url(#derecha)"><g mask="url(#arriba)"><g filter="url(#pincel)" fill="none">')
tramos = [(zn, 90)] if not cruce else [(zn, cruce[0]), (cruce[1], 90)]
for z0, z1 in tramos:
L(P(s.FACH, 0, z0), P(s.FACH, 0, z1), 7) # pie de la fachada
L(P(s.KI, 0, z0), P(s.KI, 0, z1), 9) # bordillo
L(P(s.KI + .18, 0, z0), P(s.KI + .18, 0, z1), 3, .7)
L(P(s.KD, 0, max(zn, 5)), P(s.KD, 0, 90), 6, .8) # bordillo de enfrente
if cruce: # calle que cruza: bordillos hacia la izquierda
for z in cruce:
L(P(s.KI, 0, z), P(-40, 0, z), 8)
L(P(s.FACH, 0, z), P(s.FACH, 0, z), 1)
z = max(zn, 4.5)
while z < 60: # línea discontinua del centro
L(P(-.3, 0, z), P(-.3, 0, z + 2.2), 2 + 16 / z, .8)
z += 5
for zd in portales: # portales: solo el contorno
a, b = P(s.FACH, 0, zd), P(s.FACH, 0, zd + 1.5)
c, d = P(s.FACH, 2.5, zd), P(s.FACH, 2.5, zd + 1.5)
w = 30 / zd + 2
L(a, c, w); L(c, d, w); L(d, b, w)
L(P(s.FACH, 2.85, zd - .3), P(s.FACH, 2.85, zd + 1.8), w * .6, .6)
s.o.append('</g></g></g>')
def monigote(s, x, y, h, col, lean=0.0, paso=False, brazo=False):
sw = max(1.1, h * .011)
dy = sw * 2.0
top = y - h
pts, yy, i = [], top, 0
while yy <= y:
t = (yy - top) / h
cx = x + lean * h * (1 - t)
if t < .13:
w = h * .05 * math.sin(math.pi * t / .13) ** .6 + sw * .3
elif t < .16:
w = h * .008
else:
u = (t - .16) / .84
w = h * (.062 * (1 - u) ** .8 + .014)
if paso and u > .5:
cx += (-1 if (i // 2) % 2 else 1) * h * .035 * (u - .5) / .5
w *= .6
pts.append((cx + (-1 if i % 2 else 1) * w * random.uniform(.7, 1.3) + random.uniform(-.6, .6) * sw, yy))
yy += dy * random.uniform(.85, 1.15) * (.55 if t < .13 else 1)
i += 1
d = "M" + " L".join(f"{px:.1f},{py:.1f}" for px, py in pts)
s.o.append(f'<path d="{d}" fill="none" stroke="{col}" stroke-width="{sw:.1f}" stroke-linejoin="round" stroke-linecap="round" filter="url(#spray)"/>')
gx, gy = random.uniform(-1, 1) * sw, random.uniform(.3, 1) * sw # segunda pasada, fantasma
d2 = "M" + " L".join(f"{px + gx:.1f},{py + gy:.1f}" for px, py in pts[::2])
s.o.append(f'<path d="{d2}" fill="none" stroke="{col}" stroke-width="{sw * .6:.1f}" stroke-linejoin="round" opacity=".35" filter="url(#spray)"/>')
if random.random() < .22 and h > 60: # chorreón
px, py = random.choice(pts[len(pts) // 3: -2])
s.o.append(f'<path d="M{px:.1f},{py:.1f} q{random.uniform(-1, 1):.1f},{h * .12:.1f} 0,{h * random.uniform(.15, .35):.1f}" stroke="{col}" stroke-width="{sw * .55:.1f}" stroke-linecap="round" fill="none" opacity=".75"/>')
s.o.append(f'<circle cx="{px:.1f}" cy="{py + h * .3:.1f}" r="{sw * .45:.1f}" fill="{col}" opacity=".6"/>')
if brazo:
bx, by = x + lean * h * .84 + h * .05, top + h * .2
p = [(bx + j / 9 * h * .06 + (-1 if j % 2 else 1) * h * .012, by - j / 9 * h * .30) for j in range(10)]
d = "M" + " L".join(f"{px:.1f},{py:.1f}" for px, py in p)
s.o.append(f'<path d="{d}" fill="none" stroke="{col}" stroke-width="{sw:.1f}" stroke-linecap="round" filter="url(#spray)"/>')
def gente(s, pina, regueros, extra=(), puños=.1, zmin=None):
"""pina = (CX, CZ, sx, sz, n, R): centro, dispersión, intentos y radio del fuego (m).
regueros = [(X0, Z0, color, n)]: salen de (X0, Z0) hacia el centro de la piña."""
CX, CZ, sx, sz, n, R = pina
zmin = zmin or s.EYE * s.F / (s.H + s.Y0 - s.VY) + .3
g = []
def cabe(X, Z):
return all(math.hypot(X - a, (Z - b) * .8) > .42 + .022 * Z for a, b, _ in g)
for X0, Z0, col, k in regueros: # primero los regueros
for j in range(k):
t = (j + .5) / k
X = X0 + (CX - X0) * t + random.uniform(-.25, .25)
Z = Z0 + (CZ - Z0) * t + random.uniform(-.3, .3)
if Z > zmin and cabe(X, Z):
g.append((X, Z, col))
for _ in range(n): # luego la piña
X, Z = random.gauss(CX, sx), random.gauss(CZ, sz)
if s.KI - 1.6 < X < s.KD - .3 and zmin < Z < 34 and cabe(X, Z):
g.append((X, Z, None))
for X, Z, col in extra:
g.append((X, Z, col))
c = s.P(CX, 1.0, CZ)
r0 = 2600 / CZ
s.o.append(f'<circle cx="{c[0]:.0f}" cy="{c[1]:.0f}" r="{r0:.0f}" fill="#ffb627" opacity=".14" filter="url(#halo)"/>')
for _ in range(700): # niebla de spray
ang, rr = random.uniform(0, 2 * math.pi), abs(random.gauss(0, r0 * .55))
k = min(len(FUEGO) - 1, int(rr / r0 * len(FUEGO)))
s.o.append(f'<circle cx="{c[0] + math.cos(ang) * rr * 1.3:.1f}" cy="{c[1] + math.sin(ang) * rr * .8:.1f}" r="{random.uniform(.6, 2.6):.1f}" fill="{FUEGO[k]}" opacity="{random.uniform(.15, .5):.2f}"/>')
for X, Z, col in sorted(g, key=lambda q: -q[1]):
x, y = s.P(X, 0, Z)
h = 1.7 * s.F / Z * random.uniform(.9, 1.08)
d = math.hypot(X - CX, Z - CZ) / R
if d < 1:
col = FUEGO[min(len(FUEGO) - 1, int(max(0, d + random.uniform(-.12, .12)) * len(FUEGO)))]
elif col is None:
col = random.choice(FRIO)
s.monigote(x, y, h, col, random.uniform(-.06, .04), random.random() < .35, random.random() < puños)
return len(g)
def svg(s):
return (f'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 {s.Y0} {s.W} {s.H}" width="{s.W}" height="{s.H}">{DEFS}'
+ "".join(s.o) + f'<rect y="{s.Y0}" width="{s.W}" height="{s.H}" filter="url(#grano)" opacity=".5"/>' + "</svg>\n")
def regueros(c, portales, n=7):
return [(c.FACH + .5, zd + .75, LUCHAS[i % len(LUCHAS)], n) for i, zd in enumerate(portales)]
# 1 · La calle mejorada: regueros de colores desde cada portal hacia la piña
def b1():
random.seed(11); c = Calle(Y0=100)
pts = (4.0, 7.5, 11.5, 17.5, 26.0)
c.dibujar_calle(pts)
c.gente((-.3, 11, 2.1, 3.6, 9000, 2.8), regueros(c, pts[:4]))
return c
# 2 · A pie de calle: cámara más baja, la gente cerca y grande
def b2():
random.seed(12); c = Calle(EYE=3.0, VY=170, F=560, Y0=60)
pts = (5.0, 9.0, 14.0, 21.0, 32.0)
c.dibujar_calle(pts)
c.gente((.2, 9.5, 2.2, 3.5, 9000, 2.6), regueros(c, pts[:4], 6), puños=.18)
return c
# 3 · Hacia la luz: la piña arde al fondo y los regueros bajan de los portales hacia ella
def b3():
random.seed(13); c = Calle(Y0=100)
pts = (4.0, 7.0, 10.5, 15.0, 21.0, 29.0)
c.dibujar_calle(pts)
c.gente((.2, 19, 1.8, 4, 7000, 3.6), regueros(c, pts[:5], 9))
return c
# 4 · De frente: la piña viene hacia quien mira, con más puños en alto
def b4():
random.seed(14); c = Calle(EYE=4.0, VX=1100, VY=130, F=560, Y0=80)
pts = (4.5, 8.0, 12.0, 18.0, 27.0)
c.dibujar_calle(pts)
c.gente((.3, 7.5, 2.4, 2.6, 9000, 2.4), regueros(c, pts[1:4], 6), puños=.28)
return c
# 5 · El cruce: una calle corta la nuestra y de ella también llega gente
def b5():
random.seed(15); c = Calle(Y0=100)
pts = (4.0, 7.0, 17.0, 24.0)
cruce = (10.0, 14.0)
c.dibujar_calle(pts, cruce)
lateral = [(-14 + k * 1.3, 12 + random.uniform(-1.2, 1.2), "#14965a" if k % 2 else "#d6336c") for k in range(8)]
c.gente((-.5, 12.5, 2.2, 3.5, 9000, 2.8), regueros(c, (4.0, 7.0, 17.0)), extra=lateral)
return c
os.makedirs(OUT, exist_ok=True)
for n, f in enumerate([b1, b2, b3, b4, b5], 1):
open(f"{OUT}/boceto-{n}.svg", "w").write(f().svg())