Adventure Game Studio

Creative Production => Critics' Lounge => Topic started by: esper on Wed 02/09/2009 18:44:51

Title: game GUI
Post by: esper on Wed 02/09/2009 18:44:51
Hey guys. I'm working on my new super secret project, but I wanted to drop the GUI on you for C&C. Whaddaya think, and what can I do to improve it? The tone of the game is kinda dark, like most of my others, so I'm not sure about the bright colors... the main character has sticky notes all over his office, so I figured it was appropriate. Should I maybe make them all yellow, or perhaps desaturate a bit, to get more of a hollow, darker feel?

Also, I can't think of how to do a matching inventory menu. Any ideas?

(note: the BG is not a screenie of the game, it's a capture from one of my older games. Also note that I made the font from my own handwriting.)

(http://i883.photobucket.com/albums/ac40/esper_ian/gamegui.jpg)
Title: Re: game GUI
Post by: Babar on Wed 02/09/2009 19:04:10
Quote from: esper on Wed 02/09/2009 18:44:51
Should I maybe make them all yellow, or perhaps desaturate a bit, to get more of a hollow, darker feel?
Yes

Quote from: esper on Wed 02/09/2009 18:44:51
Also, I can't think of how to do a matching inventory menu. Any ideas?
An open briefcase, perhaps?
Title: Re: game GUI
Post by: Calin Leafshade on Wed 02/09/2009 19:04:57
I quite like it.

Its quirky but it makes perfect sense.

However i am a little irked by your mixing of resolutions. please dont do that.

The gui however looks fine to me.

the colours could do with a little desaturation though, youre right.
Title: Re: game GUI
Post by: esper on Wed 02/09/2009 19:10:38
don't worry, like i said, i just took a screencap of one of my old games
Title: Re: game GUI
Post by: Dervish on Wed 02/09/2009 19:26:52
I like it althought it might take up a bit of space leaving less room for the background.
also for a darker game I think some desaturation is needed although a creepier kinda game doesn't always have to be darker( I guess it depends on the actual style of the background)

A possible matching inventory could be the inside of the book with maybe a handwritten inventory list or a sketchy drawing of the items
Title: Re: game GUI
Post by: Jim Reed on Wed 02/09/2009 19:33:06
Yeah, it looks fine, but I would curve the sticky note a bit and maybe give it a folded corner.

The paper looks ram-rod straight now.

Edit:
Something like this maybe:
(http://i27.tinypic.com/2hwflvq.png)
Title: Re: game GUI
Post by: esper on Wed 02/09/2009 20:19:02
Okay, here's an update. I took in everything said so far (except to inventory ideas, which I'm still pondering). Also changed the game in the background (this ones not mine, apologies to the brothers Chaps!)... Also was wondering about the hotspot bar... think it seems a bit out of place. I could have made it a post-it hanging from the top, but i dont think i'd be able to get the same font...

(http://i883.photobucket.com/albums/ac40/esper_ian/gamegui2.jpg)

Tell me whatcha think!

edit: oh, and by the way, the gui pops up on mouseover, so it wont take up any playing space (not so with the hotspot banner).
Title: Re: game GUI
Post by: Mr Flibble on Wed 02/09/2009 20:25:47
I like it, the desaturated colours are definitely an improvement. The only thing that catches my eye is the book at the bottom: who opens a book facing away from them?

Also the hotspot name bar at the top, you could make that a piece of paper held in place with a paperclip for a more consistent look. I think your handwriting font would work fine for it.
Title: Re: game GUI
Post by: Wonkyth on Thu 03/09/2009 03:30:41
Handwriting fonts always look great IMO.
Title: Re: game GUI
Post by: Shane 'ProgZmax' Stevens on Thu 03/09/2009 04:45:49
I think it looks good, but like Flibble said, the book opening facing away from the viewer is a bit confusing.  Perhaps you could just change it into a manilla folder or a closed book?  Remember, you don't need to take up the entire bottom of the screen with gui if just a section will do.  In fact, if you have a miniature closed book with those same icons on the left, you could have the usable inventory items floating off to the right.

This is an example of what I'm talking about.  Basically, when you click on the Inv tab it would make the inventory items appear to the right (with arrows if you're going to have more than could appear on screen at one time).  They could have backgrounds like I've done or just appear as they are.

(http://i485.photobucket.com/albums/rr218/ProgZmax/tabguiex.gif)
Title: Re: game GUI
Post by: esper on Thu 03/09/2009 07:52:38
Hmm, that gives me a good idea. Can you animate a gui? I was thinking (I'm at work right now, so I don't have access to photoshop to do a mockup, but bear with me), a file folder with the action tabs on top, and on the right, like you have them there, Progzy, the menu tabs on the right, and when you click on a tab the appropriate "file" gets pulled out.

If that is possible, how would I go about it? I normally try not to ask tech questions (especially in the wrong forum <cough>) but if the manual is slim on any one point, it's GUI's. I had to pull apart the default GUI and study its inner workings to make the GUI for ALPHA-X because the manual doesn't explain GUI coding very well and I couldn't find any tutes on it.
Title: Re: game GUI
Post by: Scarab on Thu 03/09/2009 11:46:21
One thing you could do with the bar is just flip the book so it is facing the player, and then you could do what Dervish was saying, and have the book scroll up to view the inventory.
In fact, you could do that with all the GUIs, with the pages just flipping. I do like the whole post-it notes thing though.

What I thought when I first saw the Post-It GUI though was that the boxes for the Yes and No buttons seemed too stright and 'boxy' for the handwriting font. IMO it would add to the feel if the boxes around them looked like they had been drawn on.

Furthermore, on the hotspot banner, perhaps it would look more out of the way if it were in the corner than where it is now?

Anyway, great work so far.

Peace 8)
Scarab
Title: Re: game GUI
Post by: Wonkyth on Thu 03/09/2009 13:31:08
Perhaps the boxes around the Yes and No buttons could be replaced with a simple underlining.
The underline has to be the most used thing on any post-it.
Title: Re: game GUI
Post by: Shane 'ProgZmax' Stevens on Thu 03/09/2009 17:00:13
Yeah, you could do that, but it would involve having one (or more) gui's which are normally off just to the right of the book so when you click on a tab the gui would turn on, play the open animation by having a big invisible button (this is part of the book gui, just off to the right where the folders appear) and you'd do Button.Animate to make the folder slide out.  Once that's done (based on the current file) you'll have a SECOND GUI open on top of the folder (higher z-order will make this work) that has all the information/functionality you need.

Hopefully that makes some sense!
Title: Re: game GUI
Post by: esper on Thu 03/09/2009 22:19:09
I'll give it a try. I have a big D&D-a-thon in Frisco today, but when I get back I'll work something up and post it. Thanks everybody for the input, and Progzy for the info.
Title: Re: game GUI
Post by: esper on Tue 08/09/2009 16:19:45
Bam!

(http://i883.photobucket.com/albums/ac40/esper_ian/gameguicopy.jpg)

How's this look?

EDIT: if you can discern what the book is, you might have some kind of a clue as to what the game is going to be.
Title: Re: game GUI
Post by: Anian on Tue 08/09/2009 16:53:42
First of all - it looks waaay better now. Looks much darker and less cartoonish.

Maybe that quit menu needs a bit more of roughing up, but kinda hard to say without seeing what the graphics in the actual game are gonna be.
The font is a kinda hard to read, but it's not too bad, gives it more character. Also the main menu (the open book) has a bit of a wrong perspective (the covers and the actual pages) though it's not that noticable really.
Don't know if there's a need for 3 places to say "inventory"...not that that is important, but maybe move the post it from the book when the actual inventory is open...just an idea.
Title: Re: game GUI
Post by: ShiverMeSideways on Tue 08/09/2009 22:28:25
Yeah, Esper, that's the stuff I want to see in a dark-themed game. I agree with anian that having Inventory thrown in your face three times is a tad much. I think you should take out that post it at the top of the new window and maybe you could take out "INVENTORY" from the window as well. When I click the inventory button, I know what I'm getting ;).

Also, the hotspot bar now seems better integrated, but it still seems a bit strange... I can't put my finger on why or how, though...

I also agree with anian that after he pointed it out, the book does look strange, maybe move the pages downwards a bit more?

Just some thoughts, good look with your game! ;)
Title: Re: game GUI
Post by: Shane 'ProgZmax' Stevens on Tue 08/09/2009 23:23:02
Turned out rather similar to the original but I like it.  I agree that displaying inventory 3 times is a bit much.  When people click on the inventory button and see a list I'm sure they'll understand what it is they're looking at :).
Title: Re: game GUI
Post by: Akatosh on Tue 08/09/2009 23:25:20
The pages seem to sort of bend outward, but apart from that, the GUI looks pretty nice to me.
Title: Re: game GUI
Post by: esper on Wed 09/09/2009 11:01:49
(http://i883.photobucket.com/albums/ac40/esper_ian/gameguicopy-1.jpg)

Yeah, I decided not to go with the file folder. I just couldn't get it to look right. Besides, there's a reason it was a book in the first place.
Title: Re: game GUI
Post by: zabnat on Wed 09/09/2009 15:49:05
Maybe you should just redraw the book rather than just rearrange the layers that contained the cover and pages? It actually doesn't really look like a book anymore. Main things to fix would be the book cover, especially the spine. Other thing would be how the pages bend in the middle.
Title: Re: game GUI
Post by: Brad Newsom on Mon 14/09/2009 11:23:51
I like where this is heading, but like zabnat said, I think it would be best to start over. A lot of what you did still looks messy and out of place.

What direction are you looking for? Realistic? Cartoon? Painting-like? Horror?
Title: Re: game GUI
Post by: TerranRich on Mon 14/09/2009 23:42:48
Quote from: Jim Reed on Wed 02/09/2009 19:33:06
Yeah, it looks fine, but I would curve the sticky note a bit and maybe give it a folded corner.

The paper looks ram-rod straight now.

Edit:
Something like this maybe:
(http://i27.tinypic.com/2hwflvq.png)

Any reason why you're not going with the suggestion above? It's definitely something that's worth looking into. It's almost painful to see the "sticky" note the way you have it now.