Jeff Posted June 4, 2011 Author Share Posted June 4, 2011 This tutorial will show you how to make button templates similar to those in EO, all in 3 simple steps! I know it's really simple, but it might help a couple of people out.Finished proudct:now, for the tutorialSTEP 1:create a 69x29 canvas and fill it with a gradient like so:STEP 2:create a box around the edge of the canvas. Then erase all the pixels in the corners of the box, and on the inside corners add a pixel of whatever color used to create the box(I used black)your image should now look like this\STEP 3:repeat step 2 except inside of the outer border as below. I used a lighter color, and I think using lighter colors for this step is generally good.Well done! your image should look like this:With some different colors and some creativity, you can come up with hundreds of unique buttons!Try adding in images, making it shiny, and adding text!You may use any images in this tutorial.Edit: Buttons SHOULD be 69x29. 89x29 is too big. Images in this tutorial will be wider than they're supposed to be.Note: To make a clicked button, flip it vertical, it flips the shading, and in turn making it looked pushed down instead of up.Credits:me-most of tutorialKemerd- Note at bottom Link to comment Share on other sites More sharing options...
Robin Posted June 4, 2011 Share Posted June 4, 2011 @El:> With some different colors and some creativity, you can come up with hundreds of unique buttons!Palette swaps do not make unique buttons. Link to comment Share on other sites More sharing options...
Jeff Posted June 4, 2011 Author Share Posted June 4, 2011 @Robin:> Palette swaps do not make unique buttons.the truth isn't good for advertising Link to comment Share on other sites More sharing options...
gdog12356 Posted June 4, 2011 Share Posted June 4, 2011 @El:> the truth isn't good for advertisinglolnice tut, its helpfull to me and many others :DD Link to comment Share on other sites More sharing options...
maxi_d_great Posted June 4, 2011 Share Posted June 4, 2011 my button Link to comment Share on other sites More sharing options...
RyokuHasu Posted June 4, 2011 Share Posted June 4, 2011 Thats better!And if you can try and make mini graphics on the buttons unique too.V These buttons are property of HOA online, GNGames, and xCode Link to comment Share on other sites More sharing options...
Robin Posted June 5, 2011 Share Posted June 5, 2011 Why would you claim property over those things? They're terrible. Link to comment Share on other sites More sharing options...
Vince_Lawrence Posted June 5, 2011 Share Posted June 5, 2011 This is pretty simple and useful! Link to comment Share on other sites More sharing options...
RyokuHasu Posted June 5, 2011 Share Posted June 5, 2011 @Robin:> Why would you claim property over those things? They're terrible.Cause I can. Link to comment Share on other sites More sharing options...
Jeff Posted June 5, 2011 Author Share Posted June 5, 2011 @maxi_d_great:> my buttonI'm not sure how they relate to this tutorial in any way, shape, or form but… ok. They don't look too horrible. Currently it's just the fact that you used comic sans that makes me angry.@RyokuHasu:> Thats better!> > And if you can try and make mini graphics on the buttons unique too.> > V These buttons are property of HOA online, GNGames, and xCodeUnless you're a talented artist, I would recommend getting pictures from experienced pixel artists for icons. Making your own is tough, and for a GUI it doesn't matter as much if its custom.Someone should make a basics of design tutorial here, about a third of the community would benefit a crapload. Link to comment Share on other sites More sharing options...
maxi_d_great Posted June 5, 2011 Share Posted June 5, 2011 what's the matter with comin sans ?? :cheesy: Link to comment Share on other sites More sharing options...
Godlord Posted June 5, 2011 Share Posted June 5, 2011 @maxi_d_great:> what's the matter with comin sans ?? :cheesy:Regards, Stephan. Link to comment Share on other sites More sharing options...
saadhamza Posted June 5, 2011 Share Posted June 5, 2011 @maxi_d_great:> what's the matter with comin sans ?? :cheesy:What's the matter with common sense, you say?:D Link to comment Share on other sites More sharing options...
janpan40 Posted June 5, 2011 Share Posted June 5, 2011 Basic but nice tut, great job :) Link to comment Share on other sites More sharing options...
Kemerd Posted June 5, 2011 Share Posted June 5, 2011 Thanks. Helped a lot. Also, you should add this:To make a clicked button, flip it vertical, it flips the shading, and in turn making it looked pushed down instead of up. Link to comment Share on other sites More sharing options...
Jeff Posted June 6, 2011 Author Share Posted June 6, 2011 added Link to comment Share on other sites More sharing options...
lordofchaos Posted June 7, 2011 Share Posted June 7, 2011 nice! 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