UFO:Alien Invasion

Development => Artwork => Topic started by: bayo on October 23, 2010, 12:17:57 pm

Title: JA2-like hud
Post by: bayo on October 23, 2010, 12:17:57 pm
BTW, i think http://ufoai.ninex.info/forum/index.php?topic=4762.msg39294#msg39294 (the second part) is the more interesting interface. I only talk about the 2 screens mechanism, one for the group and one for a soldier, and not about the current content (especially not the second screen content).
But IMO implementation should need some smooth animation feature, for transition, we dont have ATM.
Title: JA2-like hud
Post by: mor2 on October 23, 2010, 03:58:41 pm
you mean, TrashMan sugestion?

(http://img704.imageshack.us/img704/8556/uaigui22.th.jpg) (http://img704.imageshack.us/img704/8556/uaigui22.jpg)

i tried to bring it into discussion before (Was edited out), with 1-16 soldier this will be the biggest most space consuming control. so we must decide where it fit in, on top as before or maybe as part of the lower panel.
in the current suggestion, the bar is to big and cannot hold 16 soldiers also it creates a lot of dead space captured underneath it, one of the options is to use a scroll bar showing X soldiers at a time or make it expand depending on the amount of available soldiers not all 16 slots (like fire mod control does) or show them all and try to fit it somewhere in the interface, making it smaller placing them in a numberr of rows.

few question before we can start, does everyone share our enthusiasm about it? (portraits how small will you go? (http://i53.tinypic.com/4tprwm.jpg))  if so, then what is the functionality people want to see here, the 3 stats and function icons or more like in H-hour bar  (http://ufoai.ninex.info/forum/index.php?action=dlattach;topic=4762.0;attach=4519;image)? i prefer the later, i think we can make it work without creating information overload but we should start from the more basic design.

here is a very quick sketch of what i mean:

(http://i51.tinypic.com/2vuas7t_th.jpg) (http://i51.tinypic.com/2vuas7t.jpg)

thoughts?
Title: JA2-like hud
Post by: bayo on October 23, 2010, 07:10:42 pm
To be clear, i talk about the relation between http://img189.imageshack.us/i/uaigui21.jpg/ and http://img704.imageshack.us/i/uaigui22.jpg/ (the 1st one is a global view of the second one)

But i dont like the second one (especially the blue bar, and globally the layout). I think the second one should not display info about other soldiers, but provide something like simple tab to allow to switch to soldier (like the current number list). But most of idea is here, all soldier info is on bottom and over it there is tabs. The bigger problem is to display all the soldier content in a clear way and graphically separate it from tabs. Maybe http://ufoai.ninex.info/forum/index.php?topic=5468.msg44081#msg44081 with the head on bottom do the job better. And your proposal with the merge of left-right weapon together can looks clearer (http://i55.tinypic.com/2s80oxj.jpg, the third from the top, at left). (and alien info should not be here too).

About portraits for the global screen (http://img189.imageshack.us/i/uaigui21.jpg/ ), it is not the more important, but it is an element to help selection anyway. I mean, the size is not important. The weapon size is more important, we must see which weapon it is. If it dont work with 16 weapons, and there is no solution to display all this content for 16 soldiers, if think it will not works. A little comment about uaigui21.jpg, i think separation between soldiers should be clearer.
Title: JA2-like hud
Post by: Bartleby on October 23, 2010, 07:51:42 pm
as i understand now nearly all of u want a new gui. some want to change the colors, some the graphic, some the functionality and some all three. some think the gui can wait until game is finished and some think u need to start with changes now.
all ideas in this forum are better than the old gui.
maybe u should start a thread where u can see:
- what is possible
- what needs to be done
- who can do what
- who wants to do what
- and some polls where u can vote
(maybe just polls where the contributors take part and maybe less polls where whole forum can vote)

i think the target-gui shoudnt be a perfect gui it should be a better (and maybe easier to change) gui.
well... h-hours start (closed discussion in mainforum) wasnt bad. maybe a bit.. hm..  strict... but.. well... maybe u should just delete my post because its a bit simple-hearted =).
Title: JA2-like hud
Post by: mor2 on October 23, 2010, 08:10:11 pm
@bayo, ok i think i understand what you mean, you want Ja2 interface? soldier bar at the bottom  (http://pcmedia.ign.com/pc/image/ja2wildfire_040604_000_640w.jpg) showing both weapon hands and secondary interface (http://www.mobygames.com/images/i/17/08/194008.jpeg) for more management, only with added soldier selectionl bar (minimal) so you can go through all of the sixteen fast?

still you need to address how you are planing to deal with 16 soldiers bar on the "global screen". (we will deal with graphics later )


in the mean while here is another idea (i didnt kept a copy of the source so its jepg of jepg quality :-\ )
(http://i55.tinypic.com/2utq26x_th.jpg) (http://i55.tinypic.com/2utq26x.jpg)

1. instead of wasting place on L.hand panel (which not everyone use often) i placed it on the right, it will close when only one weapon will be in use.
2. the floor selector, i tried the same idea as before, it works exactly as the original only the bar is show only when you move your mouse there (just like the log in geoscape)
3. maybe we should allow the soldier selector to hide, personally i dont use it much, i move the soldiers mostly by using the cursor, this way everyone can chooce if he wants it or not, i also added the old select next\privious soldier buttons.


@Bartleby
- what is possible - been doing that.
- what needs to be done - that what we are discussing here.
- who can do what - lets not get over ourself, one step at time.
- and some polls where u can vote - pools works for final designs in the meanwhile you can post your opinion here...
Title: Re: JA2-like hud
Post by: mor2 on October 24, 2010, 03:32:01 pm
i see you have split the main thread, not sure if its such a good idea because at this stage the bottom line is that we still dont have a soldier selection concepts for any of the design that works with 1-16 soldiers.
Title: Re: JA2-like hud
Post by: Thrashard96 on October 24, 2010, 06:43:58 pm
16 soldiers will be awesome, i know that ;D
Title: Re: JA2-like hud
Post by: bayo on October 24, 2010, 08:21:55 pm
Quote
not sure if its such a good idea because
It is only to make the thing clearer. If something is interesting we can anyway reuse it elsewhere.
Title: Re: JA2-like hud
Post by: bayo on October 24, 2010, 08:59:20 pm
I copy-paste 16 little soldiers, i think the weapon is not so small, then maybe it can work. It is anyway the worst case. UGV take more that 1 slot. But maybe there is way to improve the layout of this little id card. Bars under the head, or i dont know... Vertical weapon will looks strange (or we should use vertical weapon everywhere).


About http://i55.tinypic.com/2utq26x.jpg
* about the left-hand. I think it is not the better position now. I mean, now there is no a left-weapon on the left corner and right-weapon on the right corner. Then, i think it is better to have them near together. Plus, i think the left-hand width can be smaller (need to check it) cause it can't be a big weapon. And maybe we anyway can fold in too.
* about floors, i dont think it is a good idea. We can test it anyway, it should be easy. But i think map often dont have a lot of level, if we only display what it is need, we already reduce a lot the size, and we also can reduce the width of unselected level.
* about soldier selection, we shouls have nothing other the weapon (cause the popup), and it really can be veryvery small. And it is really important to have a clear graphical separation between soldier info and this selectors.
* the soldier name must be somewhere, somewhere near the head
Title: Re: JA2-like hud
Post by: H-Hour on October 25, 2010, 12:15:51 am
If you choose to split the HUD into two panels we must switch between, would it be possible to keep the current HUD as another alternate, please?
Title: Re: JA2-like hud
Post by: mor2 on October 25, 2010, 01:27:50 am
@bayo, i know you can make them small, the question is if you should?

wasn't this one of the biggest critics regarding UFO:ET interface (http://www.cpugamer.com/downloads/UFO:%20Extraterrestrials/117794980310.jpg) that the portraits was too small and that it wasnt personal enough?
also if we make the weapons so small, does it matter if we actually draw them or make an icon to represent what they are, its not like we have such huge verity and i for once prefer to know if its a sniper/heavy/closecombat/etc so i know what role this soldier play in my team.
Title: Re: JA2-like hud
Post by: Destructavator on October 25, 2010, 02:50:38 am
 ???

Forgive me if I'm sounding like an idiot when I say this, but I'm not sure what "JA2" stands for or refers to, and in skimming back through this and the other GUI design thread I haven't seen what it means spelled out.

Do you mean this:

http://en.wikipedia.org/wiki/Jagged_Alliance_2

?

(This is what came up as a top result in Google.  Before you ask, no, I've never played it and I'm really not familiar with it.)
Title: Re: JA2-like hud
Post by: mor2 on October 25, 2010, 03:10:16 am
yep, Jagged_Alliance_2, one of the best tactical shooters, btw there is a new remake soon to be released and it doesnt seem like it is mainstreamed  :D
Title: Re: JA2-like hud
Post by: Mattn on October 25, 2010, 07:35:41 am
what is the name of it? a link available?
Title: Re: JA2-like hud
Post by: mor2 on October 25, 2010, 09:46:42 am
Jagged Alliance 2: Reloaded wiki (http://en.wikipedia.org/wiki/Jagged_Alliance_%28series%29#Jagged_Alliance_2:_Reloaded), few screens (http://www.jaggedalliance.com/index.php?id=19&L=1) probably wont be as good as 1.13 has become but still...

btw we are little of topic.
Title: Re: JA2-like hud
Post by: Bartleby on October 25, 2010, 12:56:53 pm
i never played ja2 and i dont see anything special in those screens. do i miss a thing?

why off topic? we are discussing other games hud.
btw. admins are never off topic :P.
Title: Re: JA2-like hud
Post by: mor2 on October 25, 2010, 02:51:35 pm
the difference is that he wants to separate the interface into two parts, the soldier bar and the "action" bar.
the first shows only portraits and gives you general info (weapons/health) the second is used for more detailed.
Title: Re: JA2-like hud
Post by: bayo on October 25, 2010, 08:58:55 pm
Quote
, would it be possible to keep the current HUD as another alternate, please?
Yes, but if we create this new thing it will be another alternate, it will not became the default one.

Quote
@bayo, i know you can make them small, the question is if you should?

wasn't this one of the biggest critics regarding UFO:ET interface that the portraits was too small and that it wasnt personal enough?
That is funny cause, http://www.cpugamer.com/downloads/UFO:%20Extraterrestrials/117794980310.jpg look like what i would like for the second screen. I dont see this little heads small, it is only an help we a better feeling than number, but it is only something we can click on, no more.
* About the global view only, we can do some improvment by reusing concept we often see with phone (touch-drag motion) or with dock bar (magnification by changing element sizes). I mean we should not think about that now, cause we can't do all this things at the same time.

Quote
also if we make the weapons so small, does it matter if we actually draw them or make an icon to represent what they are, its not like we have such huge verity and i for once prefer to know if its a sniper/heavy/closecombat/etc so i know what role this soldier play in my team.
* I dont think icon is the right way... i mean to force user to learn new kind of consept he see nowhere. User already must learn weapon look, i dont think it is a good idea to learn more.
* if icon is a group for soldiers (sniper/heavy/closecombat). I dont really like the idea, anyway, It need to know what it will look like, how we can edit it... how, when, where... no body will implement it. Then it is another subject too hard to think about it on this thread. Plus, i think weapon image is more useful in this case.

BTW talking about phone: minimalistic hud for phone is an interesting subject. Multiplayer party need only few screens. Thats maybe a work we can do (anyway i dont know about phones and 3D).
Title: Re: JA2-like hud
Post by: mor2 on October 26, 2010, 02:48:37 pm
too bad i am new, so only now i figured out that the alt.hud, which i was asking about before is not just an extension library but actually a different layout. (was there a screenshot of it in the whole 10p thread  >:()

anyway, bayo, i dont understand what stops you from making the JA2 like hud, you already have most of the things you want in a.hud, separate it in two panels which you flip between with two buttons, then adapt it to what you want and when its done, post it here and we try to dress it in some graphics... (you know there is many very talented people on the forum, i bet at least one of them is good at this, if not i'll give it my best shot)

which is what i do, right now i am testing some other colors scheme, since only grey/green is depressingly annoying to work with, i am trying a bright theme so i can work with wider range of greens (does it have to be green?!?!?!?), probably i am going to need to darken them a little to keep the mood.
Title: Re: JA2-like hud
Post by: bayo on October 26, 2010, 09:38:39 pm
Quote
an extension library
?

Most of the main panel is not ready. And it is the more importante screen. Here some improvment. We need to display the soldier name (done), a button for stats (not done), soldier navigation (done). Maybe we can found better layout, i dont know. I think it is already a big improvment from the default HUD, then if it work well, we can overwrite the default one with this one.

Anyway, nothing is magic, implementation need a lot of work, and i have no time. Then i prefer to have something "final" and doable than a draft or an incredible new GUI.
Title: Re: JA2-like hud
Post by: H-Hour on October 26, 2010, 10:05:18 pm
I really like the placement/size of the line of soldiers in that mockup. It's small but sufficient and sits comfortably on the eye.
Title: Re: JA2-like hud
Post by: mor2 on October 26, 2010, 11:00:13 pm
Most of the main panel is not ready

(http://ufoai.ninex.info/forum/index.php?action=dlattach;topic=5477.0;attach=5773;image)

after loading few examples into the game, i think it will be little to small but we can manage.
also the ammo icon is too small, 2 tile clips will be squeezed, the fire mode display is nice  (ammo, chance,TU  is it?)  but its missing few other things that usually shown there and its not very easy to understanding to newbies.

ok, so what do you want me to do, make this layout with the current set of graphics or?


Quote
implementation need a lot of work
from what i seen the above panel doesnt need much work, mostly moving around few buttons from panel to panel and updating path's
and speaking of implementation where does the 2.3 version, editor saves the changes under win7  ??? (no idea whats home)
Title: Re: JA2-like hud
Post by: H-Hour on October 27, 2010, 12:22:20 pm
and speaking of implementation where does the 2.3 version, editor saves the changes under win7  ??? (no idea whats home)

On my Win7 it's here:

C:\Users\YourUserName\AppData\Roaming\UFOAI\2.3
Title: Re: JA2-like hud
Post by: bayo on October 27, 2010, 03:00:35 pm
Quote
after loading few examples into the game, i think it will be little to small but we can manage.
Yes, and i think if in few time we can remove the reload button (and the fire button), we can have a little more spaces for this element.

Quote
(ammo, chance,TU  is it?) but its missing few other things that usually shown there and its not very easy to understanding to newbies.
I only copy-paste it from a screenshot. I dont think about the content, but sure there is way to improve it, and/or to use this space better.

Quote
ok, so what do you want me to do, make this layout with the current set of graphics or?
* If you have an idea where we can add the soldier stats button, maybe near the inventory icon (but it need to rework the panel containing the head), and a better integration on the soldier name.
* provide cleaner background panel
* rework the soldier selection design, we can see it as tabs, maybe it can look like tabs, i dont know
* provide cleaner buttons (split the background button and the icon, and create 4 stats: normal, disabled, hovered, and clicked (which is the same as hovered)) A pressed state (with normal, hovered, disabled...) can also be useful for buttons which push popups.
* and yes we whould use the current style. It can have some *effects*, but it should look like the current style.
If you work with Photoshop or Gimp and use layers, it is ok for me. I dont know about Paint.
Title: Re: JA2-like hud
Post by: mor2 on October 27, 2010, 09:43:20 pm
sorry no photoshop here, but i use paint.net and it has layer too (although doing basic stuffs like making gradient takes some effort)

anyway if you wish the same, then here i replicated the layout you wanted (http://i54.tinypic.com/wu54j8.png)  (your mockup (http://ufoai.ninex.info/forum/index.php?action=dlattach;topic=5477.0;attach=5773;image))  if its ok we can start adding stuff.
i also made an adaption to the default layout (http://i53.tinypic.com/263fsbs.jpg), keeping it mostly the same (for those who like i this way) only fixing the RF/stance/reserve
and here is another suggestion for a.hud like floor selector (http://i56.tinypic.com/2w511qv.png) (its the same but faster to scroll and more compact)

beside that, here what i am working on  (http://i52.tinypic.com/9i8b52.png) and or this one (http://i56.tinypic.com/106doqx.png) maybe you'll see something you like or have some insight on one of them.


btw for those who doesn't know, in normal browsers you can use middle mouse to click links so they open up in a new tab (greatly speeds up work with multiple link post like this)
Title: Re: JA2-like hud
Post by: Crystan on October 27, 2010, 10:46:55 pm
Your work looks definitely much better than the old one. I really like it. *thumps up*
Title: Re: JA2-like hud
Post by: bayo on October 27, 2010, 11:55:13 pm
I rework the soldier bar cause i really think it is need to have that size ATM. I also think the merge between that bar and the soldier panel is not very nice. Anyway, i think i can work with that content. Will see.
Title: Re: JA2-like hud
Post by: mor2 on October 28, 2010, 12:52:39 am
 i made it smaller 32x32 squares, if you want it smaller tell me exactly how much on how much you want it.

personally i think its too small and unless you add some way to distinguish which one is selected it will be very annoying, which is why i kept one with spaces, so you can add a selector, i suggest the one at the bottom right, around the fourth from the right head here (http://i56.tinypic.com/106doqx.png). we can do something else but i think that a selector is must.

btw does the game support semi transparency? if so we can do it with highlight on top.

Quote
I also think the merge between that bar and the soldier panel is not very nice
i think its butt ugly, just as the merge between the portrait and the space for buttons on the left or most of that original theme (its wasnt designed to be placed like this, look at the corners at opposed sides), anyway what you want me to fix and is the space i left for the name is enough? (dont worry blur, transparency and other effects can be added later)


EDIT:
i actually think it so ugle that i made a quick fix, little different than your mockup but i think its better: http://i51.tinypic.com/9h0z9l.png
Title: Re: JA2-like hud
Post by: bayo on October 28, 2010, 11:35:01 am
Quote
personally i think its too small and unless you add some way to distinguish which one is selected it will be very annoying
* we need space for a big shot button, and a relead button, then this space is need for anotheer thing http://ufoai.ninex.info/forum/index.php?action=dlattach;topic=5477.0;attach=5773;image
* plus, we dont have a lot of faces, then we can't anyway distinguish soldier with heads. We must create something when we hover heads with mouse (updating soldier panel, tooltips, or another way, your selector? but i dont well inderstand it). See it as a way to access to soldier not a way to distinguish them.
See http://ufoai.ninex.info/forum/index.php?action=dlattach;topic=5477.0;attach=5776;image as a contrainte (it can be 1 or 2 pixel bigger per box, but i dont thing it can be more)

Quote
btw does the game support semi transparency?
Yes.

Quote
i actually think it so ugle that i made a quick fix, little different than your mockup but i think its better
The weapon zone must be bigger cause there is ammo model. And i already talk about soldiers tabs. And there is no space for the soldier name (which should be inside a green panel (with another image anyway, but i mean it need more height than the text height))

I only create this mockup (http://ufoai.ninex.info/forum/index.php?action=dlattach;topic=5477.0;attach=5773;image) to constraint some box position and size. You can do everything you want with the style. It only must look like our grey-green style, but you really dont need to reuse the real current style. I mean, it can be more modern, while there is not a very hard gap between the geoscape and the battlescape.
Title: Re: JA2-like hud
Post by: mor2 on October 28, 2010, 02:14:36 pm
by selector i meant something like that (http://i56.tinypic.com/2lcbitu.png) because 16 tiny heads is confusing, adding a marker to know which one you are using will make it much more easy to select the next one.

and here is an even smaller version (http://i53.tinypic.com/29kvx1w.png)

the weapon zone is bigger than the one in your mockup, so you want the panel on top thinner or make it wider?
and you want the "standard name box" to fit under the portrait, maybe we can do it with plate instead, like in the MP menu but instead of a vent put two bolts  on each side and place there the name, it sure will take less space ...
Title: Re: JA2-like hud
Post by: bayo on October 28, 2010, 02:26:48 pm
Quote
by selector i meant something like that (http://i56.tinypic.com/2lcbitu.png) because 16 tiny heads is confusing
No idea, as you want. The more easy is to change the background color.

Quote
and here is an even smaller version (http://i53.tinypic.com/29kvx1w.png)
I think its too big, or...

Quote
the weapon zone is bigger than the one in your mockup
...or the weapon zone is too small. From my mockup (which is a copy-paste of an old mockup from you) it is 160px width, your one is 120px width. Or we are not talking about the same thing. I talk about the green panel which contain the weapon.

Quote
and you want the "standard name box" to fit under the portrait, maybe we can do it with plate instead, like in the MP menu but instead of a vent put two bolts  on each side and place there the name, it sure will take less space ...
Maybe some example can be useful.
Title: Re: JA2-like hud
Post by: mor2 on October 28, 2010, 03:28:50 pm
(http://i56.tinypic.com/2qapzdk_th.png) (http://i56.tinypic.com/2qapzdk.png)
Title: Re: JA2-like hud
Post by: mor2 on November 02, 2010, 08:53:28 am
i think  might have found something for you, its little too "dark" but has that tiny minimalistic theme you like, what do you think?
Title: Re: JA2-like hud
Post by: Kildor on November 02, 2010, 09:17:18 am
There is too much chrome, and gradients for me.
Also, personally I don`t like height of this ui.
Title: Re: JA2-like hud
Post by: mor2 on November 02, 2010, 11:51:21 am
its only seems that way because i havent spent any time on it, color its what makes the difference and color is usually not a problem, here a quick random splashes to show you what i mean ( someone with more time, better skill and photoshop can do much better)

same about height it can be adjusted as well , if he likes this frame.