Adventure Game Studio

Creative Production => Critics' Lounge => Topic started by: ThreeOhFour on Fri 07/09/2007 12:36:35

Title: Gui lettering
Post by: ThreeOhFour on Fri 07/09/2007 12:36:35
Hey all,

Sorry for cluttering up the board with crit threads, but your help would be greatly appreciated.

After a couple of hours mucking around with layers and the like in my new downloaded version of GIMP (and wondering why I hadn't tried this layer thing sooner!), I managed to create the following GUI template:

(http://img444.imageshack.us/img444/8886/guipq0.png)

Unfortunately I'm not sure how to do the writing on the buttons so that it looks good. I've tried a number of different things, and it always looks very blocky and unappealling. Obviously I have a fair bit of work left to do on it before it begins to look good, but I'd like to get this lettering done now if I can.

Thanks for your time - any suggestions are very appreciated as ever.
Title: Re: Gui lettering
Post by: Oliwerko on Fri 07/09/2007 13:17:37
Try to find an interesting font. I would use white for it. Type "font" into Google and first page that shows up has tons of fonts in it. Personally I would pick "Pan Am" for this GUI, but it's up to you.

I think you are a winner if you just find a good font.


My example:

(http://oliwerko.wz.cz/GUIHELP1.png)

(http://oliwerko.wz.cz/GUIHELP1.png)
Title: Re: Gui lettering
Post by: Stupot on Fri 07/09/2007 14:18:18
Woah.  Great GUI Ben.  Not enough people take the opportunity to play about with the interface (although I love Grundy's Greek style in BJ6).

As for font, I think you can't go wrong with Oli's example.  Suits the style very well for me.  Try to make an inventory window and Quit? box in the same style so you have the complete family.
Title: Re: Gui lettering
Post by: BOYD1981 on Fri 07/09/2007 15:10:39
i'm always playing around with designing GUIs and i've found it's usually much easier and feels better to create my own lettering for smaller buttons, usually keeping each letter the same overall width and height (usually 5x9) as that way everything looks nice if all buttons are the same width.
although that font in the example is okay not every word is the same width despite all three having 4 letters, 'SAVE' looks far too wide for that button.
try experimenting with creating your own uniquely designed letters before deciding on using an existing font.
Title: Re: Gui lettering
Post by: tube on Fri 07/09/2007 15:23:35
Do the buttons really need text? Why not go with simple white icons like you did for the action buttons?

Here's an extremely quick paintover to show what I mean:

(http://img257.imageshack.us/img257/4071/guipq0editti1.png)
Title: Re: Gui lettering
Post by: paolo on Fri 07/09/2007 15:29:06
Quote from: Stupot on Fri 07/09/2007 14:18:18
Not enough people take the opportunity to play about with the interface (although I love Grundy's Greek style in BJ6).

WHAT! Ben Jordan 6 is out!? Whoopee! <hyperventilates with excitement>

Sorry for going off-topic. The GUI looks great. I think the icons definitely work better than the text and have the benefit of being universally understandable and avoiding translation problems should the game have a translation pack.
Title: Re: Gui lettering
Post by: ThreeOhFour on Fri 07/09/2007 18:43:14
Oliwerko and Tube - thanks for your examples, and thanks everyone else for your comments. I think I have got it how I want it now, using Tube's icon example:

(http://img252.imageshack.us/img252/175/guiiconke3.png)

Further crits are always welcome, but this is a mostly finished GUI bar as far as I'm concerned.
Title: Re: Gui lettering
Post by: GarageGothic on Fri 07/09/2007 18:49:02
Looks great. But what does the M mean? If it is indeed the letter M it seems very out of place among the purely visual icons.
Title: Re: Gui lettering
Post by: Mazoliin on Fri 07/09/2007 18:51:12
That's a really beautiful GUI. I hope I'll see it in a game.
On thing I don't know, what's M?

Edit: You're a fast one Garage.
Title: Re: Gui lettering
Post by: Oliwerko on Fri 07/09/2007 18:56:42
Yeah, the icons are better. Just because it's low-res and the text is kinda odd there. I LOVE this GUI, Ben. It's one of the most beautiful I've ever seen, to be honest. I'll play the game definitely.
Title: Re: Gui lettering
Post by: ThreeOhFour on Fri 07/09/2007 19:02:08
You're all very kind.

The letter M is for something.... innovative. A seperate menu, if you will. It will make sense in the game.
Title: Re: Gui lettering
Post by: Stupot on Fri 07/09/2007 20:13:39
I'm intrigued... any more clues?
Title: Re: Gui lettering
Post by: Oliwerko on Fri 07/09/2007 20:22:46
Have patience, it'll be a surprise  :D
Title: Re: Gui lettering
Post by: ThreeOhFour on Fri 07/09/2007 20:26:16
...hopefully you won't need TOO much patience at all....

That's all I'll say for now. I hate announcing things before their time.

[/offtopic]
Title: Re: Gui lettering
Post by: Indie Boy on Fri 07/09/2007 23:07:43
I first thought the M was the button to bring up the map or something. Only crit is that I don't like how the inventory button is circular while all the other buttons are rectangular, although saying that the "?" button looks nice as a circle button.
Title: Re: Gui lettering
Post by: Darth Mandarb on Sat 08/09/2007 00:59:31
Quote from: Ben304 on Fri 07/09/2007 20:26:16That's all I'll say for now. I hate announcing things before their time.

Bless you Ben ... bless you.
Title: Re: Gui lettering
Post by: ThreeOhFour on Sat 08/09/2007 04:40:14
Another question - when I type the letters on with text (in MSPaint) it comes up with all funny colours on the antialiasing. Is there to remove this other than by hand?

example:

(http://img521.imageshack.us/img521/9333/exittestlv7.png)
Title: Re: Gui lettering
Post by: Gilbert on Sat 08/09/2007 06:00:33
Before typing the text, try disabling the antialiasing of fonts in your system.
(right click on desktop and click "effects..." in "Appearance" tab. I'm not using English windows so these may not be the exact names.)
Title: Re: Gui lettering
Post by: ThreeOhFour on Sat 08/09/2007 06:13:39
Gilbot - that works perfectly. Much appreciated dude!
Title: Re: Gui lettering
Post by: Stupot on Sat 08/09/2007 07:06:08
Glad to see you're incorporating the same style through all of the interfaces.  This is gonna be one sexy-ass game.
Title: Re: Gui lettering
Post by: Oliwerko on Sat 08/09/2007 14:02:06
Quote from: Stupot on Sat 08/09/2007 07:06:08This is gonna be one sexy-ass game.

You're right. OOOOoooohhh, I'm hot !  ;D
Title: Re: Gui lettering
Post by: zabnat on Sat 08/09/2007 18:12:53
It seems that you have cleartype antialias on fonts (which is better when you have lcd monitor). If you want antialias on your fonts without the funny colors, you can try switching antialias type to standard (from the same place gilbot said).