Shadertoy - Shadertoy

Shadertoy.com er et online-fællesskab på tværs af browsere og værktøj til oprettelse og deling af shaders via WebGL , der bruges til både læring og undervisning i 3D computergrafik i en webbrowser .

Oversigt

Et procedurebillede lavet i Shadertoy med afstandsfelter, modelleret, skraveret, oplyst og gengivet i realtid

Shadertoy.com er et onlinefællesskab og platform for computergrafikprofessionelle , akademikere og entusiaster, der deler, lærer og eksperimenterer med gengivelsesteknikker og procedurekunst gennem GLSL -kode. Der er mere end 52 tusinde offentlige bidrag i midten af ​​2021 fra tusindvis af brugere. WebGL tillader Shadertoy at få adgang til computerkraft af GPU til at generere proceduremæssig kunst, animation, modeller, belysning, stat baseret logik og lyd.

Historie

Shadertoy.com blev oprettet af Pol Jeremias og Inigo Quilez i januar 2013 og kom online i februar samme år.

Indsatsens rødder er i Inigos "Shadertoy" -afsnit på hans edb -websted for computergrafik. Med ankomsten af ​​den første WebGL -implementering af Mozillas Firefox i 2009, oprettede Quilez det første online live -kodningsmiljø og kuraterede lager af proceduremæssige shaders. Dette indhold blev doneret af 18 forfattere fra Demoscene og fremviste avancerede real-time og interaktive animationer, der aldrig er set på internettet før, såsom raymarcherede metaballer, fraktaler og tunneleffekter.

Efter at have arbejdet sammen i flere real-time gengivelsesprojekter sammen i årevis, besluttede Quilez og Pol i december 2012 at oprette et nyt Shadertoy-websted, der ville følge traditionen med den originale Shadertoy-side med dets demoscene-aromatiserede ressource og størrelse begrænset grafik i realtid indhold, men ville tilføje sociale og samfundsmæssige funktioner og omfavne en open-source-holdning.

Siden kom ud med live-editoren, afspilning i realtid, browsing og søgefunktioner, tagging og kommentarfunktioner. Indholdsmæssigt leverede Shadertoy et fast og begrænset sæt teksturer, som brugerne kunne bruge på kreative måder. I årenes løb har Shadertoy tilføjet ekstra funktioner, såsom understøttelse af webcam og mikrofonindgang, video, musik, Virtual Reality-gengivelse og multi-pass-gengivelse.

Der er over 31 tusind bidrag i alt fra tusindvis af brugere, hvoraf flere er refereret i akademiske artikler. Shadertoy er også vært for årlige konkurrencer og arrangementer for sit samfund at nyde, såsom Siggraph 2015 Shadertoy Competition

Funktioner

• Redigering: editor fremstillet af syntaks med øjeblikkelig visuel feedback
• Socialt: kommenterer shadertoys, stemmer (liker)
• Deling: permanente webadresser, integreret i andre websteder, privat shader -deling
• Rendering: floating point buffer baseret multipass og historik
• Medieindgange: mikrofon, webcam, tastatur, mus, VR HMD'er, soundcloud, video, teksturer

Anvendelse

Et eksempel på en procedureanimation oprettet i Shadertoy kan være følgende firkantede tunnel:

void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    // input: pixel coordinates
    vec2 p = (-iResolution.xy + 2.0*fragCoord)/iResolution.y;

    // angle of each pixel to the center of the screen
    float a = atan(p.y,p.x);
    
    // modified distance metric
    float r = pow( pow(p.x*p.x,4.0) + pow(p.y*p.y,4.0), 1.0/8.0 );
    
    // index texture by (animated inverse) radius and angle
    vec2 uv = vec2( 1.0/r + 0.2*iTime, a );

    // pattern: cosines
    float f = cos(12.0*uv.x)*cos(6.0*uv.y);

    // color fetch: palette
    vec3 col = 0.5 + 0.5*sin( 3.1416*f + vec3(0.0,0.5,1.0) );
    
    // lighting: darken at the center    
    col = col*r;
    
    // output: pixel color
    fragColor = vec4( col, 1.0 );
}

Koden ovenfor genererer følgende billede:

Nævner

Der henvises til Shadertoy.com i flere kilder:

• NVidia udviklerblog , juni 2016, Shadertoy Contest 2016 annonceret.
• Siggraph Live i realtid! , 2015, et interaktivt lydvisualiseringsprojekt.
• Hacker News , 2014, Shadertoy tilføjer proceduremæssigt GPU-genereret musik i browseren.
• Numeriske metoder til strålesporing af implicit definerede overflader ,
• CS 371 -kursus på Williams College , 2014, Inspiration til CS 371
• Rendering i realtid , aug 2015, syv ting for 20. august 2015.

Referencer

eksterne links

• Officiel hjemmeside