3D Effect (Parallax) in GameMaker | Top-Down Parallax with Shaders

[@GameMakerStation]

Thanks for watching! If you use this effect in a project, you can tweet at me, *@itsmatharoo* -- looking forward to seeing your games!

[@ORTmusic]

You've become my fav GMS channel

[@GameMakerStation]

Thank you Connor 😄

[@alexferri9973]

Shaders always scare me a little bit, but that is super clear and well explained. Good job Mataharoo 💪🏼

[@fishouttawatermemes7065]

I was honestly surprised u don't have more subs, dude ur gonna be big!

[@macehilmatecilof4140]

This is so cool, I'm going to have to play around with this. I think it would be cool to layer images of leaves to create a more 3d looking tree. Have the tree object create 3 or 4 more objects on top of it but a few pixels lower to each other with nothing but leaves with the same shader. Bang-bang-boom, you got a 3d tree.

[@jamayetuddinahmed3713]

Really great tutorial and you other tutorials are also great. So far you are one of the best tutorial creator for GMS.

[@posseslayer280]

Besides being very smart and charismatic, you are awesome at teaching

[@chooby4405]

I love the intro

[@leonardocolares5810]

Dude, you are the best!!

[@willm127]

That intro 😂

[@spiritblue5139]

FINALLY. I saw your post on reddit and was waiting for it :D

[@prowokator]

I'm so glad I found your channels! Superb quality content!

[@JustFredrik]

This video is REALLY solid Matharoo! Really good job! Very structured and detailed! :D

[@scottrim7216]

love your videos

[@Waliente]

Great video! Nice job Matharoo :)

[@samcook6250]

Love the funny intro and the shader

[@nuclearbeeberman]

awesome! is this technique used for the pseudo 3d effect in diablo 2 too ? I think your channel is criminally undersubscribed

[@GameMakerStation]

Thanks :) I've never played Diablo 2 before. I did look at some gameplay but didn't see a similar effect...

[@SnakeEngine]

Fantastic. Why don't I see top down games made like this? Anyone know some examples?

[@professionalquestion5415]

Lmfao , that intro was hilarious

[@habarvaz]

Thank you for another great video. Loved the intro!

[@KungFuMaintenance]

Very nice!

[@Nyveon]

Great content Matharoo, keep it up :)

[@GameMakerStation]

Thank you 🙌

[@mfedorov]

Awesome! But what happens if I don't turn off auto cropping?

[@RyzenShine69]

This is such a fantastic idea and to share it with the gamedev community is so daring, what a great heart you have. The 3d effect was good enough and then you showed that lighting trick and I was blown away. It always amazes how shaders can make a simple piece of art look that much greater. Thank you for caring to share this! Subbed.

[@daneemark4266]

Great content ! Keep up the great work bro !

[@GameMakerStation]

Thanks :)

[@krah3219]

Hey very good video matharoo, hey a question how could I do a melee attack in a top down game?

[@GameMakerStation]

Use a hitbox object and check collisions with it -- of course the hitbox should store the ID of whatever instance created it, so it can attack instances other than that one.

[@krah3219]

@@GameMakerStation some way to do this but detecting when the key is pressed and with states? I dont know if i explained well

[@krah3219]

@@GameMakerStation you can make a tutorial for this? I'm really new with gamemaker

[@jfurmann]

I love your videos!

[@mishi6693]

thx for the awesome video!! one question: how did you decide on 1000 for dividing the height in L23 of your shader? Should that number change if your game as a different room size or screen resolution?

[@scrub_jay]

This video is amazing, extremely helpful and I'm glad you made it. I have been planning a top-down game but I could not figure out how to make it work the way I wanted in 2D, and this sort of parallax only just occured to me. I am eager to try it out. It still looks a bit uncanny, but I'm pretty sure it's due to the tree sprite being drawn from a straight-on perspective initially. Do you think it could look even better if the sprites were initially drawn from a higher perspective?

[@GameMakerStation]

Honestly, not sure. I know it looks a bit uncanny, but this was only an example for this video, and in the actual game -- that this example is based off of -- I use a slightly different technique, where the offset applied to each top-vertex is not unique to that vertex's position but the same offset is applied to all vertices in that image. So the distance to the camera is based on like the bottom-center point of the tree rather than the vertex's unique position, and I believe that works out somewhat better for our game. You can see that effect here: twitter.com/itsmatharoo/status/1263092823517257728

[@scrub_jay]

@@GameMakerStation Thanks for the reply! I see -- it does look a bit better there. I'm trying to figure out what could be done about the way the pyramid stretches oddly. I think it has to do with the fact that the "back" of the pyramid is very high on the sprite so it is stretched like it is something tall, while it should look attached to the ground. Do you suppose it would it be effective to perhaps have 2 sprites stacked on top of each other, a "ground floor" and "upper floor" that have different parallax amounts? Or would that require a whole separate shader? I am a beginner so I'm just thinking of ideas, I'm not sure what is practical. I appreciate the channel, keep it up!

[@GameMakerStation]

@@scrub_jay Yes, the pyramid sprite in the GIF was temporary. We are planning on making it using separate objects, so that it looks more realistic and less like a sheet of paper.

[@Pan-Musician]

Hey Matharoo, could you do something like this with draw_sprite_pos? I just recently implemented Friendly Cosmonauts Shadow tutorial, where she uses a similar effect to set the shadow skew. would this be less performant? I am new to Gamemaker and coding and wanted to check to see if a shader was the right way to go for this effect.

[@GameMakerStation]

Yeah, you can do this with draw_sprite_pos() -- that's actually what we do in our game when the Graphics setting is set to Low and we have to turn all shaders off. I just prefer doing it with a shader because it feels more natural, and with draw_sprite_pos() you're just doing some extra math to get the same effect. That said, you can achieve the exact same effect with draw_sprite_pos(), because as I mentioned earlier, we do use it in our game for the Low setting.

[@alexzh6612]

Hi! Looks cool! And could you help me explain how to do this on GMS 1.4? and then I try , but I don't get it

[@AceDroo]

Wow! This is awesome! I only have one question though: are there any advantages/disadvantages to using this method of drawing 3D parallax compared to other methods? Just curious in case I want to use this technique in future projects.

[@GameMakerStation]

I'm not aware of any other methods for doing parallax in top-down games. You can do the same effect with draw_sprite_pos(), though it's much easier and natural done with shaders. Let me know what other methods you are talking about, in case I'm missing something or have forgotten. :) I'll be happy to let you know the differences. (Maybe you're talking about the 2.5D platformer tutorial I made, which is only for platformers, not for top-down games)

[@AceDroo]

I think you might be right, I may have confused it with the platformer-based one, cause the closest I could find was this: www.yoyogames.com/blog/458/z-tilting-shader-based-2-5d-depth-sorting As you said, this one seems alot easier and more natural to use, so I might give this a go in the future. Thanks again!

[@GameMakerStation]

@@AceDroo That's just a different solution to depth ordering, but I'm not sure if this parallax effect can be done with that method since it doesn't use the depth (z) variable.

[@AceDroo]

Yeah, I think I got my terminology a bit confused then haha. Thanks again though, I'll definitely try to give this method a go sometime in the future

[@oifridgy]

Hi! I tested your project and knew it was exactly what I wanted for my game, but when I went to port the shaders and objects for my game, instead of just the trees being 3d the whole game was 3D, I would like to know if you can help me with this bug and maybe fix

[@GameMakerStation]

If you just want the trees to be 3D, instead of applying the shader to all instances (using the Shader Setter objects), just apply it in the Draw event of your tree object (or a parent object, if you have multiple tree objects).

[@eversonmay]

Who made this assets, thi is s real game?

[@TheCivildecay]

While it's a awesome effect, I have the feeling that it works best for a 3/4th angle game... my current project is pure top-down. and using a 3D perspective camera will look more natural for the same effect.

[@GameMakerStation]

I agree, this effect is most fitting for 3/4 perspective games.

[@JaguarPanda]

I can't seem to make it work in my game

[@triplelindy5273]

In some of your older videos, people have committed on your voice. I'd have to agree with some of that criticism, it was a bit distracting. Just want to say that your more recent videos you sound FAR more natural and relaxed! Your knowledge and expertise was never in question, but now your content is much more pleasant to listen to. Thanks for sharing your knowledge and I look forward to more videos explaining the newest features to GMS 2.3.

[@GameMakerStation]

Thanks Lindy. I do agree that my voice sucked, and even back then, I did not disagree. I always knew that I was doing my best to improve, and that's something I'm still doing, because I'm not there yet. Your feedback means a lot to me. :)

[@triplelindy5273]

@@GameMakerStation You're welcome, sir. I find your humble attitude inspiring. Allow me to heap more praise upon you - I appreciate how much work you put into the editing of your videos. The slick camera movements and other graphical effects (like the animated boxes and arrows) make your content more engaging than a lot of the other GMS tutorials out there. Again, thanks for sharing your knowledge.

[@GameMakerStation]

@@triplelindy5273 And thank you, that means a lot :)

[@andrew_stamps]

Off hand do you know is it possible to apply this to a tile layer using the layershader functions?

[@GameMakerStation]

I'm not sure. Even if you did apply the shader, the result would probably look very weird, so the same shader couldn't be used (you'd have to write something different).

[@schnikschnak4191]

Hello. is it possible to create automatically generated subtitles in German for your videos?

[@GameMakerStation]

Hallo, ich weiss das eigentlich nicht, tut mir leid.

[@schnikschnak4191]

@@GameMakerStation ok auf englisch gehts. Naja ok trotzdem dankeschön. Thank you

[@nicknormandy]

Good stuff

[@samcook6250]

Does this stretch out pixel art?

[@GameMakerStation]

I mean, there is some stretching going on, in the top parts of the sprites. If you keep the effect subtle enough, it shouldn't look bad.

[@TheCivildecay]

Indian Hipster ;)

[@ignaciosb8779]

You are really really good and graphic to explain. So much I'd give you a medal bro.