 This video was brought to you by my patrons. Thank you so much for your support. If you also like to support the work I do, you can join us at Patreon. The links will be in the description. That said, let's get started. Hello! How are you doing? So, in this video, we are going to create a black hole, but we are going to create a stylized black hole. We are going to use some flat design techniques to achieve something that resembles a black hole. And after, we are going to create some code that will pull things towards the center of the black hole. This is the goal of this series of videos, because this won't be a single video. There is a lot of stuff to show to you. So, I think that this will be a three-videos series. But I will try to make this the interval between the videos a lot shorter than the previous series. So, without further ado, let's get started. So, let's try to understand how we can represent a black hole visually. It's very hard because this is the most realistic image that we have about a black hole. But this is... I think that this is the best simulation of a black hole. If I'm not wrong, this is the simulation used in the Interstellar movie. But this is way too much for me. To be honest, when I think about a black hole, I think more about something like this than about something like this. So, for design purpose, and this is something that you have to keep in mind when you are designing. Be realistic is not the goal. When you are designing something, you have to understand how the person will know that this is what you are trying to represent. So, I think that most often what people think about a black hole is something like this, rather than a headunit or something like this. I think that this is the best representation of a black hole. This can invoke a black hole better in people's view. So, this is the reference that we are going to use. So, let's break this down a bit. You can see that, of course, there is a black hole at the center. But at the edge of the black hole, there is this light that is because the black hole gravity pulls even light towards the center. So, not even light can escape the mass gravity of the black hole. So, the light will be pulled towards the center of the black hole as well. This is the reason why it's black. So, this aura, this light aura around the black hole is something that we are trying to emulate. And you can also see this swimming, this trio thing here, like the black hole is spinning. I don't know how to explain this physically, but I don't know the reason why things are spinning towards the center instead of just being pulled away. I think that one of the reasons why is because the light is passing like straight, but it's gathered towards the center. So, it starts to centrifuge. Is this how you say that in English? Like spinning because this is the vector that it was going. Now the black hole is pulling it towards, so it kind of spins towards the center. I think that this is the reason, but don't take this as true or like a scientific explanation. But this is something that we are trying to emulate as well. And there's also the stars in the background and the stars are also pulled towards the center. This is what the breakdown of this black hole. So, let's start by designing the black hole with this light, this aura surrounding its edges and this swimming. Something that will give the idea of motion, of spinning motion. So, I will open Inkscape. So, the first thing that I will do here, I don't like this default document that Inkscape provides to us, so I will change the properties of this document. I will press Ctrl Shift D and let me change the screen, because since we are going to use some colors on this palette, I will take rid of my image on the screen. So, let's focus on the Inkscape interface here. So, we have the document properties open. I will change the display unit to pixels and also the custom size unit to pixels as well. We are going to make this black hole change. We are going to make this black hole a texture so we can use it in a game. But since we are going to have some parts that will be independent from each other, so for instance, the light I wanted to scale out and in, but I don't want everything to scale together. For instance, I don't want the swimming light to spin together with the aura. So, we will have to break down these elements. For that, we kind of disassemble the black hole after we are done with the composition of the object. And then we will reassemble it inside Godot after. So, we are breaking it down into three textures. We are going to use the same texture, but we are going to break it down into pieces so we can use it in Godot Engine. For that, going back to Inkscape. For that, I will use a small square texture. And I am going to change the scale to one pixel per unit and change the background color to a very dark color like this. Now, to create this aura that we saw, first I think that I will create the black hole center. I am using the Create Circles, Ellipses and Arts tool. And to create a perfect proportional circle, I am holding CTRL, SHIFT and left click and dragging. This will constrain the proportions of the circle so we can make a perfectly round circle. And I am going to duplicate this object. I have just right clicked and duplicate. And I will scale it up so I am pressing CTRL to constrain the proportions. And hold SHIFT so we can scale it relative to the center of the object. That's what I am trying to say. So this way. I can see that it seems like this is opaque. It seems that this is transparent. So I am going to Fill and Stroke. And if this tab is not available at your screen, you can go to Objects, Fill and Stroke. Where is it? Right here. Fill and Stroke. So you can see that this is kind of transparent and probably the other one is as well. And now I think that this is better. I am going to change this object to a light blue color, just like we had in this thing. This is kind of purple, but at the edge it is kind of blue. And this one is kind of blue as well. Blue seems to be a good color to use. You can see that this is a purpleish blue as well. Blue seems to be a good color to use in black holes. So I am going to use this blue for this one. I think that this one. But I will make this more transparent. I will decrease the opacity to about 50%. Like that. I am also going to duplicate this again and scale it down so we can have like three of these circles stacked on top of each other. And this will create kind of like an aura effect. Let me show you what I mean by that. So I will duplicate this, Ctrl D and scale it down holding Ctrl and Shift. And you can see that when they stack, where they are overlapping is more opaque than the borders, right? So I will duplicate this again and scale it down and this is the aura that we want to get. So I will select by holding the left mouse button and drag, I will select all these objects and I will group them by pressing Ctrl G. So now we have all of them as a single object because they are grouped. I am going to align this to the center of this object using the align tab here, the align dialog. If this is not open in your interface, you can go to object, align and distribute option. So as you can see, this will align relative to the last selected object. So I will select this one and then this one. And we are going to center the black hole to the center of this aura vertically, horizontally and vertically. You can see that we are not seeing anything. So I'm going to move this object, the aura, all the way down by going into lower selection to bottom. You can also press and this will be the shortcut for that. And I will decrease the size of this black hole here. So now we have the basis of our black hole, which is the black hole. We have the center and we have this light coming out of it. Not coming out, but you got it. So now we want to make this swimling effect like we have here, these swimming spiral things here. So since this is a spiral, we can use the spiral tool. We have create spirals tool here. And I'm going to create a spiral spiral about this size. And if you want to have the same spiral as I do, you can pause the video and copy these properties that are showing on the top left of the screen. Now we are going to make the stroke of the spiral ticker because we want to make the whole swimming effect that we have here. Using a single object, we won't make a texture and things like this to make this seem realistic. I'm just going to make a single stroke that will be at the start. I think that just at the middle because you can see that right here where it would start, it is thinner than at the middle of the stroke. And then it will decrease its width as it goes towards the center. So this is what you are going to do. To achieve that, I'm going to convert this spiral, which currently is an object to a path. So path, object to path. And now we will use a power stroke effect because this will allow us to control the thickness of the path. So path, path effect, add a new effect. And let's search for power stroke, power stroke, here it is. The thing with power stroke is that it will allow us to control the thickness using nodes. So in vector programming, in vector drawing programs, the way that you control the shape of something is by using nodes with a kind of like vertices. And by controlling them, you can control the shape. So this effect, the power stroke effect will provide us some vertices that we can control. And using these vertices, it will tell what is the stroke that will result from the combination of all these nodes together in this path. So back to Inkscape. If we go to Edit Paths by Nodes tool, you can see that now we have all of these nodes. And the ones that are more interesting are these pink nodes right here because they are what control the actual thickness of the shape. And I think that I am happy with this already. Actually, I'm going to change the start cap and the end cap instead of using but, I'm going to use zero with it. You can see that it changed right here. So zero with it at the end cap as well. There we have it. And I think that, oh, no, this doesn't look good at right here. Why though? Oh, okay, the start cap changed to, but again, so zero with it. There we have it. So this is the shape that we want to get. I think that I will change this right about here just so we get it smoother, smoother. So this is what we want. So let's change this to a more purplish color just like what we have here. Something blueish purple pink color. So I will change to something like this or this. Yeah, I think that this is good. So we are going to make this spiral match kind of like it was getting into the black hole itself. And for that, I would decrease its size a bit. To rotate an object in Inkscape, you can press a single click. You can press once on the object and just wait a little bit because if you press twice, it will provide the notes to you. But if you press once and just press the second click after some time, it will provide the rotation handles to you. And to snap the rotation to 15 degrees, I'm holding control. And by using these handles, the handles on the corners, we can rotate. If you use the handles at the middle of the lines, it will... I don't know what's called, but it will do this. I don't know how... I think that's three here. Yeah, what we want is this on the corner, the handles on the corner because this will allow us to rotate. I will decrease this size again. I will click once and drag it right about here. I think that this is good because what we are going to do is to make the center of the black hole at the top of everything. So you can see that currently the spiral is on top of the black hole and this seems bad. So let's move it on top of everything, raise selection to top. And it looks way better already. So I'm going to duplicate this, control D. And we are going to flip it both horizontally and I think that we can basically just rotate it. So I'll click on it again and rotate it 108 degrees. So we can have something like this right here. And again, I will select the center of the black hole and move it to the top. I think that we can make it, yeah, right here. So I'm going to select both this and this spiral and group them so we can use the center of the group as a reference to align everything to the center of the black hole. So I'll select this, hold shift and select this, control G to group them. And I'm going to select the black hole, align and distribute, center and center. So this is what we want. This is what we'll be rotating in the ingotot engine. This will perform this animation, rotating and rotating. And I think that I will change the color of one of them so we can have variation to the spinning animation. So I will ungroup them, control shift G to ungroup and I will select this one and make it blueish. Yeah, this one, perfect. So now it's time to break the black hole into three pieces. I'm going to group the spirals again, select this one and this other one and group, control G. I'm going to move them away from each other so they will be independent objects. The important thing when you are making a pack of textures, a pack of sprites is to prevent this from happening. The bounty box of one object overlapping with the bounty box of the other object. You can see that there is this overlapping because Godot will take the wreck of the texture to render it. So if we're trying to render only this sprite, it will take the bounty box of it to render it. And inside this bounty box we have the spiral as well. So what I'm going to do is to decrease the size of this black hole so we have more space to prevent this overlapping from happening. Now you can see that we don't have any overlap. With that, I will save this texture and we are done with the design of the black hole in Inkscape. So control S to save. So I'm going to create inside my video project here. So create folder project and I'm going to save it as black hole texture. Save it and we are done. So in the next video we are going to see how we can take this texture imported in Godot and use sprites to recreate this black hole object in Godot Engine and animate it there. We are also going to have some stars texture so we can make some sprites going towards the center of the black hole as well. And this is the goal for the next video. For this video, that's it. We finish designing our black hole. So for this video, that's it. I hope you enjoyed. This was a very fast-paced tutorial I guess. If you have any doubts about something that I did here, please leave a comment below and I'm trying to answer everyone. And also please leave a feedback about this video because it's the first time that I do a drawing tutorial, design tutorial. So thank you so much for watching. Keep developing and until the next time.