Metroid Prime-style HUD

#1 Which part of the Metroid HUD are you asking about?

If you wanted looking-through-glass distortion effect you might use a pixel shader...

#2 Wish I had a copy of my old post from the Iydronis studios site, I ask a similiar question on the glowing helmet huds they had design for the Cyberfuge:Second Battallion. It was very helpful. The hud pieces were design in photoshop but the overall effect was the glow that was used for all the elements. It was one of the opengl blending modes that you had to add into the engine code. Anyway thats about all I can jog from my nogging at the moment heh.

Edited for my poor spelling :) Great if you can get any info back Eric Pre-haloish and it still looks very cool.

#3 I work with Idryonis, it's been a while since I looked at the HUD code for Cyberfuge, but if the HUD in this image:

www.garagegames.com/mg/snapshot/view.php?qid=690

Looks kind of like what you are looking for, I can try digging though the SVN server and give you an idea of what we did for that. All of that is like TGE 1.0 though, so I'm sure how much would apply to how things are now.

Johnny is right though, it is essentially the blend mode, and the way the graphics are setup, but if that looks like something along the lines of what you want, I'll try and dig up the old code and see if I can give you any pointers.

#4 My first instinct would be to use the client-side TSStatic resource, and simply create the GUI as a bunch of 3D shapes. But this is probably a bad idea. Though you could have some cool effects.
Is it not an option to simply make HUD images warped? Or do you want to be able to add text arbitrarily? I'm sure someone proficient at rendering and stuff could write a shader or whatever that warps text.

#5 I don't see why you can't just fake it in 2d. The hud overlay itself is simple enough to do in Photoshop. The numbers for ammo counters, etc. would all have to be done as .png's (0-9 images).

The only difficult part I see would be getting the compass/radar to curve properly, and to get your player/vehicle radar blips / positions right. But, if you look at the image above, you can see that by putting the radar in the middle of the screen, you don't have to curve it and worry about that stuff.

#6 I like J.P. Berry's idea. The images themselves can "look" like they are projected on a curved surface. Then if you want them to slide around a bit as the head turns etc, just fake it by moving the controls.

But as the original post mentions, that won't work with controls having text.

You could take the flat image/text and do a distortion pass over it with a shader ... eg, render it as grid of quads, given some parameters like the amount and direction of curvature, and then it just warps all the vertices.

#7 Eric, the blend mode stuff is looking awesome. Though it's not quite what I'm looking for, I'm sure a resource would be appreciated by many. :]

J.P. Berry, that would cause quite a few problems. As you said yourself, compass and radar curving wouldn't work well. Text wouldn't be warped properly. That approach would really be quite limiting. So a shader would probably work best here, but again, as I said I don't feel I have the skill to write anything like this.

#8 Well, I don't use TGEA, so I wouldn't know how to program one.

To get the text to warp properly, you just spherize it in a .png before you even put it on the screen. Then, you just change the pre warped images through script.

So, for an ammo counter you would have 0.png, 1.png, etc. And you would swap them out via script during execution. Fix the position so you have [][][], and fill in each box corresponding to current ammo amount and which position. 90= [*][9][0], to be filled in as : empty.png, 9.png, 0.png

Then you would use scaling to make the .png gradually scale up (or down if starting on the left side of the screen) to give the effect of wrapping, and also removing the necessity to have seperate .png's based on relation to the center of the sphere.

Check out the image below. To note, I am a programmer and not an artist, so please excuse my horrible photoshop skillz. I only spherized the text horizontally in the first photo, and you'll want to add some vertical in there as well to make it look right, but hopefully you get the idea. Some multiply and lighting effects would also make it look much more realistic.

Anyways, there are a number of ways you could do this without making it overcomplicated. This is just one of them.

#9 Derp. Error in logic on my part. I don't use TGEA either. :)

Unfortunately, I don't think you understand -- as I said, faking it with images is awfully limiting, though it would work to some extent.

#10 If you don't use TGEA ( no shaders ) and you don't want to "fake it with images", you will have to manipulate/modify textures on the cpu - which will not be good for performance. I think Metroid Prime faked a lot more of that effect than you might think.