1. Split
  2. News

Split News

Devlog #9

[previewyoutube][/previewyoutube]

Hello guys!

If you are interested in the essence and pretty pictures, you can skip the introduction, we will not be offended;)

When you think about who makes games, the first thing that comes to mind is the programmer and graphic designer, in the second wave, perhaps we will consider sound or music. Designers will be mentioned much less frequently, and even less frequently individual specialties. In this article, let's take a look at what is meant by the concept of graphics.

There are people responsible for three-dimensional graphics. And these are the people who make the models, but the models can be modeled by hand or carved. A graphic designer may specialize in creating elements of the environment, characters, or animals. Another person may be responsible for creating the character's skeleton, and another for the animation. Yet another one may create textures, someone may be responsible for the hairstyles. As you can see, there is a lot of it, and that's still not all. Moving from textures to more two-dimensional elements, we deal, just like in 3d, with cartoonists of characters, surroundings, or animators. We can divide 2d creators into interface designers, concept artists, or people creating details on levels.

It's hard to get closer to everything at once, so this time we will focus on one very specific person - an illustrator, and more specifically this special case of an illustrator who creates frames for fictional scenes.


How does work on an illustration look like?


[h3]Technical[/h3]

The first stage of work on an illustration is technical details, i.e. all requirements that an illustration must meet. First, you need to know what you want to draw. Thank you goodnight. But seriously, it is a question of where a given illustration is to be used. In our case, these are fictional scenes, but they could be, for example, character portraits, conceptual graphics of an item or location, which will then be modeled.

The basis of the graphics that will be used in the game is, among other things, its size.




This extremely colorful graphic defines the most popular screen resolutions. Turquoise until 21: 9, pink is 16: 9, green is 16:10 and yellow is 4: 3. On the other hand, white is the common part that will be visible regardless of what screen you have. This is especially important in terms of the arrangement of significant elements. We cannot put the face of the character speaking on the turquoise field because it will be invisible to some players playing at a different resolution.

Before drawing an illustration as it was written before, you need to know what you want to draw. An example of a room description looks like this: Shield System control room. Huge Bed - Exposed (the covers are on the sides of the bed, when activated, they cover the figure lying on top of it so that only its face is visible - like a sarcophagus). Walls full of monitors and indications, one door. In addition to what is to be in the photo, it is important to know how the camera should be positioned. For this frame it is a complete set, you can see the characters from the side, the shot at the door.

Now defining the character and climate. First, Split is a cyberpunk game. Big corporations, not that far future, lots of glowing billboards, huge spaces, and omnipresent electronics and robots. Everything is a bit dark, cool, bathed in blue fog and glow, highlighted with neon lights and wires.


[h3]Crafts and arts[/h3]





Starting from the earlier colors, it is advisable to divide the frame by marking auxiliary lines taking into account different screen proportions. Yes, just to make things easier. At this stage, the main color theme from which the frame will be created is also determined.



The next step is to give the location a simple outline. In this case, it is a room, so it is important to mark the walls, entrances of all kinds of bends. At this stage, it is also determined how the perspective will unfold. When you look closely, you can see that what is at the back of the picture converges to the center, and thus the observer of the scene is in the center of the room.



In the next stage, the outline of light and shadows as well as the contours of characteristic elements on the stage, such as an armchair, are created, which will be a key part of the stage.



When the individual shadows are selected, the main light point is added. Light spots and basic shadows in the direction of its incidence are painted.



After the first few smears of dark spots, it's time to deepen the shadows. Making them smoother.




The next step is texturing. But where to get textures?



The basis for interesting-looking elements is this strange-looking texture. This texture is a mix of architectural elements enriched with noise and dirt. Something like a collage. By using the proper opacity and masking function, the illustration gains depth and looks more realistic.



The formula was created on the basis of reference photos of integrated circuits. The geometric form gives the elements a mechanical character and thickens the compositions.




Cardboard created on the basis of the first, repeatedly mixed in order to obtain a new, geometric pattern that will affect the final effect by selecting the appropriate method of covering.



The previously shown textures are mixed with the color of the wall and the details are sanded down in detail. The easiest way to start is from the surfaces facing the player.




When everything that is flat and in front of your eyes has all the details, it's time to focus on the details that are at a certain angle.








The next steps involve the application of individual details such as wires or gloss. Additional lights and shadows are added, as well as details such as texture on the walls or lamps.







Now we leave the background drawing and add the main color theme of the scene. The light that gives the atmosphere and expression to the scene comes from two points. One of the light sources is behind the open door, while the other is the glare of the central monitor.



We would also like to invite everyone to our Discord where we will be happy to answer all your questions about the current work - DISCORD



Devlog #8

Hello guys!

Today we're going to talk about portals!

Portals were popularized in video games by the game that is their namesake, the 2007 Portal.

Everyone knows how the portal works, you enter one place and one exit, and through the portal you can see what is on the other side.

In the game Pray (spoiler), at some point, we get a key that can destroy glass surfaces. When we approach the glass in the starting location with a panorama of the city and break it, it turns out that what is behind it is not a city, but a laboratory. From the narrative side of the game, it turns out that we were locked in the test room all the time. On the other hand, from the mechanical side, the visible city is placed in a completely different place and is only displayed on the glass, and we were physically in the room that was inside the laboratory.



For a moment I will return to the game known from previous devlogs, namely Antichamber. The whole game is twisted based on portals, teleports and wall rearranging, but here the focus is on a very specific room. At some point, you enter a room that looks like a modern art museum. There are a dozen or so boxes in this room, and their contents vary depending on which side you are looking at.

https://twitter.com/antichamber

What we created in the split, however, is a slightly different variety of portals than in Portal, and more similar to the one from Antichamber. In real life, it can be compared to a room with a Venetian mirror. When we leave the room into the open space, we actually enter another specially prepared room.

[previewyoutube][/previewyoutube]


Around the Bridge there are some kind of sheets or boxes. This sheet must be applied so as to perfectly cover the view and surround the door, and at the same time not to pass through the door and other models on the stage. Otherwise it could spoil the effect of the illusion.



Without the illusion, the view from the bridge would look something like this:

[previewyoutube][/previewyoutube]

Additionally, due to various types of post-processes (additional effects imposed on the camera, such as smoothing the edges or enhancing shadows), the sheet must have two layers. Without the second sheet slightly larger than the first, it would look like this:

[previewyoutube][/previewyoutube]

Where are these bricks in that place coming from? They are located on the same stage as the rest of the map, however, they are far away from the place where the player himself is moving. Where there are decorations, there is a camera that reacts to how the player moves and turns. The portal model, on the other hand, marks where the image from the second camera is to be rendered.




Ultimately, we get what seems to be a contradiction to the laws of physics and space, but is in fact an image from another place, pasted in the right way.

[previewyoutube][/previewyoutube]


We would also like to invite everyone to our Discord where we will be happy to answer all your questions about the current work - DISCORD




Devlog #7

Hello guys!


Today we're going to talk about level design!

There are a lot of good tutorials on how to design levels. Only most of them are based on the 10 golden level design advice.


The future designer is introduced to the fact that he should set landmarks, leader lines and use many other techniques of hidden player guidance.

As Split is largely a logical game, I will focus on this logical aspect. When a "room" is created (it does not necessarily have to be one room) in which we are dealing with a puzzle, we must first create a prototype of it. It takes a long time to set up all the lights, effects and decorations, so there are some facilitations.



Before anything looks like a game, something like a virtual mockup is built, which is called Blockmesh or Blockout. It consists in setting simple shapes so as to mark where the player will be able to move. Often you can move your character in such an unfinished world in order to be able to measure individual distances or heights of elements on which you can jump.




Before anything can be built, we're going even lower, and actually I'm going down a few levels until we climb back into the blockout.


The first is an idea or research. If we already have a very specific idea of ​​what the puzzle should look like, we can go to prototyping, but if there are only some general assumptions or only some part of what will be in the game is designed, you will need to get some inspiration from other developers. Before we started designing anything to play, we had a whole list of titles: Portal, Portal 2, Q.U.B.E. 2, Relicta, The Turing Test, The Talos Principle, The Witness and Antichamber, and that's just from those 3D titles. In addition, you can find a lot of interesting speeches or articles about the mindset of people creating puzzles.

To go on to the next part of the article, we should remember the kindergarten classes because one of the most useful materials for prototyping is plasticine.

What is the advantage of designing in plasticine over creating it right away in the engine? At first glance, the virtual environment is more scalable because we have a limited amount of raw material in the real world. In addition, when we set something in the virtual world, we can immediately start the game and test. When it comes to pace, when it comes to making something in plasticine, then we have to move it to the engine anyway. However, in practice, we will never do puzzles consisting of 1000 rochs, only a few or a dozen. What's more, translating pieces of plasticine is much faster than moving individual elements of the world with the mouse. Thanks to this, we can test 15 different systems and choose one of them, which in the engine will be set by us so that it matches the appropriate distances. Putting everything in the engine so that it fits for the tests is a chore. In addition, it is usually the case that the person who creates the puzzle and the one who will stick it together in the engine are two other people. So what the puzzle designer does, he creates some diagrams, then he writes them on paper and gives them to the person who then plots them onto the geometry of the world. Thanks to prior research, the puzzles will often require a small amount of changes to the engine itself.








What is the example puzzle about? You have a kind of number pattern here, there are holes in some places. The boxes are positioned so that you can only jump on elements next to or diagonally. Before we even enter the fields, there is a written order on the walls that you will have to remember. If there are numbers 3, 6, 2, 3 consecutively, it means that first we have to jump to the tile with number 3, then 6, 2 etc.






Each subsequent puzzle using the same theme should be more difficult. At the beginning it consists of 3 elements, and it can be solved in one move, the next one has 6 elements, and it can be solved in three moves. The next puzzles as they develop will use previously known mechanisms.



What cannot be easily conveyed in plasticine is the geometry of the levels. It seems possible, but it requires a lot of raw material, and the material itself has a certain load capacity, so you cannot make too large pieces of plasticine hanging on plasticine. Instead, geometries can be drawn on paper to fit the layout of the puzzle, or you can find other material. Doing multiple levels on paper doesn't show the transitions between floors well, and some more complicated ones even require you to make extra rolls, so it's better to build it in the engine itself. Of course, there are also materials that lend themselves to the smooth creation of geometry. These are mainly various types of blocks. You can design many floors in them, they are durable and easy to make platform elements.







The combination of the geometry of the blocks along with the appropriate spacing of the improved elements gives a very large field for creating spatial puzzles that would not be achieved by any of these materials separately. Such a prepared fragment of blocks connected with properly arranged mechanisms is then converted into a blockout. If it is not ready, it goes back to the prototype phase again, if it is good enough, it goes on the road by adding visual appeal.




Finally, let me just mention that in most 2D games, physical design is not needed, because they have such an uncomplicated process of moving to the digital world that programmers prepare an editor that allows you to click all important elements easily and super quickly. Mostly this is used in puzzles with a limited map size or based on connecting layouts.





We would also like to invite everyone to our Discord where we will be happy to answer all your questions about the current work - DISCORD




Devlog #6 - Time and space

Hello guys!

I have to apologize in advance for causing the headache. The thing is complicated because I'm going to be talking about time travel.

We are surrounded by a three-dimensional environment that is easy for us to imagine. In the games themselves, we also often deal with gameplay in two dimensions or a various combination of both. Four-dimensional games are much less common. The very idea of ​​figuring out how the world should be viewed in such a four-dimensional world is problematic.

There are 2 most common ways to interpret the fourth dimension as spatial and as temporal.


Spatial / geometric interpretation

There are games, such as Antichamber, which play with the convention of changing space. In the game, it may turn out that there may be something completely new behind the corner from which we came, and the stairs leading up lead us to the floor from which we started.



To understand this concept easily, you can imagine a flat space, a table or a piece of paper with a ball suddenly appearing on it. When the ball touches the surface, it is visible as a point in the two-dimensional world that is the surface of the table. As the ball sinks, it becomes a circle of increasing circumference, reaches its maximum size in the center, and then shrinks.



Flatland: The Movie!



There is a theory that assumes that our universe is just a three-dimensional bubble (ball) passing through the surface of time (table). The point of contact is considered a big bang while the fact that the universe is expanding means that we are still in the first half of the bubble. When we reach a certain edge, the universe will shrink.



Time interpretation

Another type of games are those that view the fourth dimension as having fun with the times. "Timelie" is an example of a puzzle that neatly hides the fact that it is a turn-based game based on a grid, under appropriately designed movement animations and precisely the time shifting mechanics. In this game, whenever our heroine is about to get hurt, time stops and we can rewind the game to the point where everything was fine. The time backward actually replaces what the undo-last-step mechanic is found in a lot of puzzle games, especially brain teasers. The difference between "Timelie" and other puzzles is that when we start to move back, our character does not jump to the previous step, teleporting to the previous field, but is smoothly transferred.



Reversing mechanics

The computer, like people, cannot go back in time, so game developers have to do what they always do, that is, deceive the player by selling him a "fairy tale" that what he sees is just turning back time.
What game developers do is employ a secret technique known in most software by the shortcut Ctrl + Z.

How is such Ctrl + Z constructed? For example, let's take a graphics program.
When we draw a straight line, we do not save the entire previous image and the "after change" image.
The program only saves the colors of pixels that have changed. After all 10 lines were drawn, of course, we wouldn't be able to jump straight to the picture before drawing the lines. We would have to step back line by line to reveal the original drawing, with CTRL + Z used 10 times.

Why can't we save all ten versions of the image and what it looked like at the beginning? The problem is the amount of available memory on the computer. A single FULL HD image (1920x1080 pixels) may take up to about 150 KB to 1 MB, depending on the storage method. On the other hand, information about changes from a dozen bytes to, of course, in some extreme situations, the same as the image, but usually several dozen bytes or 1 KB. How easy it can be counted is a few hundred or several thousand times less occupied space.

Since our real time and time in the game are always moving forward, what actually happens when turning back time is pasting the last steps. It is the same as going backwards parroting all our movements from the end.





1.Beginning of Fraud:
We also don't save the entire game in games. Since we cannot go back in time all hundreds or thousands of objects that are around the player, we choose only those for which it is important. These are usually all characters, doors, moving platforms, items or elevators. Worse, if the game contains destruction of the environment and particles splashing in all directions. What we will need is the position and rotation of the elements in the world. With characters, there is still a need to remember what animation they are playing and information such as when he shot.


2. Continuation of the fraud:
Sampling is another major segment of operation of such a system. The whole thing is how often we should save the player's position. There are also 2 approaches to the topic here. The first is to choose a fixed amount of time, which is the saved position and the other things mentioned above, but for the sake of simplicity I will call it the position. Such a state should, at best, save as often as the frames on the screen are changed, i.e. the famous 30 and 60 FPS, although many people also like to set as much as the factory gave. In practice, we don't need that much accuracy and we can save every other frame or some other constant amount. The second way is to save only the changes. So when the character is only standing, the game saves the moment when we did nothing and waits for our action, and when we move, as in the previous case, from time to time what we do is recorded. In the second case, it is also important to save the time between successive saved changes, so that the game knows how to recreate them in the process of undoing.

3. Finalizing the Fraud:
You can add some graphic effects during the act of undoing, such as: distortions, noise, and give the appropriate sound to suggest that time is moving backwards.




Paradoxes

Perhaps the most popular paradox of time travel is that of the movie Terminator (1984), which involves going back in time to kill someone's ancestor so that a person cannot be born.

In "Split" there is a mechanic of putting up your holographic copies. You can use them as the proverbial paperweight. However, in addition to that, they have the ability to repeat the movement after us.

We'll start with something simple, which is to leave the clone behind and go back in time so that it never existed.




Well, this is the next step, setting up clone A, taking a few steps, going back in time so that the clone never exists, but releasing a new clone B that will recreate our path. This will make our new B clone set that previous A clone.

[previewyoutube][/previewyoutube]

Well, let's complicate it more :) and let's release more moving clones that make up other clones.

[previewyoutube][/previewyoutube]

These and many other combinations should be anticipated and handled somehow by the game.

* At the end, a task for those willing with an asterisk. What's going on in this chart?





We would also like to invite everyone to our Discord where we will be happy to answer all your questions about the current work - DISCORD









Devlog #5

Hello guys!


In today's devlog, we will focus on the mobility of our Split game.

All the methods presented below should not be used in VR games as they could make you feel sick.

However, during the game, in most modern and many old shooters, the bouncing effect is mandatory. It consists in the fact that while walking, the character slightly tilts up and down, simulating taking steps. If the character can run, he leans noticeably faster when sprinting. The sine function is often used because it does this well enough.



⭐1.One of the first effects that was used in first-person games was that characters were tilted sideways. This is clearly stated in games that are based on the so-called shelling - strafing. It consists in the fact that while holding the knob or clicking the sideways button, the character does not turn in this direction, but walks sideways. The effect that aids walking swings to the right as we go to the right, or to the left as we go to the left. Thanks to the appropriate rotation of the camera, we intensify the emotion of moving the characters, especially when we avoid the projectiles flying in our direction.



⭐2.The weapon is rarely permanently attached to the camera. It should move with the player so that he can feel its weight. Turning When Turning The weapon should turn with some delay.





⭐3.As with spins, the weapon should hold its weight while jumping. When we're in the air, pull us down, and when we land on the ground, it bounce.



⭐4.It is also important to move your weapons while walking. When a person tries to keep something in line in front of him, but it is almost always possible to accept the fluctuations, the stronger the faster we move.




We would also like to invite everyone to our Discord where we will be happy to answer all your questions about the current work - DISCORD