Branching Dialog System with Effects in GMS 2! (Part 1: Setup and Typing Effect)

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments

Please don't post the same link more than once. Thanks.

👍︎︎ 1 👤︎︎ u/DragoniteSpam 📅︎︎ Jul 27 2021 🗫︎ replies

Dude, I'm so happy that you posted this. I love your tutorials. I've been checking my sub box obsessively for a while just waiting for this.

Seriously, you're an awesome teacher. You make your tutorials very easy to follow.

👍︎︎ 9 👤︎︎ u/EmpathyInTheory 📅︎︎ Jul 27 2021 🗫︎ replies

This looks fantastic! Great work!!

👍︎︎ 5 👤︎︎ u/LukeAtom 📅︎︎ Jul 27 2021 🗫︎ replies

Luckily you mentioned early that there is a system menu tutorial for beginner. I will try that first.

I hate those videos where people spend a few min promoting the channel and never mention the difficulty level of the tutorial until the end.

👍︎︎ 3 👤︎︎ u/Sunzoner 📅︎︎ Jul 28 2021 🗫︎ replies

I loved the videos and did the entire thing, plus made some modifications to fit my game. With that being said, I would have loved to see a final part where you ‘add’ this dialogue system into your previous tutorial series. I would love to see your interpretation for how to have intractable npc’s.

👍︎︎ 3 👤︎︎ u/dunhour2 📅︎︎ Jul 28 2021 🗫︎ replies

Absolutely fantastic! This is amazing stuff, keep it up. This is one of the best tutorials I've seen. Good luck in your work!

👍︎︎ 2 👤︎︎ u/OfficialBradleybus 📅︎︎ Jul 28 2021 🗫︎ replies

You're a god my man. Just finished part 5 of this tutorial (and tweaking everything to fit my project). I could never have come up with such a flexible and powerful system on my own, so thank you for your time and effort.

Would it be pretty intuitive to set plot flags and change inventory values from within the script holding all the dialogue? I haven't messed about with it yet, but it would be great to have someone saying "here, take this" immediately preceding a function where you receive an item

👍︎︎ 2 👤︎︎ u/chibeatbox 📅︎︎ Aug 17 2021 🗫︎ replies

Hey, i'm currently using this tutorial to help me create my first RPG on game maker and I'm having issues bc of the nature of my textbox, my portrait insists on staying behind the textbox and I'm not sure how to code it to be ALWAYS in front, any help?

👍︎︎ 1 👤︎︎ u/BrudaWhatArUDoin 📅︎︎ Nov 11 2021 🗫︎ replies
Captions
welcome to the big kid dialog system tutorial i'm going to show you exactly how to make the system that you're seeing on screen right now so i'll be taking you from zero to a fully featured text box where you can have branching dialogue character portraits a lot of expressive different features text effects like having colored words or shaking letters anything like that and doing it all in a way where it should be super incredibly easy to use in your own game and i'll teach you everything you need to know to be able to add more stuff to it there are a couple things that i want to know before we start on this first this is uh i would say pretty advanced tutorial there's a lot of work that goes into making something like this and there's probably a lot of places to make some little mistakes so if you're a beginner something i would definitely recommend you do first is watching my menu system text box video and honestly to anyone watching this i would recommend you probably watch that one first it helps lay down a couple fundamental principles and it's just a lot friendlier so i'll have that link below but anyways yeah there's a bit to this tutorial series it's five parts each covering a pretty specific thing so really all that's just to say make sure you're really paying attention and you're really cross-referencing your code for what you're seeing on the video a couple parts in the video are edited kind of quickly just so i wouldn't have these crazy long videos but obviously i still walk you through everything which is why the videos are a little bit longer so yeah this first video is just about setting up a text box that has a typewriter effect and has multiple pages that you can flip through it also is a lot of the groundwork so i would suggest not skipping this one if you want to get straight to the branching dialogue but yeah that's about what you need to know heading into the video before we get started i'll just say that the purposes of these videos are obviously educational i want to see more people make more games and to that effect these are obviously free so if this video ends up helping you out you can support me by following me on twitter subscribing here and by around october 2021 i'll be putting out a little action game so feel free to pick up a copy of that when or if it's already out and i'm always working on a long-term project called rosa starcross and if you follow me on twitter and subscribe here you'll more or less be able to keep up with that anyways let's get started and good luck okay so starting off here i just have my project open and just like with the menu system video i'll be putting everything in a nice brightly colored folder for this video so that way we can keep everything all nice and organized in this folder i have four things already one is a room for testing i'll show you that in a second and the other three involve setting up our font and our text box background these three things are actually directly from the menu system video and they're very very important to our dialog system so if you haven't done the menu system video or you just need a refresher i'm actually just going to put that little section from this video right here there's a time code on the bottom here so if you've already done this for the other video and you're well acquainted with it then you can just skip this part but if you're not sure it is very important so in sprite main font i have this which is most of a font just a very very simple pixel art font feel free to pause this as i scroll through and if you want to copy it whatever you don't have to make your own font but it's just a lot more smooth and handy to have whenever you're using your like everything is totally your own assets and you're gonna make sure while you're making your own or copying this or whatever that all of the characters are in the same position like this and you're going to want to make your font in this exact order this order is very important for game maker to know whenever we actually set up this font what to type then once everything's in the same place you can go to image and then auto trim and it'll make your sprite as small as possible without cutting anything off of any of the letters and here in your workspace just make sure that your origin of your sprite is in the top left now we have the menu background we're going to use and game maker 2.3 has 9 slicing which is a great feature that is super super useful for menus and text boxes all that kind of stuff it basically means that you can make a sprite background and resize it however you want and it won't stretch and strain itself in weird ways it also means it's very very easy to do cool little animated backgrounds like this so i'll show you really quick how to set these up so in my image editor i'm going to go ahead and resize these frames to 48 pixels by 48 and now you can see how it's divided up there's a center piece there's a top left bottom and right i have it animated so that it'll loop as it goes diagonally down but you can just have this be a solid color whatever then i did the same thing i did with the font and i auto trimmed it to get rid of all the excess stuff out here we can go to the nine slice panel activate nine slice make sure that it is checked on and then you can drag these borders to tell game maker where you want it to actually separate it out if you're just using a solid color it doesn't really matter but if you do have like an animation or you're doing something like this you can select the left bottom top and right and the center all separately and switch them down here in tile mode to repeat i think by default they'll always be on stretch which can make an animation or something look look a little goofy okay and the last things just make sure that with this sprite our origin is also on the top left once you have those sprites ready you want to create an object called object settings like this i would use this to store information obviously regarding the settings for the whole game so i've done it where i've set it to be persistent so once it's been created it stays in the game and it doesn't go away once you leave the room that you created it in so make sure that's checked then in a create event i've created a global variable called global.font underscore main and i use this function here called font add sprite which lets you create a font from a sprite asset that you have i've used my sprite main font we've started the first character at 32 we've set proportional to be true which means that letters will be spaced based on how wide they are so for example an i won't take as much room as an o will and then we put separation as one and this is just the space between every letter that we type so just one pixel and since we're working with low resolution font one pixel is a very appropriate space then you want to add an event and you want to add a clean cleanup event which runs whenever this object is destroyed or whenever the game ends and we just want to delete our global.font main because if we don't it'll take up some memory that will never be freed and it can eventually slow down our computer and crash the game so then what we want to do is we just want to drop it in our testing room so i put it here on the instances layer just in the top left this room is the exact size of my camera which helps with figuring out the visuals of your text boxes as you'll see in a bit and then the only thing in here is the object settings and one last thing since your object settings is persistent that means anytime you leave and then come back into this room another version of it will create so you want to put this in like an initialization room or like a splash screen or a title screen because you don't need more than one of these running around alright so that's it for that setup okay so if we're all squared away with that then let's actually get started on our text box so let's go ahead and create a new object and let's call it obj underscore text box very nice now in our create event let's go ahead and set up a couple variables that we're going to need for this text box by the end of it we're going to have a lot of stuff kind of in here such as the nature of more expressive stuff like this text box but we're gonna start pretty simple so we can start a little section here and we can call them text box parameters so starting with the dimensions of our text box we can have text box width and i have picked 200 for this and text box height and i have picked i believe 64 for this not 63. a good way to find the dimensions of what you want your text box to be is to go into a room like this where it's just the size of whatever your camera is actually going to be create an asset layer up here and then you can start placing your text box sprite wherever you want to and dragging it around and that way you can just up front visualize exactly what you need it to be and you don't have to test with a bunch of random numbers over here so for this text box system i'm setting it up kind of like how i do it in rows of star cross which is a separate square for a character portrait and then another square for dialogue so the main one we're looking for the dimensions right now is going to be this larger one for the actual dialogue but you can place both of these here to sort of visualize it and make sure you know exactly how big you want it to be so i would probably scoot this in here to make this nice and then do the same over here and this way it would end up being something similar to this then you can just kind of drag your thing up to the top left here and then check what this coordinate is here and at the bottom left you can actually see the width is 144 and the height is 64. so obviously i spent like a little bit more time kind of tweaking it to how i wanted on the other one but just know this is a good way to find those values without having to do a bunch of running the game and testing it so i'm going to go ahead and get rid of these and we're going to hop back over to our create event the next thing i want to add is my border and the border is going to be the distance from the sides of the text box that the text will be that way it's not all pressed up against the edges now we want to make a variable called line sep this will be the separation vertically between the lines on each page and we can go ahead and get our line width which will very simply just be our text box width minus our border times two so this is just the maximum width in pixels how long a line can be before we need to actually break it and create a new line down the page obviously just getting it by taking whatever the width that we've set and getting rid of the left and right border of the box and that'll just give us the exact value that we want make sure you have this exactly like this it needs to be under border and it needs to be under width because these variables need to be set before this one does obviously so it knows how to read this stuff now we can start setting up another section that i'm just going to call the text so first let's set a variable called page and this will just let us know what actual page of dialogue that we're on simple enough then we can create an array variable called text and this is going to be a string because this is going to be the actual text that shows up on the page and obviously we make this an array so that we can have multiple pages of text then we just need a couple more things to cover the actual typing effect first thing is we're going to need to know how long each of these strings are in this text variable so let's set another array variable called text length and we'll set it up like this where we say text length zero equals string length of our text zero this will return how many characters are in this string here which will be important to know because we don't want game maker to try and type a character that doesn't exist and one of the ways it would do that is by trying to type too many characters so now we have a variable that i call draw char for draw character we'll set that to zero this will dictate how many of the characters are being drawn currently of our text string so in the beginning we want it to draw nothing and then this number to slowly count up which will create that sort of typewriter effect and then we can just use a variable to actually add to that draw chart variable and i'm just going to call that text speed and we'll set that to 1. one is a pretty good number to pick right now so don't change this at least yet and for now i'm just going to do one more variable and i'm just going to call this setup and set it equal to false we'll use this variable to check if a setup has been done and if it hasn't then we're going to run certain code in our draw event before we actually try and get anything on screen this will be good to get our text length for all of the pages right in the beginning but as we go on with the video it's going to be important for a lot of different stuff so for now we're ready to get into our draw event so let's add that so we're actually going to be setting up a couple more variables first just stuff that doesn't really need to be in the create event so something we want to get is kind of the position of our camera and the general position of our text box since we're in the draw event here so we can say text box x equals camera get view x and then of our view camera zero this way we're just keeping track of where our camera is so that way our text box won't draw to some specific x position in the room and it won't follow our camera and we kind of need to do the same thing with the y but this x value is going to be altered a little bit as we go on which is why we're just setting it to the regular x value of the camera but for this system our y value isn't going to change so we can say text box y equals camera get view y and we can go ahead and set an offset here i picked 144 for mine and you can figure this out the same way i showed you with the other one just grab this here and figure out where you want your text box to be this way from the top and i would probably put it on there maybe that's about 128 on the bottom left there but i have it set to down here yeah yeah so i have it set to where this will be the y offset so right now what we're getting is this position here based on the camera the camera's x and then the cameras y plus 144. like i said you can find your own values for this just whatever you think looks the nicest so let's get rid of that and get back over here so we're getting these every frame which is pretty important and the next thing we want to do is we want to go ahead and use that setup variable so we can just say this is our setup and we'll say if setup is equal to false then we can run some code and get a bunch of information we need before we start trying to draw the text and go through the different pages we can go ahead and say setup equals true because we only want to run all this code for one frame so it'll run all this once setup will be set to true after that and then on the next loop it won't run through any of this first thing we want to do is let's go ahead and set our font so we can do draw set font and i'm going to use my global dot font main we also want to set our vertical and horizontal alignments for the text so whenever we pick a point to start drawing text we want that text top left to line up with that point so we say draw set v align set that to fa underscore top then we can draw set h align and we'll set that to the left okay so now very very basic stuff is set up just to make sure everything's going to look right once we start actually drawing things so now we want to get stuff like our text length for each of the individual pages so we're going to need to loop through all of them so we can say loop through the pages and whenever we loop through something we need to know how many times we want to loop and so let's create a variable called page number which shows us the number of pages that we have in our text box and we can get this by saying array length of text because whenever we're creating this text box obviously the information that we are going to be feeding into it is going to be through this text array and we want this to work out to where we can put any number of pages as we want and so i could say text 0 is this text one is this whatever and then just keep on going and we want our box to be able to loop through all of those pages on its own so for right now this is how we're gonna get this page number variable and you know what let's go ahead and actually initialize it here that would be a much better idea for now so page number equals zero the reason we're going to go ahead and initialize this here is because we're going to be getting this variable a little bit differently later on in the video but for now this is the most efficient way to get it hopefully that doesn't sound too confusing if it is don't worry you'll completely understand whenever we get to that point so just know for now we're totally golden so let's actually do our for loop now so we're going to say 4 var p equals 0. we're going to do p for page so as long as p is less than our page number we will add to p so we can loop through some stuff i explain exactly how for loops work in the menu system video so if you don't know how they work this would definitely be the point to go back and just watch that video first if you haven't already so what are we looking for right now we're definitely looking for the length and text of each page so we could say [Music] text length of p equals string length of text oopsie daisy here we go this is exactly how we're setting it up here we're just making sure that we are returning the correct values based on which page we're on and we're doing that for each page now we can go ahead and comment that out too might as well do a lot of commenting so you can keep track of this later if you need to go back or go back through the video or whatever okay and it's pretty good to make detailed comments like this for right now the only other thing we need to find is a variable that i'm going to call text x offset and we're going to make this an array and this is going to be the distance from the left side of our screen that our text box actually is we're finding this dynamically because we're setting this text box up in a way where if there is not a character speaking the text box will kind of center itself like this and if there is a character speaking it'll scoot over so there will be room for a little character box and it can also scoot to the left if we want a character box to the right side of it and since we're not worrying about those quite yet we are just going to find right now the value that we want it to be from when there is no character so just find whatever value you want remember every time you check these you want to make sure that you're resetting your text box to kind of the size that you're going to have it so i'm not doing a very good job of keeping that consistent but if we were to say that this is the size of it this is about 48 pixels away so that would be a good number to put it at so i'm gonna get rid of this in my notes i've set it to 44 and we can comment this out a couple times see first so get the x position for the text box and then i'm going to tab this in so i can comment on it a second time and leave room for calculating some other stuff in the minute and we'll say this is for having no character and say this will be centering the text box on the screen okay so for now that's all the setup that we're going to be doing i'm going to go ahead and close that and we're going to move on to typing the text this part is going to be pretty easy so let's say if our [Music] draw char is less than our text length of the current page that we're on because if you remember our draw our draw char is holding the number of characters that we should be drawing we just want to add to it so draw char plus equals our text speed variable so our draw chart is going to start at zero then we're going to keep adding this text speed until we get to the full length of the text and we're going to be drawing our text based on this variable here and that'll make a typing effect and one thing we should do is right under this we can clamp this so no matter what our speed ends up being we're not going to get any errors so we can say draw char equals clamp we're going to input its own value and we're going to clamp this number between zero and our text length of the page we're on and clamping just means that we take whatever this first value is here and then we give it a minimum and maximum value and it just can't go beyond those two extremes so if our draw char happened to be negative 100 it would just return zero this line and if it happened to be a billion then it would just return whatever the maximum number of characters we have on our pages this way we avoid any kind of messy errors of game maker trying to draw letters that aren't there or something like that now the next thing we want to do is give the player the ability to proceed through the pages of text so this next section we'll call flip through pages and we want to do this based on some type of button press so up on top we can actually create a new variable to store a button press and we can just call this accept key and i'm going to store this as keyboard check pressed and we're just going to use the spacebar for this you can set it to whatever you want to if you want to set it to a letter the way you would do that is letters don't have these vk constants you would use this little thing here called ord and what you would pass through this is a string of whatever button so if you wanted it to be e then you would put a capital e in here so this would be checking for the e key being pressed i'm just going to keep it as space so now we have a variable that is returning whether or not that the space button was like just pressed on this frame so that's whenever we want to run this code to flip through pages and skip dialogue and stuff so we'll say if accept key then we can run this code and i'm going to be doing this kind of a simple way where if the text is not done typing if you press the space bar it will fill out the whole page and if the page is done typing then it will go to the next page you can use as many different buttons as you want for this kind of thing it doesn't really matter you should be able to apply it to this pretty easily so first let's say if the typing is done then we can go to the next page and so that's if our draw character is equal to our text length then that means that the page has fully played out and been fully typed open these brackets here and now we're going to go to the next page or if we're out of pages we want to get rid of our text box so we'll do that check real quick and we'll say we'll start with what our next page case is going to be so we'll say if our page is less than our page number -1 then we can just add the page that we're on and we want to set our draw character back to zero so that way it restarts with the next page having nothing and then it's typing all the way up to the end the reason we do page number minus one is because page number is returning the full size of our text array which arrays start with the zero value and then go all the way up so if there were four text pages then that would be text 0 text 1 text two and text three so the maximum one of those that we wanna be able to actually read will be text three because we're gonna start at page zero and then we're gonna go up to page one then to page two and then to page three and that is our final page so that's where we don't want to be adding this variable anymore hopefully that makes sense so now that we are adding a page if we're not on the last page then we can add a little else here and we'll go ahead and label that as destroy the text box all we really want to do is just destroy itself so instance destroy so now if we press the accept key if the text box has already been fully typed out and it's done then we will cycle through the pages until we get to the last page and then it will just get rid of itself now the only thing left to do is we know what we want to do whenever the page has already filled out but if it's not we just want to fill out the page so that's pretty easy to do we're going to add another else down here for let me separate it out like this a little bit so you can see a little bit better so this is all here and we're going to say if this isn't true which would mean that we're not done typing if not done typing we'll add a little else here another brackets so this is the else to this condition up here we will just say draw character draw char equals text length of our page so now if it's not done typing it will just immediately fill out the page and then the next time we are to hit the accept key we can actually move on okay feel free to clean this up however you want to i like to keep things pretty compact but it might be easier for some people to sort of give everything a lot of space so you can really see what's going on okay we've almost got something ready to go now we just need to actually draw the text box and before we do this let's actually just set up a couple more things in the create event here that i kind of forgot about so we want to add a few variables that help us properly draw and animate our actual text box background so let's set a variable called text be spr for text box sprite and i'm going to set that to my sprite text box that i have over there then we need to set our text b image we'll set that to zero and we need to set a speed for that as well so text b image speed the reason we're going to be doing this with our own variables is because we are not setting our sprite index of our text box to this sprite and the reason being is that we're actually going to be animating a couple different things once we're done with this including like a character speaking with a dialog box so it's kind of just best to give everything its own variables that we can control instead of just using the built-in stuff in game maker it'll look totally identical to how it looks whenever it's built in it just takes us a couple different steps so we want to get our text box image speed we can open up our text box and if you have an animated one like i do just set it up here to whatever you want it to be i think six frames per second looks pretty good and all that is is for each frame this is six divided by sixty because it will be six frames lapsing over the course of 60 frames in the game so whatever this number is let's say you set it to say you like this 11 you would just set this to 11 divided by 60. so this speed is just whatever this number is divided by 60 or whatever your game speed is i assume most of you probably have your game speed set at 60 frames a second if your game is set at 30 frames a second or something like that then it would just be divided by 30. okay so let's get rid of that we can come back over to our draw event and before we start drawing our text box we can do some stuff with those variables so we can actually go ahead and get what frame we want it to show basically means that we're going to be manually animating it and we can just say text b image plus equals our text b image speed so whenever we start drawing that sprite we'll just be using this value as the sub image then we need to set some new variables because we need to grab and store the width and the height of our sprite so we can say text b sprite w for width and that just equals sprite get width of our text b sprite and we want to do the same thing with the height so text b sprite underscore h make sure you change this to height we're gonna need these values to make sure that we are drawing our box up here with the correct width and height in pixels if you watch the menu box video you'll know what i'm talking about if not you'll see in a second so let's go ahead and draw the back of the text box and here's how we're going to do that we're going to use the function draw sprite ext extended so the sprite we're going to draw is going to be our text box sprite our sub image is going to be that text box image our x is going to be this value we got up here plus this offset value that we set here so it's going to be text box x plus text x offset of whatever page we're on so let's put that down here so text box x plus text x offset of our current page our y is just going to be our text box y and then here for our x and y scale is where these are going to come in handy so we want to take the width that we manually set so text box width and divide that by our text b underscore spr underscore w so we are taking this number that we set in pixels so for me that's 200 and we are dividing it by whatever the width of our text box sprite is so in this case it would be 20 but this could be any number the good thing about doing it this way means that you could make any type of text box sprite as long as you chop it up and set the nine slice properly this will always give you the correct scale to match 200 pixels so we do the exact same thing for the height so text box height divided by our text b sprite h perfect and for the final values uh i'm not going to rotate this at all i'm going to set the color to c white which means it will just show up as this exact text box and then i'm just going to set the alpha to 1. you could change these however you want once we get farther into the video whenever we start doing the more dynamic stuff you'll find that you could add different variables for this kind of stuff but i'm just going to keep these simple so now the actual back of the text box is being drawn and the only thing left to draw is the actual text itself so down here i'm going to say draw the text and actually something i'm going to do i'm going to comment out these to make them a little bit more obvious that they're sort of the big the big sections here so before we draw the text it's probably a good idea to have some text to draw so in the create event here you know i've changed what my text zero is and then i've added three more and it's just some garbage of varying lengths so we can check and make sure everything wraps around and that the page flipping works so go ahead and add a couple of these something like this just whatever so now back into the draw starting with the draw text first thing we want to get is what is it that we actually want to draw in this moment it is our text array but only up to our draw char so that way it types because the draw chart is adding constantly so let's set a local variable by doing var and i'm going to call this underscore draw text and we are going to set that equal to string copy what this function lets us do is pass a string through it select which character we want to start on and then how many characters we want to copy from that point on so we're going to use the text of the current page we're on it's a text page we're going to start at the first character which for strings actually starts at the number one not zero like a lot of things in programming just kind of get used to this and i'll explain it every time it kind of comes up there's a couple places later on in this where it can kind of be hard to remember so just stick with the video pretty close but anyway so we're starting with character one and then our count is going to be our draw char now this string is returning exactly what we want to type and we just need to now draw the text so we can do draw text extended and this will have it automatically break lines and stuff for us which is pretty nifty so we need our x and y coordinates our x and y coordinates are going to be the same x and y coordinates as the actual text box itself but we're going to be adding in that border variable so for our x i can just take this little bit here i'm going to copy the x position here paste it and then i'm also going to add my border do the same over here so we're going to take the same y variable put this here add our border oh my god then we're going to draw a string which we already got up there so that's draw text just plug that in and our separation and width we set in the create event already and that would be line sep and line width so line sep line width so to test it obviously we need to go into our room and we can go ahead and grab an instance of our text box and drop it on an instance layer in a room anywhere it doesn't really matter since we're specifying where everything needs to draw through code now one thing is this room is totally empty for me there's nothing in here so this will show up since it's on the layer above the background but if you're already testing this in your game with kind of stuff going on something that you might should probably go ahead and do is in your object text box in the create event you probably just want to go ahead and set the depth to like a really a really really low number because you pretty much always want your text boxes to show up on top of everything else so we can just say depth equals negative 9999 something like that so now it's in the room we can run it and test it [Music] okay that's typing all right [Music] the page flipping works a short piece of text and there's a long piece of text nice you can see here i've given myself enough room in my text box to have four lines of dialogue so that's pretty good for me i'm gonna go ahead and rerun this one more time so i can test the text skipping [Music] and it looks like that works fine too and it gets rid of itself now we did a lot of stuff before we did any tests which is just kind of the nature of the beast when it comes to stuff like text boxes that kind of require a few different moving parts to go together if something looks weird or if something is giving you an actual error and your game isn't running or it's crashing at some point now is the time to go back through the video and one make sure you kind of copy everything the right way kind of listen to maybe how i explain things again and if it just looks a little bit weird it might be that you maybe picked some weird numbers in the beginning part where you're figuring out how large it needs to be all these kind of width variables border variables all that kind of stuff can kind of drastically change the way your text box looks but hopefully everything is fine for you now this is kind of the first big step is actually getting the text box up there where it types the main thing you probably notice here is whenever the text gets to the edge it keeps typing until it's too long and then it wraps around you probably see it here yeah you see it starts typing and then it pops back over whenever it realizes it's too long yep yep look at that okay not a problem we're gonna manage this later because we're gonna go about the way we type the text in a completely different way towards the end where we get into the more expressive stuff and interesting things but we're gonna keep it like this for a minute just so we don't have a bunch of stuff getting in the way of what i think is probably the more important thing which is the actual dialogue choices and linking text boxes together so this is sort of the end of the first section like i said if you're having any issues if something looks a little bit weird now would be the time to go ahead and take a break maybe come back skim through the first part of the video again maybe even watch it again and then we're gonna move on to the next part okay congratulations on getting through part one and thank you for watching like i said in the beginning obviously it helped me out a lot if you followed me on twitter and subscribed here the game you're seeing right now is an action game that i'm going to try and put out in october of 2021 and if you're watching this video pretty soon after it goes up then pretty soon from this point i'll be posting an actual trailer for it then of course there's rows of star cross big big long term super high passion project of mine it's had a lot of work put into it that's how i figured out how to do a lot of this stuff that i'm doing tutorials on so you can actually play a demo of that right now if you want to there will be a link in that in the description that's free and yeah all five parts of this video will be available within the first five days of this first video being posted so chances are all five videos are probably out so you can start on part two right now if you want to might be a good idea to take a break like i said but that's really up to you see you later [Music] you
Info
Channel: Peyton Burnham
Views: 14,766
Rating: undefined out of 5
Keywords: dialog, dialogue, branching, textbox, dialog system, textbox system, branching dialog, typewritter, typing, effect, colored text, shaky text, shaking text, gms2, gms 2, gms 2.3, gamemaker, gamemaker studio, gamemaker studio 2, rpg textbox, rpg, choice, choices, vfx, sfx, undertale, omori, deltarune, top down, programming, rpg maker, branching textbox, character, portrait, gms, tutorial, how to, how to make, guide, starcross, options, text options, typewriter, expressive, floating text, text, box
Id: rEYSi0ahC5Q
Channel Id: undefined
Length: 36min 57sec (2217 seconds)
Published: Tue Jul 13 2021
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.