[GM:S] Polish Shader Library

[PsichiX]

Lista gotowych exampli shaderów:

1. Heat Haze

   Screenshot: https://dl.dropboxusercontent.com/u/9759049...l_heat_haze.PNG

2. Outline

   Screenshot: https://dl.dropboxusercontent.com/u/9759049/psl_outline.PNG

3. Normal Mapping

   Screenshot: https://dl.dropboxusercontent.com/u/9759049...mal_mapping.PNG

4. Vintage Sepia

   Screenshot: https://dl.dropboxusercontent.com/u/9759049...ntage_sepia.PNG

5. Noctovision

   Screenshot: https://dl.dropboxusercontent.com/u/9759049...noctovision.PNG

6. Thermalvision

   Screenshot: https://dl.dropboxusercontent.com/u/9759049...ermalvision.PNG

7. Water

   Screenshot: https://dl.dropboxusercontent.com/s/lknyql2...s/psl_water.PNG

8. Blur

   Screenshot: http://dl.dropboxusercontent.com/u/9759049/psl_blur.PNG

9. Bloom

   Screenshot: http://dl.dropboxusercontent.com/u/9759049/psl_bloom.PNG

10. GPU Game of Life

    Windows Executable

    Screenshot: http://dl.dropboxusercontent.com/u/9759049...ame_of_life.PNG

11. Dynamic Points (Snow)

    Screenshot: http://dl.dropboxusercontent.com/u/9759049...amic_points.PNG

12. RandomNoise

    Screenshot: http://dl.dropboxusercontent.com/u/9759049...randomnoise.PNG

13. Top Down Effects

    Screenshot: http://dl.dropboxusercontent.com/u/9759049..._td_effects.PNG

14. Atmos (Dynamic Sky Simulation)

    Screenshot: http://dl.dropboxusercontent.com/u/9759049/psl_atmos.PNG

15. Recolorize (HSV)

    Screenshot: http://dl.dropboxusercontent.com/u/9759049..._recolorize.PNG

16. Radial Blur

    Screenshot: http://dl.dropboxusercontent.com/u/9759049..._radialblur.PNG

17. Fish Eye Distortion

    Screenshot: http://dl.dropboxusercontent.com/u/9759049/psl_fisheye.PNG

18. Repaint

    Screenshot: http://dl.dropboxusercontent.com/u/9759049/psl_repaint.PNG

19. Dithering (Black & White)

    Screenshot: http://dl.dropboxusercontent.com/u/9759049/psl_dithering.PNG

20. Dithering (Color)

    Screenshot: http://dl.dropboxusercontent.com/u/9759049...ering_color.PNG

 

 

 

Witajcie! Jak wiecie, lub nie, specjalizuję się w programowaniu i optymalizacjach programów GPU (głównie GLSL i AGAL) jak i całych efektów. Z racji, że mamy w polsce świetnych koderów w GMie, a ja od dawien dawna próbuję zachęcić możliwie jak największą ilość osób do uzywania shaderów, to teraz, kiedy GM:S W KOŃCU je używa, mam możliwość nauczyć Was jakie nieograniczone możliwości jesteście w stanie osiagnąć w Waszych grach, dzięi którym zauroczycie także graczy napalonych na wizurę.

Mój deal jest taki: ja Wam w tym temacie będę co jakiś czas podrzucał całe techniki efektów razem z możliwie najdokładniejszym ich opisem, a Wy (z racji, że macie GM:S i przede wszystkim kompa, a ja niestety nie), wedle materiału, jaki Wam dostarczę, będziecie tworzyć ich wersję w GM:S. Finalne prace będą trafiać na githuba, którym będziemy się dzielić z ogólnoświatowym community, aby także zauważyli, że i polacy nie gęsi i swoje shadery mają :)

Co Wy na to? Ktoś pomoże? W końcu dzielę się wieloletnią wiedzą i to za free, więc myślę, że nie ma sensu trzymać tego tylko dla siebie.

 

Co mogę Wam na początek zaoferować:

 

 

 

 

 

[Compi]

A jak to zrobić?

[gnysek]

Spoczko, przy okazji będzie się można tego i owego nauczyć :)

[PsichiX]

1. Trzeba posiadać GM:S

2. Trzeba poznać nowy flow renderowania, głównie funkcje z grupy shader i vertex_cośtam - z reguły obejdzie się bez vertex_cośtam, ale niektóre efekty będą wymagały użycia właśnie customowych shape'ów, więc znajomość ich tworzenia przyda się do złożonych efektów.

3. Ja dostarczę opis techniki, który będzie zawierał dokładne informacje o tym, gdzie i kiedy użyć shadera takiego, a takiego, jaki layout i jakie dane musi posiadać customowy vertex buffer, kiedy i z czym go aktywować i jak wypełnić, a Wy będziecie mój przykładowy pseudo-kod zamieniać na GMowy - jest to na tyle uniwersalny wszędzie sposób użycia, że spokojnie da się go przeportować do GM:S.

4. rezultat (plik wynikowy, plik projektu jak i kod w tagu GML) wrzucacie do posta, a ja go weryfikuje czy na oko zgadza się (dokumentację GMa z nowymi funkcjami znam, więc spokojnie mogę robić code review).

5. Jeśli moje code review przejdzie i nikt inny także się nie przyczepi do czegoś, projekt trafia na githuba (i może na specjalnie założoną do tego stronkę na subdomenie gmclanu).

 

Na początek dam Wam prosty efekt, gdzie nie będzie trzeba używać vertex bufferów, a będą same operacje na pixelach i w ten sposób oswoję Was z tym. Będziemy robić kolejne coraz bardziej złożone efekty razem :)

[I am Lord]

Jak efekty nie będą wykraczać poza możliwości free GMS ( limit 2 shaderów ) to mogę spróbować coś zrobić.

Chcę się trochę nauczyć o tych shaderach.

[PsichiX]

na szczescie YoYoGames jest na tyle głupie w tym temacie, że nie znają czegoś takiego, jak Ubershadery - można tak grupować shadery, by do tego dało się użyć jednego pliku, a w rzeczywistości używać więcej efektów. oczywiście jest to także nałożone limitem takim, iż nie wszystko da się połączyć, zwłąszcza jeśli chodzi o różnicę danych dostarczanych różnym shaderom. ale spoko, nie takie rzeczy się obchodziło na około i możnaby spróbować rozwiązać i taki problem.

EDIT: No i nakład wydajnościowy dynamic branchingu może boleć, ale jak wyżej - spróbować to rozwiązać można.

[Cyreptor]

To wygląda na interesujące. Skąd je masz panie Psyhix?

[PsichiX]

sam je pisalem, metoda prob i bledow. na dodatek to sa jeszcze te stare efekty, maja z ponad 2 lata, jak nie wiecej :P

[gnysek]

Narazie gadanie i gadanie, a moze czas cos zrobić ? ;)

[I am Lord]

Właśnie kupiłem GMSa to można zaczynać :D

Narazie z shaderów to bawiłem się tylko kolorkami, a jestem ciekawy jak się zgina ekran w jaki kolwiek sposób..

[PsichiX]

dobrze, to jeśli macie propozycje, jakie efekty chcielibyście uzyskać, to opiszcie mi je, ja je posortuje w kolejności od najprostrzego do najtrudniejszego i zaczynamy :)

[I am Lord]

No to mi się przyda efekt rozchodzenia się fali uderzeniowej z wybuchu.

[gnysek]

jeśli chodzi o efekty pełnoekranowe, to musisz przypisać view do surface (view_surface_id[id] = surfaceID), a potem surface malować np. w draw gui w najgłębszym obiekcie (albo w osobnym ale też z namniejszym depth). Przypominam, że w GM:S malujemy na surface tylko w draw, a dodatkowo należy zawsze przed surface_set_target sprawdzać czy surface istnieje i jak nie to go utworzyć, bo surface są usuwane przez wygaszacz ekranu/usypianie urządzeń/inne aplikacje pełnoekranowe/zmiany rozdzielczości

[I am Lord]

To wiem, robiłem efekt pełno ekranowy na Lidze24 o shaderach. Z tym że z użyciem 2 viewów.

[Uzjel]

ΨΧΞ już szykuję listę. Jak wrócę z urlopu to się odezwę B-)

[Threef]

Mieliśmy usiąść do napisania tutków, ale taka idea jest chyba lepsza. Ale i tak jestem do twojej dyspozycji.

[gnysek]

Na razie to nic nie jest zrobione, bo główny pomysłodawca tylko dyskutuje i planuje a nie daje żadnych danych :/

[PsichiX]

dobrze, to jeśli macie propozycje, jakie efekty chcielibyście uzyskać, to opiszcie mi je, ja je posortuje w kolejności od najprostrzego do najtrudniejszego i zaczynamy :)

Gnysku :*

[gnysek]

U góry podałeś kilka przykładów od których mozna zacząć, a wodą nawet się ktoś zainteresował.

 

Blur

Outline (z wyborem jego koloru)

Woda

Lód / Śnieg / Szkło

bump mapping

vintage

termo gogle

noktowizor

 

Edit: i jeszcze fajnie by było przerobić te: http://gmc.yoyogames.com/index.php?showtopic=492876 :)

[I am vader]

Załamanie światła(takie jak od wysokiej temperatury?)

[I am Lord]

Można by było na 3D coś zrobić. Dać jakieś światło i shader bumpa + spec jak by się dało :D

Finalna textura na ściane by się tak składała z 3 texturek. Wiem że można wysłać 1 texturkę na shader w GM ale czy więcej naraz?

[PsichiX]

Załamanie światła(takie jak od wysokiej temperatury?)

Heat-haze. Da sie prosto, chyba nawet może być to pierwszym efektem :)

[PsichiX]

Witajcie, oto pierwszy shader, jaki chce z Wami przekonwertowac do GM:S - Heat-haze.

Ten shader jest na tyle prosty, ze moge sprobowac dac go Wam w formie od razu gotowej dla GMa.

 

Vertex shader:

attribute vec3 in_Position;
attribute vec2 in_TextureCoord;
varying vec2 coord;

void main()
{
   coord = in_TextureCoord;
   gl_Position = gm_Matrices[MATRIX_WORLD_VIEW_PROJECTION] * vec4(in_Position, 1.0);
}

 

Fragment shader:

varying vec2 coord;
uniform vec4 uPhase;

void main()
{
   vec2 phs = vec2(cos(uPhase.z + (coord.y * uPhase.w)), sin(uPhase.z + (coord.x * uPhase.w)));
   vec2 crd = coord + (phs * uPhase.xy);
   vec4 col = texture2D(gm_BaseTexture, crd);
   gl_FragColor = col;
}

 

teraz aby coś narysować z tym shaderem, w evencie draw:

GML

uPhase = shader_get_uniform(HeatHazeShader, "uPhase");

shader_set(HeatHazeShader);

shader_set_uniform_f(uPhase, 1.5 / sprite_width, 0.5 / sprite_height, current_time * 0.02, 20);

draw_self();

shader_reset();

 

Wrzuccie to do gma i powiedzcie, czy dziala :)

[ediepl]

Działa.

[PsichiX]

super ^^ to zabieram sie za kolejne :D

[Uzjel]

Faaajno. Działa :) Nie mam pojęcie jak, ale działa.

[PsichiX]

hmm, uznalem, ze jest to bardzo latwy przyklad, ale moglem sie mylic. jesli chcecie, to z dzika przyjemnoscia wyjasnie Wam jak dzialaja shadery na powyzszym przykladzie :)

[Uzjel]

Pisz tutki bo widzę, że o tym można książkę napisać :)

[I am Lord]

Działać działa na samym spricie tylko teraz jak zrobić by taki efekt umieścić w dowolnym miejscu w grze tzn. zrobić jakiś obiekt pochodni i ogniska i by ten haze nad nimi sobie był. Domyślam się że trzeba by było kawałek ekranu wyciąć do surface i ten surface do shadera dopiero hmm zastanawiam się, może na coś wpadnę.

[PsichiX]

efekty post-process najlepiej robić w jednym shaderze zmiksowane, z urzyciem masek alpha. po outlinie zrobie taki shader z maską na miejscach gorących + miejscowy bloom aby uwydatnic ogien - bedzie ######ste. przy okazji nauczymy sie uzywac wiecej niz jednej tekstury. zrobilbym to przed outline, ale z racji, ze bloom uzywa tego samego shadera co outline (convolution kernels) to zachowamy kolejnosc stopnia trudnosci efektow. stay tuned :)