The terrain editor
From the terrain editor we show you how to design levels using this powerful tool for creating textures and collisions.
1.0 – Drawing Methods
Before we begin this tutorial, you should know that DarkSpine supports different drawing methods. How do you get this? Well, the base objects that the editor composes support the insertion of a custom script (a piece of code that orders how our object should draw).
In DarkSpine we include by default 3 methods for drawing on screen:
- Draw2D: This script draws the image associated with our object by default. This image has no assigned 3D drawing property, although it is compatible with Z-buffering. This means that our object can represent 3D depth. However, three-dimensional transformations cannot be applied being limited to transfer, depth, 2D rotation and scale. It is the most efficient method to draw an asset.
- Draw3D: Assigning this method, we will obtain the same privileges to draw as the first option, with the addition that we can transform our objects in all dimensions. It is possible to adjust the rotation on the XYZ axes.
- Draw Vertex: With this active method, we get all the drawing features we would obtain if we chose the Draw3D method. But this functionality is responsible for drawing vector models created by ourselves, being able to assign textures for the filling of our polygon, as well as textures for each vector. This is the drawing method that we will use in this article to use the vertex buffer creation tool.
Apart from these 3 methods we can assign drawing scripts from the editor, and we include a library of scripts to draw efficiently depending on each occasion.
We begin by assigning our method of drawing. As we have said in the paragraph above, we configure this in the DRAW VERTEX option from the INSPECTOR menu of our main panel.
Once this option has been changed, we will click on the PHYSICS MODE virtual button, which will take us to the PHYSICAL mode of our editor.
1.1 – Creating our polygon
Once in PHYSICS mode, just press the CREATE VERTEX virtual button to start adding points on our screen.
DarkSpine offers 3 tools to add vertices to an object.
The first is the free form, as we see in the image below, just press LEFT CLICK on the surface and start adding vertices.
We can create these points in the order we want, either clockwise or counterclockwise.
At the moment the editor does not allow to cross vectors, having to create our models uniformly.
The first vertex is represented by the green color and the symbol of an X. The last vertex of our polygon while creating this, will be the blue dot that follows our cursor.
When we CLICK on our first created point, we close our polygon and we will be led to its configuration.
If we wanted to start this process again, we must press the CREATE VERTEX virtual button again. A panel will appear to confirm that we want to delete our current set of vectors.
We decided to erase our polygon to show you the second way to create vertices.
With this method we limit our cursor to generate vectors that form straight lines with each other, this is done by keeping the CONTROL key. It is very useful for creating surfaces that need some precision in their models. Below you can see an illustrative image.
The third method is activating the GRID tool of our editor. This is achieved by pressing the virtual GRID MENU button located on the main panel.
Once our grid is configured, we can generate vertices based on the mesh, obtaining the highest precision when creating points in our scenario.
The vertices created with our mouse are automatically aligned with the vertices of the mesh closest to it.
As we advance in previous paragraphs, to close our polygon it will be enough to touch the first point created.
From that moment you will notice that all the nodes will have become blue, meaning that the polygon has already generated the data for our object and is ready to be modified.
1.2 – Adding textures
Now we have to give life to this form, for this we are shown 2 options in the Main Panel, FILL TEXTURE and EDGE TEXTURE.
By pressing any of these two functions, we open the panel that contains our assets, giving us the possibility to insert the mentioned textures.
For the filling of our texture, the pattern to follow is the one you see in the image below and we must always use the FILL TEXTURE option.
To apply a surface to our terrain, we must use a different texture pattern like the one you see below on the screen.
We must always choose the EDGE TEXTURE option so that the texture fits the edges of our polygon.
In future articles we will talk in more depth about how to create our texture patterns and thus be able to use them with the terrain editor.
De momento nos centraremos en el manejo de este, sobre todo para no saturar de información a nuestro espectador.
Arrived here, we see that we have inserted our texture pattern. But as we can see in the image above, it has not been created correctly in one of its vectors.
This is due to the algorithm that DarkSpine uses, which is very efficient but needs to have an anchor point that does not correspond to a corner. This issue will be fixed in future updates.
So we are going to add a point (image below), then move this towards the corner where our first vertex is located (with the symbol of an X).
In other words, the created point will replace the position of our first vertex and in turn our first point will no longer be part of a corner.
As you can see, we now have an optimal result of our terrain.
1.4 – Modifying our terrain
Keeping the SHIFT key on our keyboard, the representation of our vectors will turn yellow.
From that moment we can add vertices by placing our cursor on any vector and pressing LEFT CLICK on our mouse.
An alternative method is to press the ADD POINT virtual button and start generating new vertices.
If we click on the virtual button DELETE POINT, the appearance of our vertices will become red, inviting us to eliminate the points that are not necessary for your polygon.
We simply have to click on the nodes to be removed with our mouse.
The usual alternatives are also offered to eliminate a node, dragging our mouse with the RIGHT CLICK, we generate a rectangle that will select all the nodes that it covers. Simply press the DELETE key on our keyboard and our nodes will disappear.
To select nodes manually we are offered other options, the first and most basic is to CLICK RIGHT on a node. This will deactivate any previously selected node and leave only our selection active.
But if what we want is to select several nodes at the same time and we don’t want to make use of our selection rectangle, we can keep the CONTROL key pressed and thus make a multiple selection by CLICKING RIGHT on our vertices.
Our editor contains a history of our actions, and apart from keeping a history of our objects it also stores data of our polygons among other functions that we will see later.
Simply by pressing CONTROL + Z we go back one step in order to rectify our configuration.
The editing of our object is very efficient, giving us the possibility of adding complexity to our vectors. Thus, by pressing the ALT key, the interface will be extended by adding two new adjustment controllers to each vector, these being represented by an orange and a purple node.
If we modify the position of these nodes, we can add triangles in their respective vectors and create soft shapes to edit our terrain. The efficiency is based on the fact that if we do not move these new nodes from their positions, the editor will create only 2 triangles per vector.
In other words, if we want one side of our polygon to obtain a greater number of vertices automatically, and to be able to control these vertices with a new controller, we will only have to take off the mentioned nodes to begin to stretch our terrain and shape it.
If we want to return to the previous configuration of 2 triangles per vector, we will simply have to drag the nodes back to the original position of our respective vertices.
1.5 – Transforming our model
A model of vertices can be scaled in two ways, one of them is as if this model is represented as an image, where its structure is scaled linearly. On the other hand, if we keep the CONTROL key pressed while we scale our object, our model will scale from its vertices, creating homogeneous transformations without loss of quality.
A model can be rotated as if it were a 3d object (in fact it is), holding down the CONTROL key will rotate our model on its Y axis. If we keep the SHIFT key pressed we will rotate our object on its X axis.
By holding down the TAB key, we can rotate our object while retaining the properties of our land. This means that regardless of the angle obtained by our model, the textures that represent a floor, ceiling and walls will be automatically adjusted to preserve its pattern.
This function is reflected in the image below.
1.6 – Adjusting textures and collisions
Entering the configuration of our land (TERRAIN SET), we observe a series of options that can be modified.
The list of options is as follows:
- SMOOTH: Variable of the type bool (1-0, true / false), having this option activated gives us the possibility of handling the tensor nodes, which are those of which we have spoken previously to soften our vectors and shape them without losing definition. Otherwise the nodes will not act on our model when they are displaced.
- H-SPLIT: This variable adjusts how many sections of blocks the texture pattern has, on its horizontal axis, used to generate the terrain. In this way we can adjust textures of different sizes as long as they meet the requirement for use in 3D. This is called POWER OF 2, where our textures must have a size that can be divided or multiplied by 2 while retaining its appearance. As an example we put the most common sizes such as 16×16, 16×32, 32×32, 64×32, 64×64 and so on …. The larger the H-split variable, the more blocks with different illustrations we can add to our terrain on its horizontal axis.
- V-SPLIT: This variable adjusts how many sections of blocks the texture pattern has, on its vertical axis, used to generate the terrain. In this way we can adjust textures of different sizes as long as they meet the requirement for use in 3D (mentioned in the previous point). The higher the V-split variable, the more blocks with different illustrations we can add to our terrain on its vertical axis.
- CORNER LEFT: This option allows us to add corners to non-closed polygon patterns and thus not give the appearance of being a repeated pattern in our model. We will talk more in depth about this utility a few paragraphs below.
- CORNER RIGHT: The variable has the same utility as mentioned above, but this time with its right side.
- COL-XOFFSET: Our model generates by default a collision, represented in the image below as the green line that runs along the surface of the land. (Due to the similarity of colors between the texture and the representation of our collision, the image should be enlarged to appreciate this collision vector. This collision can be transferred in order to visually fit our textures and their collision limits.
- COL-YOFFSET: It is the same function as discussed in the previous point but displacing our collision on its Y axis. In the image below we observe that we have modified the position of our collision by -6 pixels, causing the limit of our collision to move 6 units upwards.
1.7 – The different types of models
The editor can generate 2 types of polygons, depending on how we create these. If we click on the first point created, we generate a polygon of the “closed” type, and our editor will interpret it as such to adapt the terrain options.
On the other hand, if we press again on the last point created, we will be assigning a polygon of the “open” type. In the latter we will not be able to assign a fill texture, but we can assign a texture pattern in which we can configure its borders to add an organic finish of these.
This comes in handy to create fences, bridges, pipes etc … and give them a more attractive appearance.
Click on the last point to create an “non-closed” type polygon. The minimum allowed to create this class will be 2 points. While in closed polygons it will be three.
1.8 Adding textures in non closed polygons
Once created we implement a texture allowed by pressing EDGE TEXTURE. We select the image and click on the title of the illustration or on the illustration itself of the content display.
As we can see in the image below, our pattern has been installed correctly through our vector. But if we look at its edges, we witness how they denote a clean cut that gives evidence that we are faced with a repeated image.
If you look at the image panel shown above, you will see that our pattern contains 2 blocks for this purpose. And it is nothing less than adjusting your limbs to add organic endings to our model.
Simply assign the block of our illustration by adding units from the TERRAIN SET panel. Adding a value of 1 or 2 to the variables CORNER LEFT and CORNER RIGHT, will order our object to draw the first or second block of the second row of our texture (in future tutorials we will talk more about how to create texture patterns).
1.9 – Modifying an open polygon
An open polygon can access the same modification tools as a closed one. Therefore, we can triangulate our vector and shape it in the same way we do with any other type of polygon.
And of course we can decide whether to generate a collision for our object, otherwise it will only be a decorative object.
It should be noted that collisions can work independently. This means that we can create invisible objects that serve as a physical controller. Generating so many types of collision without texturing our objects. In addition to being able to improve game mechanics.
In future articles I will show you how to use vector information to create other types of objects and patterns.
We strongly recommend that you view the video located at the beginning of this article to get a clear idea of this section.
The video tutorials provided on the YouTube channel support subtitle contributions from users. This means that any user can contribute to add subtitles with the editor and the new contribution program of YouTube subscribers.
And here we finish the article, this section is very extensive and with many possibilities. We have plans to improve this section to add value features to this great tool. Now it’s time to practice our knowledge and start creating land! Best regards and see you in the next article!