Page 1 of 1

(somewhat) New GUI [in 2.4]

PostPosted: 08 Jun 2014, 11:50
by CryHam
Okay, in last poll, there were many votes for:
- User interface (more user friendly, less clutter but more windows)
I didn't expect so many, but that's just me, I'm perfectly fine with the current GUI.
I assume this goes only for game, not at all for editor right.

I get more or less the idea, but - it's up to you to drive the change here.

I expect simple drawings (concepts) with GUI windows.
So, draw few rectangles, put text inside, maybe some arrows what goes where after clicking on each screen, etc.
You can also make screens from current GUI and cut fragments, move them around to form new GUI.

Post them here and we can discuss. Once we know where to put all things from current GUI in the new GUI layout, I can start and implement it.
I'm seeing few troubles with Track, Car tabs, they have lots of info, I got no idea how to make them different (probably divide that to sub pages ?), it's up to you.

Re: New GUI ...

PostPosted: 11 Jun 2014, 22:23
by Wuzzy
My main issue with the GUI is the translatability and we already discussed this.
However, there are other issues as well.

The main problems with the car and track tabs are the tables. Most stuff simply does not fit into the columns. :/

But I think all the size issues come from the fact that the entire menu is in a window with fixed size. It does not even help if you use a large resolution, because the window size ignores it. :/
Make the window resizeable or use the full screen (or maybe almost full …). Probably a lot of problems, including the translation problems, would become solvable.

Here is a more concrete thing about the “game” tab, one thing which annoyed me a little:
  • Move the “damages” drop-down menu to the “damages” tab, not into “general”.
  • Move the “boost” drop-down menu to the “boost” tab.
It makes more sense that way, I think.

And heres a suggestion for the loading screen:
Image
To the bottom, you see the usual loading bar.
But the main difference is that the rest of the screen is used for useful information about the track.
The graphic should be self-explanationary, but it is a bit vague on the exact positions.

As background a large screenshot of the track could be shown, if one is available. If no large screenshot is available, maybe a cropped version of the preview image is used instead. Too bad it’s a square. If everything else fails, SR can just show a random image as usual. But this may cause confusion, so maybe SR just uses a single color as background as an “escape hatch”. ;)

In the middle a large map of the track is shown. Now it may be actually useful that they are stored in a rather large image(s). :)
To the left, some basic facts about the track are shown. Importantly, the name of the track is written in a large font. If one is playing a challenge, one does not neccessarily know which track comes now.

To the right, some facts about the player’s performance are shown, basically times and best score.
If the track is played as part of a challenge or championship, show some infos about it. Most importantly, the “passing grade” for it. If the track is just played as a single race, this part is omitted.

The user can set a setting which forces SR to keep the screen until user response.

I want also to stress that the font color may be important. If you are showing a background image, the text may be unreadable for some colors. This problem could be solved by drawing a (semi-)transparent rectangle below it, just like for the loading bar.

This suggestion is a bit rough on many parts, I admit. It is more about the basic idea here.

Re: New GUI ...

PostPosted: 12 Jun 2014, 13:51
by dimproject
I want indicators for car select.

Indicators.jpg

Re: New GUI ...

PostPosted: 12 Jun 2014, 19:29
by CryHam
Right. Those are good remarks and ideas.
I want even more. I was actually hoping you would draw the whole GUI.

So first of my ideas is the main menu like so:
[Game]
[Replays]
[Help]
[Options]

and the new [Game] would open then
[single race]
[tutorial]
[champs]
[challs]
and later maybe [career] or others.

Maybe we should separate somewhere the simulation mode (will have later Hard also and Hover, so 4 total)
so it's in the style of main menu, idk.

Next thing, I'm thinking of splitting Track and Car tabs.
So some parts will be accessed with < and > arrows or maybe some floating windows, similar to that from loading screen.

Re: New GUI ...

PostPosted: 12 Jun 2014, 19:35
by CryHam
Also another thing is the uber first start menu or just global main menu on side idk.
Which shall have the common and most usefull things there. Like sim mode, screen settings, input remap, etc (all that would be buttons to open the right tab in gui).
I don't clearly see it so any ideas or drawings for that would help too.

Re: New GUI ...

PostPosted: 12 Jun 2014, 19:45
by CryHam
About sizing. Edit: already fixed.
This is some big issue with MyGui. It's not even supported. There is code we use to do it.
And fonts are not sized. This is imo the worst thing. I should maybe try with some code and use some defined different sizes, idk.
If you use 800x600 evth is still visible, but horribly cluttered, still functional, and that the min working size. All we do should actually work with that right. And if you use 1920x1200 and stretch to whole screen evth just looks like in space.

This is why i was actually thinking of splitting stuff and making some <, > arrows or even a menu like in VDrift, similar is also in RBR but you can navigate with arrows, enter, backspace/esc. I don't like such style bcos you need to press enter 5 times until you actually start driving.
But yeah its clearer since you see only few menu texts or options.

Re: New GUI ...

PostPosted: 14 Jun 2014, 18:44
by CryHam
Also I think in main menu on some after [Game] there should be
[Split screen] and
[Multiplayer]
don't you think ?
So its easier to find and more visible.

Re: New GUI ...

PostPosted: 04 Jul 2014, 10:08
by CryHam
Ugh yeah, looks like nobody wants to remake the whole Gui, but that's ok, maybe the current one isn't that bad.
------
So, on master we have now resized fonts.
Gui fonts are now bigger for high screen res and smaller for low (works after restart atm idk why).
And I made the windows bigger (less empty margin) for high screen res (height 768 and below didnt change).
This generally made the Gui scale better.

{l Code}: {l Select All Code}
If somebody builds from sources and wants to tinker with it, params are in
 source/ogre/common/GuiCom_Util.cpp, in CGuiCom::CreateFonts() marked with // par
and for window size margin with screen res in
 source/ogre/common/GuiCom_Screen.cpp, float CGuiCom::GetGuiMargin()

Sadly, now all long texts overflow/cut, have to be rechecked. I did that quickly.
There seem to be strings that are long in few languages. Mainly on View tab.
I think that's an issue with Gui and placing them, probably should be in single line, not next to sliders, right ?

-----
To answer what Wuzzy said:
- Fullscreen, I'm not for it, moving window is sometimes useful, also window is smaller, shows track in behind etc.

- I'm fully against this: Changing gui mechanics (like in Vdrift etc) with an in game menu with "leave game" that goes back to gui. Why? Well, some time is spend in Gui, and that currently shows track behind. If we change this we'll have only that (quickly boring) background image or car garage like in Vdrift.

- Apropo loading screen. Hmm. It's a cool idea but: 1. preview images are square, 2. loading screens are random and that's a great thing because it shows (nearly) all game sceneries. 3. If you e.g. start 1 track few times in a row, it will be really boring/frustrating (to see the same loading screen and info). 4. Generally all that info you can see right now in track tab or on challenge, stages tabs etc. 5. I don't want to code it to just check if I'm right.

- Game tab general. That is how it's supposed to be. On 1st, general tab you have 4 combos with most used options. If you want to tinker with their params (which most users won't I guess) you have other tabs. Changing tabs just to change boost type is too much trouble.

- Car tab bars/indicators. I'm for it but: mass is better low (so bar would go inversed), power/torque are just matched to the times and I'm not very keen with real values, so I wouldn't rely on those at all. What actually matters more is bhp/ton (power/mass) ratio which isn't shown, but is in car test window, maybe it'd be better to also have it, idk is already crowded there.
I want to show a car acceleration graph here (car velocity with time). That will showcase those 3 time values (0 to x kmh). Is also hard to find a good place for it on car tab.

Nobody commented on the split of [Game] in main menu. I guess this will happen anyway if any more game mode appears (like career or collection) or even if we separate split screen and multiplayer to new entires (would need some hiding and reusing of current gui parts).

I talked on irc with Evropi, maybe he'll do sth, he has lots of good ideas, I just don't yet see this, would be better to attach some preview images of those.

Re: (Not that) New GUI ...

PostPosted: 13 Jul 2014, 15:29
by CryHam
Meh, dead topic, no response. Anyways:

Car tab had a renew, has now bars, some more info.
All text there is translatable. Not sure if we need all bars. Added some colors.
Also IDK what to do, if to inverse bars, since half of values are better less not high and bars are now misleading, have to know which ones.

Preview:
http://i.imgur.com/JMn0WXk.jpg

Re: (Not that) New GUI ...

PostPosted: 15 Jul 2014, 21:13
by Wuzzy
That last screenshot looks much better than the old car tab. Nice work. :)

Re: (Not that) New GUI ...

PostPosted: 16 Jul 2014, 09:56
by CryHam
Thanks.
Currently looks so:
http://imgur.com/bUPbeNm
I think it's final. I made the short (default) and detailed views for car list.
And speed is now a float not int, thus much better sorting.

Re: (Not that) New GUI ...

PostPosted: 16 Jul 2014, 11:06
by krash
The bars look really nice!

Re: (Not that) New GUI ...

PostPosted: 17 Jul 2014, 23:09
by CryHam
And finally after years of suffering and editing RGB color by digits we have now
a color window with HSV sliders. Man it should be done long ago.

http://imgur.com/VMaseUP

Legend, from code:
// hue,sat 0..1 a = anything
// val 0..a over 1 are additive, eg. bright desert
// alpha 0..a over 1 are additive, for light fog
// neg 0..a gives negative offset, for darkening, antilight

val above 1 happens on deserts and on some tracks with bright sun.
alpha over 1 is rare, X4
neg not 0 is only used on Y1

Re: (slightly) New GUI ...

PostPosted: 19 Jul 2014, 23:44
by CryHam
So we have now this car speed graph in Gui.
It shows car's acceleration, speed (y axis) vs time (on x axis).
IDK where to put it as usual.
Either a small one here:
http://i.imgur.com/vmKRhqB.jpg
or maybe a big one in background
http://i.imgur.com/sJFmPTo.jpg
Any ideas ?
Should probably have few grid lines at least right?
Generally gives more info about vehicle's speed than those 3 values "time from 0 to 100/160/200".
But needs to be big to catch the differences between similar cars.

Re: (slightly) New GUI ...

PostPosted: 20 Jul 2014, 08:31
by dimproject
How about this?
SpeedGraph.jpg

Re: (slightly) New GUI ...

PostPosted: 20 Jul 2014, 08:49
by CryHam
Right. Good idea.

Re: (slightly) New GUI ...

PostPosted: 20 Jul 2014, 15:01
by CryHam

Re: (somewhat) New GUI ...

PostPosted: 26 Jul 2014, 10:31
by CryHam
We have now a "first run" / "welcome" screen with hints (in game).
Looks so:
http://i.imgur.com/jaRlksI.jpg

It's generally meant for new users, and kids, and other people that
still didn't realize the backspace key or press throttle all the time etc.