Sunday, 19 August 2018

Godot - A Complete Guide To Control Nodes - Popups

So, here we are- part 2, which some of you seriously nagged me for you pests.

Anyway, as the title would suggest, let's get into Popup nodes. These are a lot more straight-forward than the messy stuff that I covered in my last video, so let's get going with the base "Popup" node.

You might notice that when you create it, it doesn't actually have any fancy graphics of its own. That's because it really only exists to hold some logic that is utilized by the rest of these popup nodes, but if you want you can add your own logic as children in Sprites, Labels, or whatever you want to put there.

So I'll add a Label as a child of the Popup node just so I can demonstrate some of the behaviour that the Popup node implements. I'll add a built-in script here, too.

I'll also add a simple ToolButton next to our Popup node so that when we press this button, some code will be executed, and we can change this code a few times to demonstrate a few different behaviours.

So by default this Popup node is hidden, unless we call a function specifically to reveal it, which is usually the "popup()" function. If we press the ToolButton with "popup()" in the callback, then as you might expect, it'll reveal the node, with the Label.

There are a few other functions to call here, "popup_centered", "popup_centered_minsize", and "popup_centered_ratio". It'll probably be easier to demonstrate these with some of the other Popup nodes we'll be looking, so I'll wait until then.

The next interesting thing about this node is that it has a VERY useful "about_to_show()" signal that you can connect. This does exactly what it sounds like, and will run the code that you place into the callback right before it shows the popup. This is useful for generating or changing data at the last moment in a nice and clean way, that ensures that you won't open it with old data showing for a moment.

There's also a "popup_hide()" function that is fairly self-explanatory- whenever you hide this popup, it'll emit this signal.

So that's about all for the base Popup node, let's move onto the more interesting ones- starting with WindowDialog. As you can see if you forcibly reveal the WindowDialog node, it has a nice little body, title bar and an "X" to hide it. This is useful if you want to use Godot's default UI, but you can use StyleBoxes to change it up a bit.

So similarly to our base Popup node, this node is hidden by default. Even if you reveal it in the editor and load up the scene, the Popup will still be hidden by default. So we have to call "popup()" on it to make it visible, which we've already got set up using this ToolButton.

So let's look at some of the other functions that I said we'd explore with a more interesting Popup node. First, let's do "popup_centered()". This one will center the node in the middle of the screen, and it's pretty useful. This means that even if we move the Popup node way off-center, it'll still appear in the center when we run this function.

Next, we have "popup_centered_minsize()", and this does the same as above but it takes in a Vector2 quantity for the minimum size of the Popup. I'm not entirely sure why this is useful but in case you wanted to implement that functionality easily, here it is.

Lastly, there's "popup_centered_ratio()", which scales the Popup as a ratio of the size of the screen. This means that it'll appear at the center of the screen, and whatever float you pass via this function will be the proportion of the screen that it'll take up on each axis, relative to the center point. So this means if you input 0.5, every edge will be half-way between the center point and the corresponding edge of the screen. This is very useful too.

So, let's move onto another Popup, and you might in fact notice that there is a child node from the WindowDialog node called AcceptDialog. That's right, we've got another layer to go down! This one is super simple, it basically gives you a pre-defined layout for an "OK" button, a little Alert message and it even gives you a bunch of really helpful signals and methods.

Let's start with the signals, since those are straightforward- "confirmed()" will emit whenever the "OK" button is pressed, and "custom_action()" will emit with the name of the action as an argument whenever we perform a custom action. I'll explain what this means now.

So there's a pretty rad method in the AcceptDialog class called "add_button", which allows you to literally add a button to the AcceptDialog using one line of code- it takes in the text to display on the button, where the button is placed(right or left), and the designated name of the action that you want to bind to this button. So you could bind an action named "explode", and you'd use that "custom_action()" signal that we mentioned earlier to run some code to actually explode something.

But in case that's too annoying for you and you want things to be even easier, there's an even more helpful function called "add_cancel", which just takes in the text to display as an argument and will add a button that hides the AcceptDialog without running the "confirmed()" signal.

So that's pretty nice and I think all you need to know about the AcceptDialog, so let's move onto the next Node.

What's this? AcceptDialog has a child of its own?! That's right, it goes one layer deeper and now we're dealing with ConfirmationDialog. This one is super simple though, as far as I'm aware it doesn't implement any new functionality- it's basically just an AcceptDialog with a "Cancel" button already there.

So let's move on- but wait. Something's not right. You're telling me that there is ANOTHER LAYER to this one?! Yup, I sure am telling you that. We've still got FileDialog to deal with and this one is a little bit more complex. This actually allows you to navigate your hard disk directory stuff and select a file, which is super neat to have already implemented by the engine.

There are a few properties to look at here, the first of which is "Mode". By default, "Mode" is set to  "Save" which means that it'll behave as if it's trying to save a new file. This means that if you select an existing file and click "Save", it'll give you an "are you sure you want to do this?" dialog box.

There are also a bunch of "Open" modes- you can open a folder, you can open a file, many files, or "open any" which I'm pretty sure allows you to select either a folder OR a file.

Next, there's the "Access" property which does do pretty much what it sounds like, it designates what sort of file this FileDialog should be allowed to access. As far as I'm aware, allowing it to access Resources will break it when you try to export, so you can't do that. User data and file system should be fine, so I'd recommend that you use those.

You can add some filters for things like filetypes, if you only want the user to be allowed to select .pngs or something then you can do that super easily.

Similarly, you can opt to show hidden files(though that might be a bit buggy on Windows, weird permission stuff) and you can set the current directory, etc, etc.

None of that is super complicated or unintuitive to use, I'm sure you'll get the hang of it. Likewise, FileDialog implements a few signals- "dir_selected", which passes the path to the directory, "file_selected" and "files_selected" which both pass a String or array of Strings when they're emitted.

Phew, so that's done.

Now we can move onto the next one, PopupDialog. This one is super simple, it's literally just the base Popup node with a panel underneath that corresponds to the size of the Popup. That's genuinely all it is. Easy.

The next one is PopupMenu, which is a little bit more involved. It's basically a context menu, so if you right-click on something and you want the options like copy, paste, select all, etc- that kind of thing, you'd be using the PopupMenu to implement that functionality. The properties are extremely straight-forward, and honestly the signals aren't very complex either- "id_pressed" and "index_pressed" which basically both just exist to point to whichever option was selected here.

There are a bunch of functions here, and a lot of them look pretty confusing at a first glance if you're reading the documentation, but honestly most of these are not complicated or hard to understand. A lot of them are referring to specifics about each entry type, like checkboxes, radio checkboxes(which are the ones where you can only select one option at a time), there's just an item you select and it disappears again, etc. It'd take me way too long for me to step through each function and tell you what it does and you'd probably get bored half way through so I'll leave you to learn what they do on your own. If you have any questions then feel free to ask but I'm confident that you can work it out easily enough.

And lastly, PopupPanel is basically the same as PopupDialog as far as I can tell, so don't stress about that one.

And that is it, I've covered in reasonable detail all of the Popup nodes. You guys asked for it, and I delivered because I'm just that kind. So yeah thanks for watching and stay tuned for more tutorial videos, I guess Part 3 would be on the topic of Buttons- quite a nice topic, I like Buttons, I use them a lot.

Goodbye!

Thursday, 16 August 2018

Gamedev Livestreams - Is It Worth It?

I'm sure a lot of you know that I've opted to start livestreaming regularly over the past few weeks. This has kind of been an experiment into whether this is actually a worthwhile endeavour and for me, I can confidently say that it is.

So, here are the advantages to regular livestreaming.

First, it helps to keep your game on the minds of people who follow you. If they see that you're constantly working on a game and they only click it once every week, that's still effectively an ad-spot that you have on their YouTube homepage for free.

Also, for me personally it helps to seperate "casual computer usage" time with "work computer usage" time. Frequently when I'm working I'll get distracted or fail to concentrate and this has been a problem that I've had for kind of a while. However, when I'm livestreaming and actually broadcasting my computer monitor to anyone who is watching, it stops me from just checking Twitter one more time or browsing reddit for a little bit or playing just one more round of Enter The Gungeon- oh wait, it's past 6pm, I guess I'm done working today!

With livestreaming, my brain can easily recognize that this is not the time to start messing around and I actually need to focus and do some work for my lovely viewers.

Another thing is again- personally to me, but I love seeing numbers go up and I love high scores. This means that when I stream, the time I spend streaming is effectively a score that I want to keep high or to beat each day. I don't know how many other people get this but I know that I certainly do feel the need to keep streaming if only to see the number go up, which ultimately means that I put in more hours working each day.

Also, since I am actually working and concentrating, time tends to go by fairly quickly, which gives me a nice dopamine rush if there's a 45 minute difference between the last two times I looked at the clock.

ANOTHER reason why livestreaming is cool is that it gives me a nice excuse to talk to other game developers. Since my throat and jaw tend to start hurting if I do go for 4 hours narrating everything I do, I tend to talk to other people like Florian Himsl of GameSquid or Collin Esplin... also of GameSquid. Either way, it's fun to talk to people and sometimes it keeps them motivated too.

The last big reason why livestreaming is great for me is because I already have a bank of just under 900 subscribers who are alerted every time I livestream so I'm guaranteed a few viewers each time, and as for the big reason-

YouTube algorithms.

YouTube tends to favour content by channels which 1) upload content on a regular schedule, and 2) upload as much as possible and 3) have high watch time. If I create daily content (in the form of a mix of livestreams and actual videos), YouTube will recommend my channel more and more. So far I've been seeing significant success with this, and it's fairly easy to livestream for a couple of hours even on days when I don't really want to.

If I don't want to or am not able to livestream, then I've got a big bank of video scripts just waiting to be recorded and uploaded on that day instead.

Also, due to the very nature of livestreams if like an average of 5 people are watching a 4 hour livestream, that's 20 hours of watch-time just there. If 200 people see a 3 minute video that I release, that's only about 10 hours. This means that livestreams inherently bring in large quantities of watch time.

So ultimately, livestreaming is hugely advantageous for growing my YouTube channel which for me, happens to be my main marketing platform.

So what are the cons?

Well, if you don't have an established viewerbase then you might only get a small number if any viewers. It sounds super difficult to actually make a viewerbase from livestreaming, since usually I pretty much cap out at 10 concurrent viewers and 50-70 total views on the livestream. The truth is that actually gaining a following in livestreaming is really, really difficult and it's much easier to create a few successful YouTube videos to boost your audience and livestream ALONGSIDE a healthy YouTube channel.

Also, it has the potential to distract people who are easily distractable in such an environment. I'm lucky in that most other people don't tend to distract me very easily and I can keep focused even when they're off talking about Tetris or whatever weird topic they decide to start talking about. However, I know that some people really aren't able to do this at all.

It can also eat up a huge quantity of your time. If you have a full-time job, you're well within your right to just be way too exhausted at the end of the day to livestream for another few hours. It is tiring and you need to have a certain baseline of energy to keep your viewers entertained by constantly having somebody talking at any point in time.

Also, some people just don't enjoy narrating what they do. Some people don't like talking. I wouldn't have started a YouTube channel to begin with if I didn't like talking, so again- this is pretty well suited to me, but I don't speak for everyone and I've seen some people on reddit and Twitter actually express disbelief that anybody could livestream such a thought-intensive task as programming or game design in general.

So that's pretty much it, if you've got any questions then feel free to ask me because I'm sure I've not covered everything in this fairly comprehensive topic, but yeah. Thanks for watching and stay tuned for more livestreams for reasons that you can go rewind and listen to all over again. Goodbye!

Sunday, 12 August 2018

Godot - A Complete Guide To Control Nodes - Part 1

This is potentially my most ambitious video yet, so hear me out. If you've ever been confused about Control nodes, hopefully this will even things out a little. I'm going to explain Control nodes in as much excruciating detail as I possibly can.

Basically, Control nodes are super useful for all things that are to do with GUI, so things like menus, HUDs, etc.

So, let's start with the base node, just named "Control", and let's talk about how it's different from the much more straight-forward Node2D.

Node2Ds have a category called "Transform" which holds all of the data for where the node is positioned, how it's rotated and how it's scaled. Pretty simple stuff.

Controls however have a category called "Rect" which deals with all of this, and it's a little bit more convoluted. They do have a position property, a rotation and a scale property, but they also have size properties, pivot offset and clip content.

That's because whereas a Node2D is effectively a marker for drawing 2D graphics, a Control node is an organizational thing for UI elements, so it's actually a box. A Node2D behaves like a point with some Transform values, whereas a Control node is a little rectangle with stuff in it.

It's also worth mentioning that you can't position Control nodes at fractional positions, they'll automatically snap to the nearest pixel. I don't know why this is, but that's the way it is, so I guess deal with it.

Now for the really scary stuff and the thing that prompted me to even make this video, Anchors and Margins.

Basically, this whole system ensures that no matter the screen size, GUI elements will always be in the correct positions. Anchors do this by "anchoring" a Control node to its parent object. If the Control node is the tree root node, then its parent should be a Viewport.

So basically, under "Anchor" there are four properties - "Left", "Top", "Right", and "Bottom". These each refer to edges of the Control node's Rect, relative to the parent. They all take in values from 0 to 1, which represent what percentage along the parent rect size to put each edge.

This is relative to the top-left corner, so if you wanted your control node to alway stay in the top left, you could put "Left" to 0 and "Top" to 0. This means that the Left and Top edges are both 0% along the screen at all times. If you wanted to make the bottom-right corner extend exactly to the center of the screen, you could make "Right" and "Bottom" both 0.5, which would place the Right and Bottom edges precisely 50% along the screen at all times.

So this is super useful to make UI elements proportional to the screen, other UI elements, etc. So what does Margin do?

Well, Margin is basically offset. If you want to offset your shape by a factor of 100 in the x axis, all you have to do is set the "Left" and "Right" values to 100 and it'll move those edges away from the left-hand side of the screen by that amount. However, a warning: these values are absolute, so that means if you shrink the screen below the offset value your elements will probably disappear off the side. I would hesitate to over-use Margins, since it can undermine the whole purpose of using Anchors in the first place.

You can also use margin to actually change the size of the Control node that you're using. So if you set the Left margin to -100 and the Right margin to 100, it'll move the Left edge 100 pixels closer to the left-hand side and it'll move the Right edge 100 pixels away from the left-hand side. This is probably useful for something.

So that's arguably the scariest bit explained, now onto another fairly scary bit- Grow Directions.

So basically, as the name would suggest this is to do with the direction your Control node is expected to grow. If you set both the Horizontal property to "Begin" - as it is by default - you might notice that when you attempt to adjust the Right Margin, it stops changing in size once the size gets to whatever its minimum size is.

However, if you adjust the Left margin and try to shrink the shape horizontally as much as you can, you'll notice that rather than just deny any new growth it'll start to just move instead.

This is because the Control node is effectively ready to start "growing" from the left-hand side if you set Horizontal to "Begin". Think in terms of a Label that's holding a line of text. If you start typing, it should expand away from the left-hand side.

I'll be honest here I'm not sure I entirely understand this bit but it doesn't seem essential so I guess my advice to you is just leave this to "Begin" because otherwise demons and evil spirits will haunt you until either you die or you stop worrying about Grow Directions.

Now for something which is awesome but not as terrifying as the previous stuff, the Focus section!

This is to do with stuff like if you press the tab key, or you want to use the keyboard or a gamepad to navigate menus, stuff like that. If you don't want to deal with this then Godot does actually automatically figure out some of this stuff, but it's not perfect and it frequently gets a bit buggy and confusing.

This category is designed to allow you to manually set which button or node to focus if Godot's messing up or you want to move to somewhere that Godot can't really predict. It's super easy, basically if you select a Button you'll get some "Neighbour" properties named "Neighbour Left", "Neighbour Top", etc.

You can set these properties to point to a node that you want to focus on when the player presses the associated direction on either a gamepad, arrow keys, etc. The Next and Preivous ones work in a similar way, if you haven't explicitly defined any Neighbours but you just want a one-dimensional list of buttons to cycle through for example when the player presses the Tab key, then you can set Next to whatever you want to come next if the player has got that button focused but wants to focus another node.

It's super simple, but a super intuitive way to setup keyboard controls for menu systems.

As for the mouse bit, this describes how the given Control node handles the mouse cursor interacting with it. Imagine that you have two buttons on top of each other, so that one is completely blocking the other. Normally, these would both have the mouse filter set to "Stop" which means that if it receives a mouse event, it'll "block" any item below it from actually receiving that event.

However, if you set the button on top's mouse filter to "Ignore", it'll completely ignore the mouse and you'll be able to click on the button below. This might be useful if you want to hide a button from being interacted with temporarily and for whatever reason setting visibility isn't suitable at that time.

Also, you can set the "Default Cursor" that appears when the user is hovering over the button. It's super easy to use but basically you get a big list of potential options which the cursor will turn into when the button is moused over.

Now for the Size Flags, which I've only ever used with respect to BoxContainers or GridContainers so I guess I'll carry on that traditionand only even teach it with respect to Containers.

From what I can tell, it's a little bit buggy and unpredictable but the important things to note are that Fill makes it take up as much room as possible, but sometimes you need to enable Expand too and I don't know why. Sometimes when you enable Expand once, then disable it, then disable Fill, then re-enable Fill it'll also Expand the node to fill up as much space as it can, for some reason.

You can also use Shrink Center which will sometimes center the nodes in the BoxContainer or GridContainer and keep them at their minimum size, but only if they're really feeling like it. If they're having an off day, then they won't.

This explanation sucked but just press them randomly until you get what you want, they're not that important to understand I guess. If you have a better understanding of these, then please let me know.

As for Styles, again, if you have a good understanding or usecase of these then be my guest but custom styles seem remarkably pointless and difficult to use compared to making panels, buttons etc manually in a sprite editor.

So I guess I've explained the essential components of Control nodes, now I'll get into some more specific instances of Control Nodes, starting from the top, which would be the Popup nodes. Thanks for watching and stay tuned for that in Part 2 of this series that apparently I'm doing now. Goodbye!

Godot Is PERFECT For The Ludum Dare

So it's Ludum Dare 42 in about six hours at the time of writing and I've decided that I'd write a little script about why I think that the Godot Engine is perfectly designed for game jams like the Ludum Dare.

Mostly, this is because Godot is just perfect for very small iteration cycles. If you have a solid idea in mind, you can spend probably no more than a few hours to actually get a very basic product up and running.

This means that if you really wanted to, you could run through several different ideas over the course of a day to determine which of them you like the most. Not that I'd strictly recommend doing this, since y'know- time constraints are time constraints, but in case your first idea doesn't pan out so well it's nearly trivial to try out another one.

Also, the engine is super light which means that an average game made in the Godot Engine will only use up about 20 to 30 megabytes. This makes it much easier and convenient for people to actually play your game, although I will admit that the web export system is a little bit hit-or-miss. Usually it'll work great, but sometimes you can run into problems that might warrant encouraging the user to run the downloadable version instead.

Also, here's a personal favourite of mine- particle effects. In short, it's *really easy* to make something look a certain base level of good if you just overload it with particle effects. It's similar to reverb in songs- you might not get very far if you don't know what you're doing, but if you're really clueless or just in a hurry then it'll work out great for you.

Godot is great for particle effects, they run super nicely (even if you're trying to render about 10x more than you should) and the actual particles editor is honestly amazing. If you need proof, then you should know that in my game WARP-TEK which is currently being shown on screen, pretty much all the graphics are based in Godot particle effects in some way or another.

In combination with that, light effects. Creating and adding lights are very trivial and again- they look awesome even if you don't really know what you're doing. These can get a little bit expensive if you have too many so just be careful of that, but as long as you're not creating like 25 of them on the same exact location, you should be good to go.

Also, Godot is excellent for keeping things organized- especially with small projects. In a game jam situation, you're probably not going to want to have spend a lot of time trying to work out what this weird variable does, or where you called this function from. With a combination of signals, multiple distributed script files and the occasional recursive egrep, it's pretty hard to go wrong and get too confused.

Now this last point isn't really in the same category as the others, since I would say that it primarily deals with why game jams are perfect for Godot, rather than the other way around. Godot is a fairly small engine in terms of community and publicity. Unity and Unreal are both backed by astronomical marketing budgets, whereas Godot pretty much only has word of mouth and a Patreon page.

If you really like the Godot Engine and want it to see some extra consideration from other developers, then I'd recommend using it for this upcoming Ludum Dare. Hell, even if you've never used it before- a game jam is a perfect time to try out a new engine in a low-stakes environment. It's good for your skillset and it's good for the engine if more people use it.

Thanks for watching, best of luck in Ludum Dare 42, and stay tuned for more videos about some things which video games are sometimes a part of. Goodbye!

Wednesday, 1 August 2018

The Dark Side of Rapid Prototyping

As many of my viewers might be aware, my engine of choice (Godot) is very suited to rapid prototyping.

It's very quick and easy to program most types of game logic and usually, actually prototyping something will take anywhere from 1-4 days of full-time work. This is awesome compared to heavier programs like Unity which are a bit more technical and in-detail even when that's not what you're looking for, but that's a topic for a different video.

However, it's also very easy to prototype WAY too much. I know this because a little while ago I temporarily burned myself out prototyping like mad for a month, and then had to take a month off of YouTube and gamedev.

This was partly because I had a bunch of exams, but forcing myself to continue with that stuff even when I hated thinking about it would have put too much strain on my ability to properly revise and prepare for exams.

For context, I made about ten prototypes of games in about 20 days. Needless to say this was just too much and to not make any real progress or not make anything that I can actually say I'm proud of in that time was pretty instrumental to burning me out. I didn't make really any cool graphics or programming tricks or ANYTHING that was actually cool, it was basically just a new layout of buttons and keybinds every time.

That's kind of the problem. I frequently say to people who are looking to avoid burnout that they should maybe not leave graphics right to the end unless graphics are really intensive to create, at which point they probably shouldn't be making the graphics so intensive to begin with. If you don't have something you can look at and feel good for having made, it's going to take a toll on your brain after a while.

That's why with my current game, WARP-TEK, I basically made all the sprites right as I was implementing the entities and even though I had to basically bleach them and apply some cool colour aesthetic, I was still working through the visual aspect at the same time. This keeps me motivated and excited to keep working on this game. Maybe I'm just a particularly visual person, and some people don't value these things as much as I do but I can say from the bottom of my heart that nothing helps me to avoid burnout like creating tangible assets that I'm proud of alongside programming.

Also, it helps with your early marketing if you've got some flashy graphics or a catchy tune to go along with your game from early on, since most consumers also won't care about "woah look at this crazy level generation algorithm".

But either way, what's the point of this video?

If you're making a prototype, you're trying to determine whether the game is worth pursuing. Remember that you're not just trying to make a really rubbish, stripped-down version of a game, you're trying to think about whether or not it's worth even continuing.

Sometimes it's a good idea to create assets alongside prototyping if it helps you to determine the value of the game idea. That's basically the advice.

I didn't create any assets I really liked when I was stuck in prototype hell, but when I came back I made a prototype with a few assets I kind of liked the look of and it motivated me to make the prototype into a full game, which is now known as WARP-TEK. It's better to make sprites too early and have to re-make them than to put off making sprites until your project dies anyway.

Thanks for watching this poorly scripted mess, but if you actually gleaned some useful information from this then I'm simultaneously glad and impressed. Stay tuned for more tightly-scripted videos, in the future, trust me, I promise. Goodbye!