Guest Posted January 20, 2007 Share Posted January 20, 2007 This Game.gif Tutorial applies for both versions 4.5 and TEThe tutorial is used to impliment an Outline GUI to any and all backgrounds. Lunar backgrounds are suggested for beginners as they come already packaged in different sizes.Anyway, lets begin.STEP 1 - Choosing a pictureLike I said, I reccomend my packaged backgrounds for these particular types of GUI simply because you can skip like 4 steps. For purpose sake, I will use the red GUI picture to create it. Make sure you are at this point viewing the image in a documents folder.STEP 2 - Altering your pictureWhen you have your picture right click it and press "OPEN WITH >>> PAINT". It will then open up in paint funnily enough. You need to make sure it is at least 852 x 599 pixels in size first of all. Click on, IMAGE >>> ATRIBUTES![](http://img170.imageshack.us/img170/7416/scrn11fl.png)Check the image size is at least 852 x 599 pixels in height and width.![](http://img297.imageshack.us/img297/807/www7ep.png)When you have done this, make sure everything you want from the picture is available for 852x599\. In other words, if the woman from the red picture does not fit in the picture when it is the newer size, move her there. When you have fitted everything snug then you can alter the attributes to 852x599 and see. Undo if you make a mistake (remember paint only allows 3 undo's)IF THE PICTURE YOU WANT NEEDS TO BE MOVED, follow these instructions:Click on, EDIT >>> SELECT ALL![](http://img50.imageshack.us/img50/6425/scrn36aq.png)Move your picture around to get the things you want into the space you want them (the woman into the frame of the picture) so instead of…[this](http://www.abcdigitalart3.hpg.ig.com.br/animes/WhiteDaeya_DigitalSorceress_800.jpg)You get this…![](http://img361.imageshack.us/img361/6905/scrn41nw.png)After all of this, dont forget that it is absolutely important that your file is 852x599 (or even 851x598 on some PCs, but ill discuss this later)STEP 3 - Adding the Game.gif OutlineFirstly press EDIT >>> PASTE FROM,Find the UNZIPPED file of Game.gif in your Outline GUI folder,Right click the black colour and click the transparent button (image below).![](http://img168.imageshack.us/img168/7379/scrn51jr.png)Now (whatever picture you are using) you should have something that looks like this (depending on the outline you are using):![](http://img188.imageshack.us/img188/7765/scrn64yy.gif)STEP 4 - IMPROVINGFirstly, it already looks pretty descent as it is dont u agree? But it still needs some of those vital touches to set it off, for example making a filled box thats crimson red to make the buttons stand out (filled box is 3rd 1 down in same place as transparent option). You can even fill in the chatbox and inventory/spell boxes to make them stand out also (colors.txt will be changed in next tut)to get better results. Hopefully, if you understand paint you can do this with no worry at all. Here is what it could look like after the changes:![](http://img279.imageshack.us/img279/6483/scrn72zw.gif)One thing though, because of the exit game button and the writing in the game options being black, try not to make the boxes black otherwise you wont be able to see them (4.5 GUIs ignore this rule as the text is in the GUI not the program itself)Now you say well where is the writing? Thats the fun bit :P you can make the writing style anything you want now (default is Tahoma size 7 or 8). You can make them have a picture instead of writing (MP/HP bars as in example)![](http://img171.imageshack.us/img171/6194/scrn95gz.gif)–-After all this...you may have the urge to add a few little bits and bobs here and there, like extra lines that connect pieces together ect...(use the first line size in paint is preferable)the example:![](http://img281.imageshack.us/img281/6047/scrn100aa.gif)and there you go :P your first GUI…as you create more and more GFX for your game you get more experience and a better quality of GUIFor those of you who are handy with image editing sowftware such as photoshop, this last step would have been pretty fun for you and you would ahve done it much easier.Look into the Colors.txt tutorial to find out how you optimise and improve on how the GUI looks like in-gameThanks for reading! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now