GUI Design

[bayo]

I never really understand what "vector graphics" mean. Any example?
md2 models for buttons? generating right sprite size from svg before opengl rendering?

[BTAxis]

In that case we should make the GUI in a high resolution, because upscaling doesn't look so great.

[BTAxis]

I never really understand what "vector graphics" mean. Any example?
md2 models for buttons? generating right sprite size from svg before opengl rendering?

Vector graphics are graphics that exist as vectors, and that get rendered at runtime. This means that no matter how you scale or deform them, they will always look smooth.

[Destructavator]

I agree that vector graphics would look good in this case - Some people still have smaller 1024x768 monitors that they would play the game on, others like myself have the newer, big 1920x1080 deal or such.

Given that there's a number of ways the GUI could be re-designed, I think we need to be clear on how the new design should really work first, and then I could work on putting it together.

- Do we use vector-based graphics?  (I'd recommend "yes" as I think it would work much better.  On my big screen, yes, up-scaled graphics DO look "clunky.")

- Do we go for a "solid" GUI like the one we have now, or something translucent, like the glowing HUD-type deal I was talking about?

- Should we have individual buttons for each soldier?  (I personally favor "yes" here.)

- For icons (For example, showing crouching vs. standing, and others) should we use pics made from renders of actual models used in the game, which are then altered post-process to be made into a button?  (Duo-tone would look cool, wire-frame render in monochrome might also work.)

- How much of the GUI should be drawn from graphics files vs. generated by code?

[BTAxis]

Okay, let's see.

- Do we use vector-based graphics?  (I'd recommend "yes" as I think it would work much better.  On my big screen, yes, up-scaled graphics DO look "clunky.")

I'd like that. I don't agree with mattn that we "don't need it", but even if no support is forthcoming then a vector-graphic design can be rendered at any resolution, so the sources could be vector-graphic based in any event.

- Do we go for a "solid" GUI like the one we have now, or something translucent, like the glowing HUD-type deal I was talking about?

That's a matter of preference, I suppose. Some translucency wouldn't be bad, in my opinion.

- Should we have individual buttons for each soldier?  (I personally favor "yes" here.)

I suppose so, but only the buttons for soldiers that actually participate in the mission, so the amount of buttons should vary from mission to mission (but they should still look good in all cases). Buttons for dead soldiers probably shouldn't disappear, though.

- For icons (For example, showing crouching vs. standing, and others) should we use pics made from renders of actual models used in the game, which are then altered post-process to be made into a button?  (Duo-tone would look cool, wire-frame render in monochrome might also work.)

Don't know, but doesn't sound like a bad idea.

- How much of the GUI should be drawn from graphics files vs. generated by code?

All text should be generated by the code (to allow for translations). The rest can be done with graphics.

[bayo]

Vector graphics are graphics that exist as vectors, and that get rendered at runtime. This means that no matter how you scale or deform them, they will always look smooth.

Use bigger texture that what you need, and you will have the same result, you dont need any vector description. Anyway no body will display and icon in 400x400.

[Marte]

thanks bayo!

You really dont need to spend 1 hour to said that. A simple mockup with box take, at worst, 5 minutes.
That's half wrong. The gameplay itself need a lot of user interface for managment, then the GUI is a very important part of the game, and need a lot of work. It is not an "arcade" game. We can improve a lot the current 2.3-dev, cause there is a lot of problems. For example, the geoscape itself have some problems (but it is a very simple interface).
1/3 of the code is script inside /base/ufos/ui/, 1/3 is UI lib inside /src/client/menu, and 1/3 is a "binding" code script<->game inside /src/**/*_callback.c. You can found documentation about scripts in http://ufoai.ninex.info/wiki/index.php/Category:GUIs.

Sure you dont need to compile anything when you only edit scripts.

So for example is possible to move a menu from right to left without compile? Great news, I'll try!

"next soldier" can be a nice shortcut, but i dont think it must be the only way.
I think we often want to select a soldier we know (cause we know he use rockets, cause we know he'v got the only medikit...)
We can create the real number of buttons it is need, there is no problem.

a cool idea could be to generate soldiers button and have different kind of icons according to type of soldier ?
For example one equipped with rocket have different icon from one with plasma pistol?

[Destructavator]

a cool idea could be to generate soldiers button and have different kind of icons according to type of soldier ?
For example one equipped with rocket have different icon from one with plasma pistol?

I got almost the same idea, different stand/crouch toggle icons for different armors and such.

I've found that loading soldier poses in Blender and applying post-process FX can make all kinds of interesting pictures, some that might make a good icon.

This is just one example.  With some blurring and outline enhancements, it could be turned into a "crouch" command icon (perhaps with some arrows added as well).

[geever]

a cool idea could be to generate soldiers button and have different kind of icons according to type of soldier ?
For example one equipped with rocket have different icon from one with plasma pistol?

Maybe cool but useless. It won't add much to the gui and ofc. nothing to the gameplay but eat resources.

-geever

[Winter]

Maybe cool but useless. It won't add much to the gui and ofc. nothing to the gameplay but eat resources.

-geever

I have to concur on this one, it's pointless frippery and would be detrimental to the user experience. What we really need is a clean, well-designed UI, and it ought to be a priority because the UI affects every area of player interaction with the game, all the time. That means clear and easily-identified buttons (not constantly-changing ones -- how horribly disorienting that would be, especially for new players!) with reliable tooltips and consistent effects. That's what we should be working on.

Regards,
Ryan

[zapkitty]

re: number of "soldier" buttons... how about a GUI where you have "next soldier", "current soldier" and "previous soldier" buttons etc and an additional button that will tab out an array that shows a button for every soldier? Select a soldier and the array goes away and your selection becomes the "current soldier." button.

That way the battlescape GUI is the same from battle to battle but you will have a button array that slides out *on demand* that shows all of the assets that you have in any given battle... and only the assets that are available for that specific battle.

Add the ability to assign custom hotkeys on the fly for your special units and I think you'd have it covered.

Edited for clarity...

[geever]

I have to concur on this one, it's pointless frippery and would be detrimental to the user experience. What we really need is a clean, well-designed UI, and it ought to be a priority because the UI affects every area of player interaction with the game, all the time. That means clear and easily-identified buttons (not constantly-changing ones -- how horribly disorienting that would be, especially for new players!) with reliable tooltips and consistent effects. That's what we should be working on.

Read his comment again, please. It would be the "constantly-changing one"! (Soldier drops rocket launcher ~> icon change; pick up a pistol ~> icon change...)

-geever

[BTAxis]

I don't think you read HIS post properly. He wasn't talking about changing icons, only about having exactly as many buttons as there are soldiers. Which is a good thing.

[Marte]

I agree with simplicity, consistent Gui

So.. where we start discussion?

[zapkitty]

I agree with simplicity, consistent Gui

So.. where we start discussion?

Well, my idea greatly simplifies the battlescape GUI by reducing the clutter of actor selection buttons to just 4: "previous" "current" "next" and "all" which can be represented here as ...

                                             < 8 >  V

... with the number 8 representing your current selection.

And if you want to select a character directly rather than paging with the "next" and "previous" buttons you just hit the "all" button and your current list of actors slides out...

                                             < 8 >  V
                                   1 2 3 4 5 6 7 8 9 10

... but this intrusion onto screen real estate is only temporary as this array slides back in when you make a selection.

So say you selected number 2 then your display will now look like this...

                                             < 2 >  V

The one disadvantage is that you need two mouse clicks to select a particular soldier.

The advantages are several, including a simplified GUI and the ability to add actors at will. Also note that this method does not have the main battlescape GUI dictating what actor attributes are displayed or how they are displayed when you hit the "all" button. Variations could have anything from just a number to a portrait with color bars for HPs and TUs to the current weapon to advanced combat stats... modders should be able to work with that idea.