I would like to make a racetrack yeah I know sprites etc… but the trick would be that I would like that the game itself draws a random form. I imagine it doing such way, that I want my game to start to draw a line which ends up in it selfs, but has a couple of turns also. Actually I would like to have to parallel lines. This would form the base of the racing track.
I hope you understand what I would like to achive. Thanks for any info. I really tried to google up something like “how to draw a line?”, “How to make a random shape?”, I tried to find stuff on youtube and also in the tutorials, but I came up empty handed.
Hello,
Essentially you’re trying to make procedural generation of a racetrack, which is quite a system in itself.
You can start by either using Sprites (and Tiled Sprite too), or learning the Primitive drawing objects, which is the same as HTML5/Javascript canvas element.
The latter’s harder, so if you’re looking to use sprites first skip the second paragraph.
You can start learning the HTML5 canvas element by looking it up on Youtube - I personally watched this one: HTML5 Canvas Tutorial for Beginners | An Intro to Becoming a Pro - Ep. 1 - YouTube
It’s not GDevelop5 and instead shows Javascript code, but you can use events to draw a shape with the same parameters as shown in the video. It takes ages to draw something, though, so I just use sprites instead.
Then, assuming you know how to draw lines, circles, arcs, you’ll be getting a step closer. The next thing to do is take some examples of games with grid-based level editors, one I can recall is Re-Volt. Essentially, the user levels are built using pre-set pieces and placed around a grid so that they all fit together to form a racetrack.
Here’s a video of it: Re-Volt Track Editor - YouTube
You’ll then want to create each piece into a GDevelop function that contains each shape.
Yeah, it’s not easy using canvas element…Alternatively you can also use sprites as mentioned above. In that case, you can pretty much draw your “track pieces” using sprites on Piskel or other software, and then you can define the “walls” using hitbox in GDevelop.
Once you’ve got your pieces ready, placing them randomly on a grid is a bit like making AI: there will be a “cursor”, or the currently selected grid, and then the code picks a track piece from its conditions, such as “the first piece must be a straight road”, “after 3 to 5 straight pieces insert a 90 degree turn piece”, and many other logic like that.
It’s complex enough that I can’t explain all of the logic involved, but definitely possible. You may want to look up “procedural generation”, not sure if there’s resources for similiar track editors like Re-Volt.
well… thank you for the information. Im shocked that it takes so much. But now i got free time unfortunatly, so i have to dig in. So you say with sprites it would be easier, even if I dont have graphic skills? And then I guess, I have to draw every element I want to be used in a track. Judging from your example (5 straight element, then an 90 degree turn), it seems then it will always draw out the same track layout, no?
Yup, sprites should be easier since otherwise you’re drawing every shade of colour. In contrast using a simplistic program to create some pixelly road pieces such as mspaint or Paint.NET (website is getpaint.net) will be much faster to draw. Really, some grey for the road, a pattern of red-white bumps on the side, and you’ve got a road piece.
As for the logic, yep good that you notice, I didn’t think much about the logic since true randomly generated tracks are a headache for that post, and this one too.
Note I mentioned “after 3 to 5 straight pieces” - the key is randomizing, we can also think that the 90 degree piece has a chance to be generated to face left instead of right, and sometimes can also join with another one, to be a 180 turn. Make multiple 180 turns and you get either a switchback or a slalom (the horror!). The hard part, is telling the machine/code to put it in those patterns. It’s evening here so I’d rather not think about how it would work.
What you can currently do is enable grid in GDevelop, piece together a track using the pieces you’ve made, and code the car itself - driving around, collision, maybe even AI?
If I recall correctly there’s a racing game example - when you create a new project, go to the second tab - Examples - and search “Racing”. It takes a while to understand, but not too long, especially if you’ve got the basics of GDevelop down. Once you do, you can pretty much use it as a template for your own, and put your own levels. (It happens that the racing game example ises the pieces of roads, which is nice)
Ok… well now I started to work on the track pieces, to have at least one track, where i can fiddle around. Do you think this idea would involve a lot of codeing?
Depends - the most complex part is basically automating the track pieces placement. Depending on your experience of translating ideas like that into machine instructions, it could take anywhere from an hour with experience of GDevelop and grid system, or several days if you’re just starting out with any form of computer programming.
Afterall, the idea is something like "place a track piece, based on the direction of that track piece move the cursor to another grid (e.g. if the piece is horizontal, the cursor can move left or right after placing it, if 90 degree turn to south the cursor can only go south), then place another track piece … In code, there might be a structure/array variable that stores current grid position, variables to store the current cursor grid position, what piece should be put at the position, and maybe even parameters to affect the overall track generation.
Then there’s the other part where you start expanding the design so the automated process can do complex patterns, or take in parameters such as how curvy the track should be, its overall difficulty (when you have small, complex pieces) that affect the automated placement.
I haven’t made such a system, so there’s probably something I’m missing.
The idea is defenitly is, that the track would customisable. So as you adviced, I start out by building one track… so I could start to implement the moving system and stuff… Just my problem is that I dont have programing skills at all. In my school I was in a programing class, but I missed out the first year so the basics are missing. Also they were teaching us Turbo Pascal if it means anything to you
So basically not that much experience - that’s totally fine. I’ll just ask some questions instead:
-How do you understand GDevelop so far? Its event system, behaviours and making things happen? And how are you understanding the racing game example?
If not very much, have you done the Platformer tutorial on the wiki? (It’s the most detailed text tutorial, although there are other tutorials and even on Youtube nonetheless)
-Do you understand variables? How about structure variables? Finally, what about arrays?
-Do you understand loops in programming/loop events in GDevelop?
(The last two questions are about elements heavily used in the automating thing.
You can read a little about them both: http://wiki.compilgames.net/doku.php/gdevelop5/all-features/variables
and
GDevelop 5 is based on Javascript so that website also explains rather well.)
I’m just asking these questions to gauge what I should explain first, in case you’d like direct explanations on how to build the system.
yeah I know sprites etc… but the trick would be that I would like that the game itself draws a random form. I imagine it doing such way, that I want my game to start to draw a line which ends up in it selfs, but has a couple of turns also. Actually I would like to have to parallel lines. This would form the base of the racing track.
good that you notice, I didn’t think much about the logic since true randomly generated tracks are a headache for that post, and this one too.