HUD interface design

[IceX]

Well fixed pretty much everything you mentioned Baaja, thanks for the crits!

Also had an idea that we could animate parts of the hud like so:

When you are ready to make a transformation the hud would do this:

And when your health is at lets say maybe below 20% the hud would do this:

What do you think?

PS
Don't mind the shit quality of the gifs...

 

[Plakman]

if the health doesn't blink than the color to the left is a bit to dark for me. (partially colorblind)
same for the energy.

1 Question remains: what happens if it's both of the cases? ready to transform and low health?
does they both blink than or isn't that supported.

Other than that i must say...
Wish i had those skills

looks pretty damn good.

http://www.network-janitor.net/wp-content/uploads/2013/06/awesomeness-seal-1.gif

 

[IceX]

Yeah in that case both would blink, but it's really up to the team how it's gonna be animated, I'm just throwing some ideas on to the table.

 

[Baaja]

That looks awesome! Gotta say that I love this HUD it has everything without feeling bloated! I hope that the HUDs are capable of being animated

 

[Tenzo]

That looks awesome! Gotta say that I love this HUD it has everything without feeling bloated! I hope that the HUDs are capable of being animated

^This.
Nothing to add really.

 

[IceX]

That looks awesome! Gotta say that I love this HUD it has everything without feeling bloated! I hope that the HUDs are capable of being animated

It is capable of being animated, it's just a question of what the team will decide.

 

[GodSaiyanBlade]

It is capable of being animated, it's just a question of what the team will decide.

IceX it's looks awesome but expect the dark in the left side in the energy and the health you need to do little more bright in left sides and when the health is low so i see in the right side that it is so much black in my eyes in right side when health down there is something to do with this ??
BTW: your skills is awesome on what program do you use and can you please make a tutorial how do you use this hud ir something like that abd explain how to do
please i just wanna know how to do huds and other editing things
it will make me very happy (sorry for bother you)

 

[IceX]

I use photoshop cs6. I suggest you download a trial and google for "photoshop tutorials", that will help you get started

 

[~#Revan#~]

IceX it's looks awesome but expect the dark in the left side in the energy and the health you need to do little more bright in left sides and when the health is low so i see in the right side that it is so much black in my eyes in right side when health down there is something to do with this ??
BTW: your skills is awesome on what program do you use and can you please make a tutorial how do you use this hud ir something like that abd explain how to do
please i just wanna know how to do huds and other editing things
it will make me very happy (sorry for bother you)

ya well is just images nothing else
u can make it in photoshop
also photoshop is better for effects maybe u can do the first ones like the base in illustrator or CorelDraw
after that is more easy just apply effects in photoshop
photoshop is not the only program existing to do this and is not the best on that engine code but is the most used and ya there is more tutorials for it
so take it in mind... is just images u need just imagination and know what to do in the program just that

 

[GodSaiyanBlade]

I use photoshop cs6. I suggest you download a trial and google for "photoshop tutorials", that will help you get started

I have a full photoshop cs6 and full after effects cs6 and more (not trail) can you give me a link for a tutorial for a hud or something easy to start (i know more about After effect from photoshop)
Photoshop very little thing i know
Thanks for help

 

[IceX]

You need to understand a few things before getting started on a HUD. I would start with basic shapes (circles, rectangles etc), then move to custom shapes with polygonal lasso tool and after that mastering the pen tool. You will also need to learn "layer style" options. Main thing is just to get started and have fun with it

 

[hleV]

I love it, though I'd find it more practical if the "profile" part was a little smaller. Perhaps to match the height of the HUD's right side.

To illustrate it:

 

[IceX]

I'm not sure how to do the attack icons then though? Maybe without the text?

 

[Slofreak]

Maybe you could maybe place the stamina bar on to the outer ring that way you could move the attack bar up, making it even more compact. But i don't think it needs to be even more compact than it is, looks great. Could you post a pic of some ingame shot of esf final and just paste your hud over it, wanna see how it looks.

 

[IceX]

It's half way coded so it shouldn't be too long to see it in actual ingame. Me and Raven worked on it today.

 

[Baaja]

Wow, that's great! This is the type of thing that makes the community come alive and it makes us feel like we have a saying in what should or shouldn't be done! Thanks for providing the rest of us that oppurtunity IceX!

 

[IceX]

This is where it's at atm. No animations are putt in for the HUD yet, but it is fully functional now, same for the scouter.

 

[RobiZ]

Looks good , i don't prefer these type of huds thou ( i prefer minimalistic huds), but still looks good.

 

[Grega]

Also in case you guys didnt pick it up yet.

The HUD can be built by using HTML 5. So anyone with HTML knowledge can make their own HUD.

But yea Looking great Ice. Love this one so much more than the green one ^^;

 

[Baaja]

Seeing Grega's post, I wonder what the other devs and testers like it, if they actually had a chance to try it out

Looking really good though Ice!