[effect] Mario Cube FX

Share your Construct 2 effect files

Post » Sun Mar 12, 2017 9:54 pm

Hi nice people ;

@matriax asked me if it's possible to map 6 faces cube according faces disposed with 3D Cube map textured style ;
Don't forget C2 is not using vertex shader so it's not possible in teory;

https://en.wikipedia.org/wiki/File:Skybox_example.png

So after 5 day of intensive work and combining some gls code i have made demo and it's working at 60 fps;

http://gigatron3k.free.fr/html5/C2/FX/mcube

** Please don't rip this shader with this demo... simply let me release it..
http://gigatron3k.free.fr/Intro/

https://www.shadertoy.com/user/gigatron

https://twitter.com/realistquantum

Ezekiel 1-4 ; ufo landing explanation ..

CONSTRUCT 2 THE ONLY FAST WAY TO HTML5

Image
B
57
S
20
G
29
Posts: 804
Reputation: 21,969

Post » Mon Mar 13, 2017 2:11 pm

Really Interesting, works like a 3D cube on we can texture each side or with zoom-big object work as a Skybox.

Some questions:

1.- The cube only appears inside the X/Y size of the sprite, if you make it bigger looks cutted. I saw some shaders that on applied to a for example a 64x64 sprite in the runtime the effect looks out that size. This is because a shader can work out the sprite limitations in some way or because on runtime the sprite limits goes big to fits the shader requeriments? Is to understand better how shaders works.

2.- The textures have some smoothing/mipmap/bilinear, is possible add an option to switch that? to select Nearest or Bilinear, in case we want to preserve real pixels?. In the same way, the cube, talking about the polygon no have antialias, any chances to apply?

3.- Any way to Transform the model? I mean make the X,Y,Z more bigger/short. For example scale the Y to use it as a column or as a building.


PD. Why the "Mario Cube" name? :P
B
23
S
10
G
3
Posts: 538
Reputation: 4,426

Post » Mon Mar 13, 2017 2:51 pm

The demo let me think of the program "prepakura" in reverse. keep up the good work!
B
79
S
28
G
108
Posts: 194
Reputation: 59,906

Post » Mon Mar 13, 2017 5:14 pm

matriax wrote:Really Interesting, works like a 3D cube on we can texture each side or with zoom-big object work as a Skybox.

Some questions:

1.- The cube only appears inside the X/Y size of the sprite, if you make it bigger looks cutted. I saw some shaders that on applied to a for example a 64x64 sprite in the runtime the effect looks out that size. This is because a shader can work out the sprite limitations in some way or because on runtime the sprite limits goes big to fits the shader requeriments? Is to understand better how shaders works.

2.- The textures have some smoothing/mipmap/bilinear, is possible add an option to switch that? to select Nearest or Bilinear, in case we want to preserve real pixels?. In the same way, the cube, talking about the polygon no have antialias, any chances to apply?

3.- Any way to Transform the model? I mean make the X,Y,Z more bigger/short. For example scale the Y to use it as a column or as a building.

PD. Why the "Mario Cube" name? :P


1 - The sprite area is the Quad like shadertoy uv screen or c2 vTex ;
2 - maybe in c3;
3 - scale the sprite in editor ?
Mario cube ... really don't know ;)
http://gigatron3k.free.fr/Intro/

https://www.shadertoy.com/user/gigatron

https://twitter.com/realistquantum

Ezekiel 1-4 ; ufo landing explanation ..

CONSTRUCT 2 THE ONLY FAST WAY TO HTML5

Image
B
57
S
20
G
29
Posts: 804
Reputation: 21,969

Post » Mon Mar 13, 2017 6:42 pm

1- Understood
2- So actualy in C2 there is no way to apply antialias to 3D render or use Nearest instead Bilinear? :(
3- I mean scale the Cube rendered by the shader, to make more tall, short or depth.

Then seems actually is not possible do what i want in this way. Really hope C3 comes with vertex shaders and the rest of options you need to unlock all the potential. Will be great have in C3 the chances to do 2D games with the option to add 3D things with some properties to adapt it as our needs.
B
23
S
10
G
3
Posts: 538
Reputation: 4,426

Post » Tue Mar 14, 2017 11:44 pm

matriax wrote:1- Understood
2- So actualy in C2 there is no way to apply antialias to 3D render or use Nearest instead Bilinear? :(
3- I mean scale the Cube rendered by the shader, to make more tall, short or depth.

Then seems actually is not possible do what i want in this way. Really hope C3 comes with vertex shaders and the rest of options you need to unlock all the potential. Will be great have in C3 the chances to do 2D games with the option to add 3D things with some properties to adapt it as our needs.


@matriax
glmatrix 2.0 will resolve the problem...

I made another example based on box mapped with specular not based on triangles vertices;

http://gigatron3k.free.fr/html5/C2/FX/mcube2

And here is the fx;
http://gigatron3k.free.fr/html5/C2/FX/mcube2.rar

You can scale only the box on x y z and see mapped texure wich scaled with static value;
this mean all faces are scaled separately the box; however if you want make building Set the x, y or z face scale to the minimum instead of maximum, and zoom it : in this demo the size of sprite is 450x450;

texture disposition format must exactly like this; i used this texure in demo;
https://en.wikipedia.org/wiki/File:Skybox_example.png

good luck ;
http://gigatron3k.free.fr/Intro/

https://www.shadertoy.com/user/gigatron

https://twitter.com/realistquantum

Ezekiel 1-4 ; ufo landing explanation ..

CONSTRUCT 2 THE ONLY FAST WAY TO HTML5

Image
B
57
S
20
G
29
Posts: 804
Reputation: 21,969

Post » Wed Mar 15, 2017 10:57 am

Hi @gigatron , first of all thanks for the plugin!.

Looks promising, but i realized some problem with the camera, here is a twitter post with a video i made:
https://twitter.com/DavitMasia/status/8 ... 3825052676

Without the ScrollTo is more evident that the cube is "floating".

Is there anyway to change how the camera works? I mean, is there anyway to change the X,Z,Y position of the camera? Also rotate the X,Y,Z of the camera. This will bring a lot more options.

I know you said you will wait to C3 for develop more shaders, maybe in C3 there will need some edits or do since 0 again so only asking if can be done in a easy way, otherwise not worry only a few weeks to the C3 beta so no problem.

I think with some tweaks a shader like this can be used to do topDown shooters, Platforms or real 3D games like Doom or Wolf3D in a easy way that can be awesome.


P.D. Also discovered that turn Sampling to "Point" instead "Linear" show real pixels with no antialias or texture smoothing that is great for some retro games.

----

Edit 1: I made a stress test with this results:
In a GeForce 670 GTX With 150 sprites at 256x256 pixels using 1024x texture and one light for each cube starts to break :P
https://twitter.com/DavitMasia/status/8 ... 0237495296

The game drops at 50 but still runs well, but the recording goes crazy and gots freezed XD . No matter if the cubes are rotating or not, or if the textures have smooth sampling or not the perfomance is the same. The problems is the number of sprites and their size, then the perfomance drops considerably :( . BTW, i guess still there is no optimization and maybe also the use of one light for each cube instead one for all can affect to that and can be improved a lot.

Edit 2: Editing the shader
I removed the light (Spec and spow parameters) and not gain all the perfomance as i thought. Without light the number of cubes before frame downs increases to 15 more but is not the big thing. So i guess is the mathematical stuff that i not understand. Btw, i'm going to try editing things and doing tests for curiosity :P


Perfomance tests:
Shader Perfomance tests before frame drops in cubes on screen:
64x = 1600
256x = 160
512x = 60

I found something weird. Cubes without movementin the screen static, simply placing the shader and the same perfomance. If the shader no changes their position and the cube is not rotating decreases the frame drops. So i guess the actual shader render always that he cans even if there is no information-change.
B
23
S
10
G
3
Posts: 538
Reputation: 4,426

Post » Wed Mar 15, 2017 9:39 pm

Doing another post because the other one was already too big.

I continue doing more test and i found some weird thing that improves the perfomance a lot lossing some alpha in the cube borders ¿? .

// The perfomance problem?
float trace(vec3 o, vec3 r)
{
float t = 0.0; //
// Some kind of weird alpha around the cube ¿?
for (int i = 0; i < 64; ++i) { // 64 = 150cubes | 32 = 300 cubes | 16 = 450 cubes on screen (256x Sprites)
vec3 p = o + r * t;
float d = map(p).x;
t += d;
}
return t;
}


With 64 the cube looks right without any alpha loss around there. With less, the perfomance is improved a lot but with that weird thing.

Why this thing? Is like each 3D cube is formed overlapping 64 alpha renders :O . Why not create the cube using simply quad/triangles polygons? Or i'm missing something ¿? .
B
23
S
10
G
3
Posts: 538
Reputation: 4,426

Post » Thu Mar 16, 2017 1:26 am

@matriax
This shader using iterations for the precision (raymarching shader); You must need minimum 64 iterations
this is normal value, imagine some shaders have 200 iterations...
If you want gain a bit speed , you can break the loop if precision become lower than 0.001; the ray considering
nothing to hit;

// The perfomance problem?
float trace(vec3 o, vec3 r)
{
float t = 0.0; //
// Some kind of weird alpha around the cube ¿?
for (int i = 0; i < 64; ++i) { // 64 = 150cubes | 32 = 300 cubes | 16 = 450 cubes on screen (256x Sprites)
vec3 p = o + r * t;
float d = map(p).x;
if (d<0.001) break; //This will stop the loop ... and consider that the ray has nothing more to detect
t += d;
}
return t;
}

The first shader demo use triangles : http://gigatron3k.free.fr/html5/C2/FX/mcube
instead of raymarching like here ;
http://gigatron3k.free.fr/Intro/

https://www.shadertoy.com/user/gigatron

https://twitter.com/realistquantum

Ezekiel 1-4 ; ufo landing explanation ..

CONSTRUCT 2 THE ONLY FAST WAY TO HTML5

Image
B
57
S
20
G
29
Posts: 804
Reputation: 21,969

Post » Thu Mar 16, 2017 9:32 am

@Gigatron Not a real gain. Between the same or 10 more cubes on screen with different tests.

Also i found another perfomance thing. If the sprite is 512x512 but the cube with their zoom is only for example 64x64 size their perfomance in screen is the same with the cube at 512x512 or 32x32 or whatever :S . The perfomance only improves with the size of the sprite not the shader render content. Maybe was obviously but i didn't know that.

So, what is the real difference between Raymarching and using triangles in terms of quality or features? Because after know how raymarching works seems is a GPU consuming :S .

Can you post the first Cube shader that uses triangles please? I want to test their perfomance to see how much difference is.

---

Interesting shaders i found that may improve the perfomance:
-----------------------------------------------------
Triangle Rasterize shader with a cube textured:
https://www.shadertoy.com/view/XdlGzn
----------------------------------------------------
Cheap Cubemap:
https://www.shadertoy.com/view/ltl3D8
B
23
S
10
G
3
Posts: 538
Reputation: 4,426

Next

Return to Effects

Who is online

Users browsing this forum: No registered users and 0 guests