AGS Awards Ceremony client - GUI

Started by Kastchey, Fri 23/02/2018 20:30:33

Previous topic - Next topic

Kastchey

Hi Critics' Lounge!

I am trying to come up with a nicer GUI for AGS Awards client to match the beautiful background by Ali at least somewhat better, and have started with the below.

What I aim for is a GUI with a hue similar to the warm reddish tone of the background image, just slightly brighter to make the buttons stand out better (not sure if this is the right approach though, or if I'd be better off with the exact colour balance from the background).

I originally made the gold set, then upon Danvzare's suggestion I tried a blue version with a hue picked up from the blue cup in the background.
The third version with uncropped icons is a variation of the first one.

Which version fits best? Or if anyone is able to offer an alternative suggestion, please go ahead.

Edit:
Here are the reworked sets:-

1.

2.

3.

4.

Previous versions:
https://s17.postimg.org/kd7m1icgv/buttons_gold.png
https://s17.postimg.org/427i56s9b/buttons_blue.png
https://s17.postimg.org/9dmepwtrj/buttons_icons.png
https://s17.postimg.org/xk68s8rzz/buttons_icons_blue.png

Cassiebsg

Ohhh
I like all of them! (nod) (laugh)

But I specially like the uncropped one! I like how the icons burst out of their "cages"... :-D
About the colore gold/blue... well the first one stands out more, the second is more discrete. Do we want them to pop out of be quietly on the BG?

Maybe a 4th version with the uncut icons and the blue BG? ;)
There are those who believe that life here began out there...

Kastchey

Sure Cassie, why not? Original post now updated :)

Tabata

Well done! I like all of the variations, too. (nod)

About alternative suggestions you asked for:
How about the background of those icons in the first variation version (the third you showed) with the symbols popping out in one (or two) of those blue shades you used in the second version?

dactylopus

I like the color balance of the first 2, but I like the way the icons come out of the boxes on the next 2.

cat


SinSin

Yes the bootom two are styled nicer but the above two are coloured better. White is too much.
Currently working on a project!

Cassiebsg

Also, we can use both the blue and the gold... just use the first for normal state, and the gold for hover/pushed. ;)
There are those who believe that life here began out there...

Kastchey

Thanks a lot guys for all your feedback and suggestions, very much appreciated! It seems the blue/silver version is preferred by just about everyone which makes things a lot easier.
I will try mixing the general layout of the bottom versions with the colours from the top versions as suggested and get back to you for more feedback.

Thanks again!

Danvzare

Everyone has already said everything that I want to say. But I'm going to echo it anyway.
I like the way the bottom two pop out, but I prefer the colours of the top two. And like Cassie, I think having blue for the default, and gold for when you're hovering over it would look fantastic.

Kastchey

Every vote counts Dan! It's even better if I get consistent feedback from everyone, it just makes me more confident this is the step in the right direction.

The main post is now updated with the reworked set of buttons. I think I have covered all the suggestions (poke me if I missed something, though)... thanks everyone!
The uncropped versions and the high contrast are definitely going away, and I suppose we will pick something for the default and the highlighted (when hovering over) version out of these four.

Further comments and suggestions always appreciated :)

Cassiebsg

Nice work :)

I would go with 3 (default) and 1 (highlight/pushed). Hands down as my favorites.  :-D
I could go with 3 and 2, but really don't like 4.
There are those who believe that life here began out there...

dactylopus

I would choose the following:

3 - Default
1 - Hover
2 - Selected / Pushed

You could swap the Hover & Selected and it would still work nicely.

If I had to choose just one, I'd choose #2.

Gurok

When you decide on a look, can you also share the backing plate and a few guidelines so that in a few years, should we need another button, we can create one?
[img]http://7d4iqnx.gif;rWRLUuw.gi

cat

They look awesome and really fit the background. I like #2 best.

I'd choose
3 - default
2 - hover
1 - selected/push

Kastchey

Thanks again for the opinions guys, it seems that version 3 is everyone's favourite so let's go ahead with this one as the base. We'll see if the highlighted variants are even needed as the buttons will fade out until hovered over.

Gurok, that's an excellent suggestion. I'll put the base empty button and a short step by step guide somewhere once done with the work.

Danvzare

#2 is sooooooo pretty. 8-0

But I'd have to agree with everyone else about #3 being default, #2 being hover, and #1 being for those that are pushed.
Simply because I can't imagine a pushed variant of #2 looking anywhere near as good as it would going from #3 to #1. (Unfortunately that means that #2 probably won't be implemented due to the buttons disappearing when you're not hovering over them, but I'm ok with that.)

Snarky

If it's not a big problem for Kastchey to make the different variations, I think there'll definitely be a place for both mouseover and normal versions. There will be cases where buttons are visible even when not specifically hovered over.

Kastchey

Not a problem at all, all it would take is a few clicks to swap the layers :)

SMF spam blocked by CleanTalk