La Cebolla Magica: Como Ver el Pasado y el Futuro al Mismo Tiempo

El cuaderno magico de los animadores

¿Alguna vez hiciste un dibujo en la esquina de un cuaderno y luego pasaste las hojas rapido con el dedo para que pareciera una pelicula? Eso se llama flipbook, y es la forma mas antigua de animacion del mundo. Cada pagina es un “fotograma” (frame). Cuando los pasas rapido, tu cerebro los une y ve movimiento.

Pero hay un problema: cuando estas dibujando la pagina 5, no puedes ver la pagina 4. Ya la tapaste. Entonces dibujas a ciegas, confiando en tu memoria. ¿No seria genial ver la pagina anterior como un fantasma debajo de la nueva?

Eso es exactamente lo que hace el “onion skin” (piel de cebolla) en nuestra aplicacion movil FAP. Y lo hace con matematicas que saben a cocina.

¿Por que se llama piel de cebolla?

Pela una cebolla. Veras capa tras capa tras capa, cada una un poquito mas transparente que la anterior. Las capas externas dejan ver las internas. En animacion, el onion skin hace lo mismo: te muestra capas fantasmas de los dibujos anteriores y siguientes, para que puedas dibujar el frame actual viendo como referencia lo que paso antes y lo que viene despues.

En nuestra aplicacion, mostramos 3 capas hacia atras (los frames que ya dibujaste) y 3 capas hacia adelante (los frames que dibujaras despues). Las capas anteriores se ven ROJAS, como un recuerdo calido. Las capas siguientes se ven VERDES, como una premonicion fresquita.

 

La formula de la transparencia

Cada capa tiene una transparencia (tambien llamada “opacidad” o “alfa”) que se calcula con esta formula:

alfa(i) = 0.35 × (1 - (i-1) × 0.25)

Donde i es el numero de capa: i=1 es la capa mas cercana al dibujo actual, i=2 es la siguiente, i=3 es la mas lejana.

Vamos a calcular los valores para entenderlos:

Capa 1 (la mas cercana, i=1):

alfa(1) = 0.35 × (1 - 0 × 0.25) = 0.35 × 1 = 0.35

Esta capa se ve al 35% de intensidad. Es bastante visible, como un fantasma no muy timido.

Capa 2 (i=2):

alfa(2) = 0.35 × (1 - 1 × 0.25) = 0.35 × 0.75 = 0.2625

Un 26.25%. Ya se nota mas tenue.

Capa 3 (la mas lejana, i=3):

alfa(3) = 0.35 × (1 - 2 × 0.25) = 0.35 × 0.50 = 0.175

Solo 17.5% de intensidad. Casi un susurro visual.

¿Ves el patron? Cada capa que se aleja pierde un 25% de intensidad respecto a la maxima. Es como si la cebolla magica tuviera capas que se desvanecen progresivamente. La capa 1 es como un vidrio esmerilado claro; la capa 3 es como un vidrio casi opaco.

¿Por que rojo y verde?

Los colores no son capricho. El rojo y el verde son colores complementarios (estan opuestos en el circulo cromatico). Cuando los ves juntos, tu cerebro los separa instantaneamente. Nunca confundiras una capa del pasado (roja) con una del futuro (verde).

Imagina que estas dibujando una pelota que rebota. En el frame actual, la pelota esta en el suelo. En las capas rojas (pasado), ves versiones fantasmales de la pelota cayendo desde arriba. En las capas verdes (futuro), ves la pelota empezando a subir. Con esta informacion, sabes exactamente hacia donde dibujar la pelota en el frame actual.

La operacion secreta: source-atop

Hay un truco de programacion que hace que la magia funcione. Se llama globalCompositeOperation = 'source-atop'. Suena a conjuro de Harry Potter, pero es mas simple.

Cuando dibujas en un canvas (el lienzo digital), normalmente cada trazo nuevo tapa lo que habia debajo, como pintar con marcador sobre papel. Pero con source-atop, el trazo nuevo SOLO aparece donde ya habia pintura debajo. Es como si tuvieras una hoja con un dibujo y pusieras encima un papel de calcar: solo puedes dibujar encima de las lineas que ya existen.

Esto es crucial para el onion skin: las capas fantasma se dibujan PRIMERO, y luego tu dibujo actual se pinta ENCIMA usando source-atop. Asi, los trazos del pasado y del futuro quedan atrapados DEBAJO de tu trazo actual, como capas geológicas.

¿Como se veria sin onion skin?

Te lo digo por experiencia: un desastre. Dibujarias la posicion de la pelota “a ojo”, y cuando pasaras los frames, la pelota daria saltos raros, se encogería, se estiraria de golpe. La animacion pareceria hecha por un robot borracho.

Con onion skin, puedes ver que en el frame anterior la pelota estaba 3 milimetros a la izquierda, y decides moverla 3 milimetros a la derecha en este frame. El movimiento es fluido, natural, profesional.

El nombre verdadero

La tecnica se llama onion skin porque en la epoca del papel, los animadores dibujaban en hojas de cebolla (papel de cebolla), que es semitransparente. Apilaban varias hojas y podian ver todos los dibujos anteriores a traves del papel. Nuestra aplicacion hace exactamente lo mismo, pero con matematicas en vez de papel.

Ahora, cada vez que dibujes en FAP Mobile, recuerda: estas pelando una cebolla magica que te deja ver el tiempo. Tus trazos rojos son el eco de lo que fue. Tus trazos verdes son el susurro de lo que sera. Y tu, en el medio, eres el presente que conecta los dos mundos.