Page 1 of 1

UI Mockup

Posted: Sat Feb 13, 2016 3:08 am
by macsforme
Had a moment of inspiration last night, and I mocked up a new UI interface idea that seems more minimalistic and modern. The center circle is the mouse dead zone. To the left of it are shot reload indicators. To the right of it is the flag you are currently holding.

Image

Re: UI Mockup

Posted: Sat Feb 13, 2016 7:25 pm
by kaadmy
What about the radar-thing?

Re: UI Mockup

Posted: Sat Feb 13, 2016 8:02 pm
by macsforme
kaadmy wrote:What about the radar-thing?
It would have more detail than what's in the mockup (probably similar to what we have now), but in the new position and with perspective projection (so it looks like it's tilting away from you).

Re: UI Mockup

Posted: Sun Feb 14, 2016 3:17 pm
by Zehra
Looks nice Constitution, but it looks a little too modern for bzflag.(bzflag is retro)
Would like to see that in a different game sort of like bzflag although. :idea:

Re: UI Mockup

Posted: Sun Feb 14, 2016 8:42 pm
by trpted
Looks interesting.

How did you make this mockup ?

If the new UI exist and not for example photo-shop-ed : Where can I down load the new UI?

Thank you

Re: UI Mockup

Posted: Mon Feb 15, 2016 4:53 pm
by kaadmy
@trpted I'm pretty sure it's just a simple image, not in-game yet, unfortunately.

Re: UI Mockup

Posted: Mon Feb 15, 2016 8:53 pm
by trpted
kaadmy wrote:@trpted I'm pretty sure it's just a simple image, not in-game yet, unfortunately.
#1 So, you used Photoshop / GIMP (or something like that/those programs/apps) to create that?

#2 Any ETA as how soon that can used/will be used in game?

Thank you

[EDIT] Duh- hits head on wall - you are not the OP, who created that image.

#1 So, you think that they used Photoshop / GIMP (or something like that/those programs/apps) to create that?

Re: UI Mockup

Posted: Mon Feb 15, 2016 10:48 pm
by macsforme
It was just a mockup created in inkscape and gimp. Right now it is just a concept. There are several discussions ongoing about how to overhaul the game and make it more appealing for players, including simplifying and modernizing the user interface, so I was just throwing this out there as a part of the overall discussion.

Re: UI Mockup

Posted: Mon Feb 15, 2016 11:14 pm
by Zehra
I'm looking for an improvement in the interface, looks like a clone or fork may happen if no development in the interface occurs.
But if that does not happen I hope that a clone or fork will bring back the "bzflag" experience back for our users.
I hope a clone or fork may not occur, but that will depend on what happens in the development of bzflag.

Re: UI Mockup

Posted: Tue Feb 16, 2016 1:30 am
by indy
"Consti: have you ever noticed that it's always the worst feeling ever to type a message that's so long that it gets cut off at 128 char"

rofl!!!


btw, I really like the UI mockup.

Re: UI Mockup

Posted: Thu Feb 25, 2016 5:38 pm
by Monster
can it also show the mouse box?
Looks great otherwise!

Re: UI Mockup

Posted: Thu Feb 25, 2016 7:07 pm
by macsforme
Monster wrote:can it also show the mouse box?
Looks great otherwise!
It would probably be a mouse circle, and I envision that a section of the circular border would appear as your cursor approaches close to it. It would look kind of like a sliver of the moon.

Re: UI Mockup

Posted: Fri Apr 15, 2016 7:11 am
by macsforme
Here's another revision. The mouse box dead zone outline would always be visible (so you can aim), but the outer box would only become visible as you approach it (and only the part of the boundary you're close too, with the rest fading away). Text on the left is chat, text on the right is status stuff, and the text above in the center would be for notifications and important information. I think the rest is pretty self-explanatory.

Image

Re: UI Mockup

Posted: Sat Jun 04, 2016 4:19 am
by macsforme
One more revision. I tweaked a few things, showing where more stuff would go like notifications, user prompts (like for polls), the player's score and currently-held flag, and the text box where you type stuff in.

It wouldn't always look this busy, but at least everything has a place when it needs to be shown. This is also an example of what it would look like at the lowest supported resolution. At higher resolutions, everything would be much more spread out.

Image

Re: UI Mockup

Posted: Sat Jun 04, 2016 6:28 am
by click click boom
This looks really nice.

Re: UI Mockup

Posted: Sat Jun 04, 2016 3:41 pm
by Bacon Grease
I love this, Constitution!
It looks very functional and modern while still respecting the look-and-feel of BZFlag.
I especially like the user prompt idea. I don't know how many times I've had to say "type '/vote yes/no' to vote"...

Who/what would be needed to implement this UI into the game? I'm not very knowledgeable about this sort of thing but I love the game and would fully support an upgrade to it.

Re: UI Mockup

Posted: Sun Jun 05, 2016 7:10 pm
by macsforme
Bacon Grease wrote:Who/what would be needed to implement this UI into the game?
I don't currently have plans to begin a project of this magnitude in the current codebase. Such a significant re-work of the user interface has to touch so much of our (awful) code that it might as well be a part of a larger effort that solves some of our other issues as well. For now, I am throwing around some concepts and demos for a major overhaul or reboot that might happen later.

Re: UI Mockup

Posted: Mon Jul 04, 2016 4:26 am
by macsforme
One more update. The rendered scene in the background is from a rendering prototype I'm working on, and the rest is a mockup. I added a black silhouette to UI features so they stand out better against a light background.

Image

Re: UI Mockup

Posted: Tue Jul 05, 2016 6:29 pm
by kaadmy
Really, really nice @Constitution :)
I'd love to see this become the next BZFlag!

Re: UI Mockup

Posted: Fri Jul 08, 2016 8:00 pm
by trpted
kaadmy wrote:Really, really nice @Constitution :)
Nods in agreement.
kaadmy wrote: I'd love to see this become the next BZFlag!
+1 at least the option to.

Re: UI Mockup

Posted: Tue Aug 14, 2018 9:25 am
by macsforme
One more small update, with an updated background rendering from a prototype I've been working on lately.

Image

Re: UI Mockup

Posted: Mon Jul 01, 2019 9:17 am
by fox in the fog
I love this modern slick minimal look. The whole mouse box thing is great, the side and top displayed infos are also nice rendered. The only thing I'm completely against to is the prospective projection of the radar. This will make dodging shots so much harder because the relation between your tank and the shots is no more direct, but has to go through a projection process. I think that would be tricky for the eye to compensate to and properly dodge. However I think all the numbers around the mousebox like altitude ecc, and the coordinates are nice, they add a military feel and I think that shouldn't go away in my opinion. Lastly, what makes me not using the exposed treads (that you rendered in the last post) is it being too big, it covers a great portion of the scene vertically and consequently horizontally.
fox

Re: UI Mockup

Posted: Sat Apr 16, 2022 5:09 am
by macsforme
Here's another mockup with an idea I've been thinking about for a little while. I remember in the 2.0.2 days I would see the most competitive players with their radar covering over half their screens, even partially covering the mousebox in the center of the screen (so basically, you gave up a lot of 3D view for the sake of a large radar). The chosen solution at that time was to reduce the maximum size of the radar, but I wondered if there was a better way to arrange the user interface so you could do justice to both the 2D view (radar) and the 3D view.

This mockup shows a split-screen approach, where you have the radar occupying one side, but on the other side the 3D view is shifted to the side and the field of view is increased. So basically, you still get a decent 3D view with some margin on both sides of the center (obviously not as much as before), but you can also maximize the radar based on the height of your screen. While this would probably not be a great default view setting for new players, and I'm not even sure whether it would work in the real world, I thought it would be an interesting concept for league/competitive players (especially those with wider screen aspect ratios).

There are also a few other proposed elements, such as a new HUD design, separate chat and notification text, a dark shadow behind all UI elements (for better readability), and new FOV/aim guides on the radar.

Image