¿Qué algoritmo se usa en la animación de la ventana "Acerca de" de uTorrent?


8


En una versión reciente de uTorrent, si abre la ventana Acerca de , verá un fondo animado, que es una especie de ondas que duran para siempre.
¿Cómo se puede lograr esto? ¿Es este tipo de algoritmo conocido / clase de algoritmos?
Gracias.
ingrese la descripción de la imagen aquí


1
@trichoplax Eliminé la foto y agregué un GIF. Gracias.
Wfi Okly

Parece un efecto de ciclo de paleta. La imagen en sí es estática.
PaulHK

Respuestas:


9

Como descubrió y mencionó en su respuesta personal, el patrón en el fondo parece ser una suma de gradientes sinusoidales.

Sin embargo, el ejemplo vinculado en su respuesta es más complicado que el utilizado por µTorrent. El fondo de la ventana Acerca de parece ser un patrón estático, en lugar del patrón sinusoidal animado utilizado en la publicación de plasma.

Se han sumado varios gradientes sinusoidales para dar una sola imagen, y la ilusión de movimiento se da simplemente ciclando los colores en esa imagen, en lugar de generar varias imágenes diferentes. Esto es más notable si te enfocas en el centro de uno de los anillos de color. En el patrón µTorrent, notará que cada anillo permanece en un lugar y que el color fluye dentro o fuera de él. Por el contrario, los anillos de color en el patrón completamente animado se mueven, dividiéndose o fusionándose ocasionalmente.

El enfoque simplificado utilizado por µTorrent recuerda a las animaciones utilizadas en el pasado al recalcular los patrones sinusoidales de que cada cuadro no era realista.



2

El efecto se puede recrear más o menos agregando 2 (o más) sinusoides radiales juntos y animando la fase resultante a través de otra función seno.

Use www.shadertoy.com para verificar.

   void mainImage( out vec4 fragColor, in vec2 fragCoord )
   {
       vec2 uv = fragCoord.xy / iResolution.xy;
       float d = sin(length(uv - vec2(0.5)) * 35.0) + sin(length(uv - vec2(0.2,0.3)) * 45.0);
       d = sin(d * 4.0 + iGlobalTime * 4.0)*0.5+1.0;
       fragColor = vec4(d,d,d,1.0);
   }

1
Para algo más interesante, también puede animar el origen de las formas radiales. -> float d = sin (longitud (uv - vec2 (0.5)) * 35.0) + sin (longitud (uv - vec2 (0.2 + sin (iGlobalTime), 0.3)) * 45.0);
PaulHK
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.