learn GLSL from zero
ToolsCrea con shadersShader MakerCrea shaders gratis en líneaToolkitObras de shaders listas para tu webSketcher LabPinta el hero de tu landing con shaders3D StudioEl editor Three.js en tu navegador
GamesJuega con shadersOnomatoShaderEscribe una palabra y explótalaThe WatcherUn ojo que te sigueAetherVidrio líquido con un ojo adentroBloomcoreUna palabra hace crecer un jardín de luzPyrokineAvienta fuego a la paredVoltaicLa pirámide lanza rayosSurfSurfea un océano de shader

Lección 6 de 10 · Patrones en shaders

La espiral

El vórtice. Figuras cayendo al centro.

En la lección anterior usaste el ángulo para hacer rebanadas. Ahora le sumas la distancia al centro, y las rebanadas se tuercen. Se convierten en espiral.

El truco: donde antes tenías sin(ang * 3.), ahora tienes sin(ang * 3. + dist * 6.). La distancia empuja el patrón angular y lo enrolla. Más distancia = más empuje = más giro.

Ángulo + distancia. La curva que no termina.

ang + distEl ángulo te da la dirección. La distancia te da qué tan lejos estás del centro. Cuando los sumas dentro de un sin(), las rayas radiales se curvan. Es el mismo truco que usaste con + T para rotar, pero ahora en vez del tiempo, es el espacio el que tuerce.
PruebaCambia el 6. a 12., espiral más apretada. A 2., espiral suelta. Súmale - T al final para que gire. Pista: sin(ang * 3. + dist * 6. - T)
Freebie

SPECTRUM

Busca // reemplaza esto en el código y cambia esa línea por esta:
col = iri(v * 0.6 + dist * 0.4 + T * 0.1) * (.5 + geo * .5);

Pégalo. La espiral cobra todos los colores del espectro.

El código

[object Object]
close