The new UI

The new UI

WolfeGames and projects headed by Argh.

Moderators: Moderators, Content Developer

User avatar
Argh
Posts: 10920
Joined: 21 Feb 2005, 03:38

The new UI

Post by Argh » 23 Feb 2010, 12:57

Here's a screen of the new UI, at 1600/1200.
Image
Attachments
screen00018.jpg
(466.41 KiB) Downloaded 5 times
0 x

Regret
Posts: 2086
Joined: 18 Aug 2007, 19:04

Re: The new UI

Post by Regret » 23 Feb 2010, 13:56

The bright cyan / yellow color of resource bars doesn't fit the picture at all.

Also the blue space between arrows bottom right is asking to be filled with surrounding color. Preferably whole background of the ordermenu could match the button texture to prevent odd blue tint on edges.

The order icons don't match in style and are too complicated to figure out what they do at first glance.

Also player will have to run around with mouse from one side to the other, from minimap to buildmenu.
0 x

User avatar
Neddie
Community Lead
Posts: 9406
Joined: 10 Apr 2006, 05:05

Re: The new UI

Post by Neddie » 23 Feb 2010, 14:05

The design itself is problematic, it looks like you have fixed position boxes tossed in with no attention to how they look together and what the overall construction of the UI does. The space between elements is varied, the UI causes visual discontinuity when it should recreate a symmetrical base for the game screen.
0 x

User avatar
Argh
Posts: 10920
Joined: 21 Feb 2005, 03:38

Re: The new UI

Post by Argh » 23 Feb 2010, 14:51

The bright cyan / yellow color of resource bars doesn't fit the picture at all.
The cyan / yellow is consistently used through the whole game to signal what type of resource you're making. That's important information- but maybe a different color choice for the background would be an improvement.
Also the blue space between arrows bottom right is asking to be filled with surrounding color. Preferably whole background of the ordermenu could match the button texture to prevent odd blue tint on edges.
The "odd blue tint" because that area, like the rest of the menus, is transparent. I figured people would like it that most of the screen's visible when you don't have anything selected, and if you move the radar screen somewhere else, that area's also transparent.
The order icons don't match in style and are too complicated to figure out what they do at first glance.
While I'll provisionally agree that the styles don't always match, that was kinda the point. The 'gear' icon, for example, is supposed to stand out, because it means the unit has a special power of some kind, for example. I wanted it to immediately stick out, because playtests with total newbs showed me right away that people couldn't figure out the special powers unless it was really obvious a unit had them. I've thought about building a training mission number two, just to teach about how to use them, tbh, but I decided, after playing through Warcraft III's full campaign, that if Blizzard thinks we're all going to use stuff and mouse-over it to read about what it does, if we see random icons, then I should probably expect players to do so as well.
Also player will have to run around with mouse from one side to the other, from minimap to buildmenu.
How often does that actually happen? Most newbies aren't giving orders primarily through the minimap; most experts use hotkeys. Seems like a non-problem tbh. DoW has this arrangement, so did StarCraft, so did... meh, whatever.

All that said... I forgot to add the idle builders / factories / hero /group-cycle stuff (the code's done, I just need to add the buttons back in), and I can probably center the console and shrink the tooltip area to allow the radar to be larger, and make it that much more balanced-feeling. I'll get that done. Should make it feel less lopsided, if nothing else, but I'm concerned about what it's going to require in terms of text sizes- I can't let them get very small or it's unreadable garbage at lower resolutions.
0 x

User avatar
Pxtl
Posts: 6112
Joined: 23 Oct 2004, 01:43

Re: The new UI

Post by Pxtl » 23 Feb 2010, 14:57

Stylistically, the elements all look very good, but the metaphor is confusing - the blue stuff with the scanlines looks like it's supposed to be a transparent computer display, but it's got that strong bevel that breaks the metaphor. That metaphor gets even more confused in the button-panel, where you have hardware on the bluescreen...what? Hardware-buttons in a screen?

It looks like it's supposed to be a stretched, 2d transparent display held up by the brown outline... then why would it have a bevel?

I mean, look at the resource bar panel - you've got screws on it. It's obviously intended to look like a real-world panel... and then look at the chat box. It's obviously meant to look like a screen (brown, hard, dirty outline with clean, crisp display screen inside).

Now look at the button panel - a blue screen with brown hardware inside it? wtf?

My quick solutions to these problems would be
1) If any panel gets a bevel on the screens, it's the resource-bar panel. Those little black displays aren't transparent like the blue ones, so they can have little bevels. Remove the bevels from the blue stuff. Maybe put a little inner-glow effect to make them look holographic or something.

2) Bring the styling from the resource-bars onto the button-panel - brown background and a little black display-box for the page number... why the hell is the page number glowing anyways? And feel free to add some screws. I'm disappointed though - I would think that the resistance would at least use Robertsons, if not hex screws - standard/blade screws? Seriously? The far-flung future and we're still using standard screws?

(j/k about the screws).
0 x

User avatar
Argh
Posts: 10920
Joined: 21 Feb 2005, 03:38

Re: The new UI

Post by Argh » 23 Feb 2010, 15:13

LOL about the screws. I'll, um, make 'em hex-heads or something.

I agree about the buttons, the old solid background looked better. However, there's an issue with the "metaphor"- to make it truly work right, there would have to be "buttons" there at all times, styled all the same, and the only thing that would change (from the end-user's perspective) would be the "icons"- like those keyboards where you can use graphics for the keys.

It's doable, it'd look cool... but I'd have to redo one hell of a lot of buttons, and I'm not sure I'm up for that. Maybe a generic suggestion-of-buttons with a beveled shape of the right size might work...
0 x

User avatar
Pxtl
Posts: 6112
Joined: 23 Oct 2004, 01:43

Re: The new UI

Post by Pxtl » 23 Feb 2010, 15:16

That's why I thought the simplest fix would be just to change the background of the button-panel to be solid. I mean, yes, the fact that the buttons change kinda breaks that, but it makes more sense than the buttons being metal buttons embedded into a transparent 2D screen.
0 x

User avatar
SirArtturi
Posts: 1164
Joined: 23 Jan 2008, 18:29

Re: The new UI

Post by SirArtturi » 23 Feb 2010, 15:17

I like it overall, but I would go rather more consistent layout/arrangement. Maybe "L" shape would work better. Now the layout feels a bit distorted and troubled. The blue colored transparency doesnt fit in the theme neither. Id go with grey or metallic...
0 x

User avatar
Beherith
Moderator
Posts: 4934
Joined: 26 Oct 2007, 16:21

Re: The new UI

Post by Beherith » 23 Feb 2010, 15:26

How bout making a fixed grid of buttons, each with a display on them? When there is no command for the button, it displays the blank scanlined image.
0 x

User avatar
Argh
Posts: 10920
Joined: 21 Feb 2005, 03:38

Re: The new UI

Post by Argh » 23 Feb 2010, 19:42

OK, here it is after listening to people's feedback. Other than fussing with the graphics a bit more, it's pretty much done. I forgot what a massive pain in the arse lining up the buttons was- getting it to precisely match the grid was very much not something I'm going to ever want to do again.

But the final result's visually balanced, there aren't any weird "screen" areas that don't make sense in context, etc. "Idle things" buttons show up in context, so you can't see them here, but basically they are things you can click to check everything that's idle, like most commercial RTS games have.

Image
Attachments
screen00019.jpg
(326.22 KiB) Downloaded 3 times
0 x

User avatar
aegis
Posts: 2456
Joined: 11 Jul 2007, 17:47

Re: The new UI

Post by aegis » 23 Feb 2010, 19:43

tooltip and console feel backwards
0 x

User avatar
Neddie
Community Lead
Posts: 9406
Joined: 10 Apr 2006, 05:05

Re: The new UI

Post by Neddie » 23 Feb 2010, 19:45

Now you have a symmetrical base but it still has a lot of random pockets. Swap tooltip and chat, stretch chat to fill fully. Those little holes are pointless.
0 x

User avatar
Pxtl
Posts: 6112
Joined: 23 Oct 2004, 01:43

Re: The new UI

Post by Pxtl » 23 Feb 2010, 19:53

Obviously other guys have opinions about the composition, but I do think you've fixed the problems with the appearance of the elements themselves. Looks good to me. There's always going to be room for improvement, but I'd probably roll with that until you find out what problems it has (I'm imagining that tiny chatbox is going to suck for multiplayer).
0 x

User avatar
zwzsg
Kernel Panic Co-Developer
Posts: 7017
Joined: 16 Nov 2004, 13:08

Re: The new UI

Post by zwzsg » 23 Feb 2010, 19:54

I would prefer to have UI spread on all four sides than all clumped in the bottom. But maybe it's a personal thing?

Anyway, chat is too small.

Can we drag'n'drop'resize all those elements by the tip of your mouse, or is it all static?
0 x

User avatar
Argh
Posts: 10920
Joined: 21 Feb 2005, 03:38

Re: The new UI

Post by Argh » 23 Feb 2010, 20:08

If the tooltip went down where the console is, it'd be impossible to have long descriptions, and it's a lot more important than the console most of the time, especially for nubs who can't be arsed to read manuals.

However, the console's non-negotiable- there are just too many reasons to have it, starting with messages that have to get delivered that way to error messages that tell the end-user that something went wrong.

That said... how's about a chat-only (i.e., player messages ONLY) box on one side, tooltips on the other, across that space, at the current height? Console doesn't need a lot of room, and chat ~= console, I can auto-detect what's what (and am already doing that in that screenshot). That will fill the "pockets" and add some functionality, without taking anything away- I'll have to move some other crap, but it's not a big deal.
0 x

User avatar
Beherith
Moderator
Posts: 4934
Joined: 26 Oct 2007, 16:21

Re: The new UI

Post by Beherith » 23 Feb 2010, 20:11

I agree with what neddie said, but on the whole, its a major improvement!

I especially like the buttons, with great placeholders for empty ones :)
0 x

User avatar
SirArtturi
Posts: 1164
Joined: 23 Jan 2008, 18:29

Re: The new UI

Post by SirArtturi » 23 Feb 2010, 20:17

It's better. The options feel a bit lonely up there though... :) Maybe place them along other stuff and make just somekinda ornamental/visual borders to the whole screen view?
0 x

User avatar
Argh
Posts: 10920
Joined: 21 Feb 2005, 03:38

Re: The new UI

Post by Argh » 23 Feb 2010, 20:30

Eh, I wouldn't worry about the options atm. That's likely to go bye-bye whenever I get done with top menu and dispense with hotkeys for saving, loading, starting a campaign mission, etc.
0 x

Satirik
Lobby Developer
Posts: 1688
Joined: 16 Mar 2007, 18:27

Re: The new UI

Post by Satirik » 23 Feb 2010, 21:07

aegis wrote:tooltip and console feel backwards
0 x

User avatar
Argh
Posts: 10920
Joined: 21 Feb 2005, 03:38

Re: The new UI

Post by Argh » 23 Feb 2010, 22:46

OK, chat's been moved up where it can be its own thing, separate from console spam. That gets rid of the "pockets", lets people use slightly-longer sentences (not that you'll want to, the gesture system is more useful imo) and other than graphical cleanup / visual polish, that's going to be final round of changes for this version. Thanks for your feedback everybody.

Image
Attachments
screen00020.jpg
(323.74 KiB) Downloaded 3 times
0 x

Locked

Return to “Argh's Projects”