Creating a Virtual World! Part II: Interface Design

July 29, 2019 posted by

okay guys so walk on the part two of how to make a virtual world series I had an upload up to the lid in like two weeks sorry about that I've been just started this channel up and I've been a little inactive for the vibe been working on some projects on the side also I don't know if you guys notice I'm not really sure but my Internet's been off all day there's been our local problems so I don't have inner and any internet today so I'm probably gonna end up uploading this tomorrow so you know obviously you'll see this when it's uploaded but just for some information so just a little side note when it gets time for the last tutorial I'm going to be making the publishing tutorial so how we're going to do it and how I'm going to show you guys two ways I'm going to show you guys how to localhost it using Hitachi I think it's called it's the name of the program that's for a local host streaming it by the way that will take a shitload of bandwidth and you will need like basically an unlimited plan and a pretty damn good computer to run the server or you can just pay I don't know 5 to 20 bucks a month for a VPS which is a virtual private server which I'll show you guys how to set up if I do end up getting one there are trials or whatever but you have to put in credit card information and personal information and it's just a bunch of so you might as well just go ahead gave up a couple of bucks and buy one so one was uh part 2 we're going to be customizing the interface sorry about that little introduction so we left off with setting up our server and it's just the way we left it so low we're not really gonna worry about that we're not gonna see those frames too much that's really just for the code purposes but we're gonna take a look at the connect key frames so as you can see we have the smart pop server branding we can say goodbye to that because our game is not going to be called smart box server unless you want to promote them or something I don't know so anyways you will also see Avatar chat example you can keep that text and change the text to don't say you want to make the game uh my world be a pretty stupid name but if you like it and you can change the font and everything I'm gonna change the thought because this font looks like I'm gonna change it to boo that doesn't look good for game now you can download fonts from I have tons of custom fonts installed on here I can use battle boom yeah Frieza font size per space okay so now we you can customize that text delete that branding now what we're gonna do is I'm gonna modify some of this so I don't like this background either so what I'm gonna do is I'm going to place my tool box nope and that's so annoying okay see if I can dock it so annoying oh there we go I was able to dock it okay so I'm just gonna fit this in window so now we are also gonna remove this because we don't really need that and just uh you can put your own trademarking down there if you want now so with this I'm gonna make a new background what I'm going to do to do this is I'm going to use the rectangle tool so I'm going to draw a rectangle over the entire frame like so and as you can see it's covering the text or it's just a text is the same color we won't know until we change the full color so you can use the solid color like green mmm well Paint Bucket green or you can make it like I don't know blue or something but I think a gradient color would do a much better look you can do a rainbow but that would look kind of weird but I'm gonna do a gradient color so I'm going to pick gradient green because that looks pretty sick so I'm gonna put that right in the middle here there we go okay so I'm going to use this gradient green and now I've got a new background now I'm also going to set this to back first I'm going to convert it to a symbol I'm gonna name this VG just so I can keep my cleat my tree nice and organized and I'm going to arrange send to back okay what the hell happened my text yeah I don't really care about my texting just create a new one okay so now that we've got that we've got our custom background this is just for the login screen now for the login button you can edit this this is a clip in our library so we can just double click that and double her and edit it in place aren't I hit ctrl + to kind of zoom them right here so I can see what I'm looking at so I can change this login text to play I can change the font to whatever I want I'm gonna change it to mm I'm just gonna pick a sample one from now nightclub BTN that looks that's that looks pretty cool so put that right in the middle there oh okay now we can also change our background color this by using the fill color and we can change it to gradient red or I'm just going to use the paint bucket actually change it to gradient red okay so there we go so we're just gonna back over here and hit ctrl – I'm gonna go back to fit to screen okay so there is our play button we can also make that a little bigger if we want to I'm going to try to keep it to scale so I make it I increase each one by ten so I animate this 370 actually by by 20 and we made this 6700 that was position I was positioned my mistake I'm just gonna make this 79 and 38:58 here we go so there's a little play button we can move that we can do whatever we want with it now this is the saddest X you can delete this or whatever you want or actually you should just move it off the screen because it's something Oh so it might give you a syntax error if you remove it I'm just gonna keep it I'm also going to modify this because it doesn't look too cool so I'm gonna take our box and I'm going to let's see right here see what I can do with our box we can make it bigger or smaller we can make it striped like a different edge to it if you want to you can do a ton of different stuff in the properties if you want to I'm trying to do something else it's not being bitch right now I don't know why it's doing this shouldn't be doing this whatever I'm just gonna keep it like that okay so and we can move our text right above it and you can move stuff around and add different text I'm going to add a text saying my world just to show you guys an example and I'm going to change that text about boom again that's a pretty good font I like it once again you can find some fonts in the description below I'll keep a link in the description for you guys in case you are interested in trying to get some new spots because the fonts that come with the computer default are pretty bad I don't like them at all so yeah alright so there is our text we can put it right there and that's it for our frame that's not centered I'm just going to do this to make it perfectly centered there we go perfectly centered okay so it's a little off like you can fix that if you want I'm just doing this quick to show you guys so anyways we're off of that frame and we are now going on to the play frame so once again we've got some more smart Fox branding that we do not want so we can just go ahead and delete that here username text okay that shows you who you are I'm pretty sure that you're gonna know what your own username is yeah so I'm just believe that I actually moved out to the side once again make it syntax errors okay so room list I'm gonna do something with this later but I do not want it on my stream right now so I'm going to hit ctrl alt where is it okay I'm just gonna move it all here and I'm on a fight later there we go okay so I'm just gonna move it off to the side and the same with the user list okay okay so now I'm gonna move this up a little bit since I deleted that empty space at the top now I can change this to whatever we want I'm gonna make it my world you can even delete that if you want you can change the text you can delete it whatever you want to do and you can remove these two little arrows they're not really that cool and wheat this top thing in general I'm just going to delete that whole top thing okay now I'm going to expand the size a little bit because we have a ton of space and move it up a little bit here we are okay I'm just gonna move it down okay and here's our little chat bar gonna make this a little bit bigger as well maybe to there bring this over here and we're going to make this figure as well fit with thee okay here we go so there's our chat button and stuff once again you can customize this text to say enter or whatever you want to put I'm just putting that quickly and once again these two arrows are stupid don't like the arrows they look really stupid okay so there we go and this tells you the current room that could be useful so I'm just gonna put that at the top and that's pretty much it for customizing the interface you can do whatever you want and once again I'm just showing you guys this for example I'm gonna go ahead and run the server dat just waiting for the server startup I don't why it's taking so long because I did run this before so it shouldn't be recompiling all the files but one whatever okay so we're just gonna wait for the thing to start up okay server is already so we can go ahead and go to publish preview default and edgy as you will see when it starts up here we are I'm just going to delete this bandwidth meter where is it in here don't need that okay so we can okay that isn't good good at all I can't click over here but I can click right there doesn't make much sense but anyways you can see our thing like you know what I mean works the thing works it did what we wanted you can run around the stuff and it got rid of the stuff we wanted and it's off the side and you can't see it except for right here but people using it won't be able to resize it like that and yeah that's pretty much it I'm just gonna see if I can fix that problem and I have them on my frame right here I think it's something dude oh it's because it's going over top of that property and also this text is sent to input text and change that the static text so if you put text on there you're going to need to change it to static text or it will be editable which is not what you want so I can go ahead and publish it again and it should work perfectly fine yep we cannot edit this we can type in here and it works perfectly well now on the next tutorial uh this one was a little short actually I'm gonna check the exact time twelve minutes so those a little long sorry about that guys but anyways in the next tutorial I'm gonna be showing you guys some stuff you could do with the code so basically in the ActionScript and XML if you guys don't know what that is you're new to programming that's okay and I'll make it very simple and friendly for new users so they can understand it and after that we'll probably be showing rooms and stuff like that so anyways I'll see you guys later and the next tutorial and these


22 Replies to “Creating a Virtual World! Part II: Interface Design”

  1. YellowBroZ YT says:


  2. Toasdie Media says:

    Thank you for giving me the power to make a cringy webgame no one will play

  3. AestheticallyAntiSocial says:

    I already have a good name for my game

  4. Pandaxletsplay says:

    It says some features aint supported with Flash 7 Player

  5. Pandaxletsplay says:

    2:29 OMG Thats a title I had for a future game
    2:30 -_-

  6. Epic Planter says:

    50th like

  7. PmMeInsteadOfReplyI'mSwitchingChannels says:

    It has to recompile because you changed the style, in over words the code. Its not backend server editing your just editing the client though.

  8. Autistic Existentialist says:

    will the game that you make end up in google or chrome??

  9. Hannah Maldude says:

    I havent tried this yet but it looks really cool so far but i wanted to say will thiis be on chrome or google/ Or just you know

  10. Qileu says:

    Coding MMO making my company Slayer Entertainment message me if you have what it takes to join.

  11. animationguy118 says:

    Please upload more i really need a tutorial on player cards! Plz

  12. Savinderjeeth Singh says:

    When I start my server it says db manager activated and it stays like that it dosent say server ready three times.Can someone help?

  13. Mr HC says:

    It doesn't come up with Publish preview option

  14. 2VeryIcey Gaming says:

    like if you are a kid

  15. Srdjan Onverse says:

    btw it's blue but can't send with Blue

  16. Srdjan Onverse says:

    ** Socket connection failed. Trying BluBox **
    [ Send ]: connect
    Error opening URL

  17. Puzzle OV says:

    To me it says Connecting… and later on it say Could not connect!

  18. zinnia🌸 says:

    This really helps, because since I was little I wanted to make a virtual world. This a lot more helpful than most, too!

  19. krispoland1 says:

    when i previe it says connecting and never connects

  20. SpecterDev says:

    Part V (5) is coming out sometime tonight 🙂

  21. DwillProductions says:

    Need the new videos

  22. john bravo says:


Leave a Comment

Your email address will not be published. Required fields are marked *