How to PSP Animated Background?

[zerodevice]

Hi, I was wondering for PSP's GUI Background.
How do they make that?

http://img490.imageshack.us/img490/1149/screen1ka5.png
http://image.com.com/gamespot/images/2007/features/hardware/slim-psp-handson/psp_embed002.jpg

What PSP does is when it's turned on, several white gradient lines wave up/down then formed the background with few wave lines like the picture above.
While using the menu in psp, the background actually does move slowly (animated background), and if you change the color of the PSP theme, the same background color will also change as well.

My questions is, how to do this?
I'm using SDL (newbie), and wanted to make something similar.

I have however several ideas, but not sure which one they are using and might be wrong as well.

1. PreCreate all the bitmaps and load it as a sprite then animate it, (like a sequence of png files). It's going to be very heavy! (>_<)!

2. Realtime render the background with blended color tone, from "X" color to fadeout, then draw 4 lines and also apply color blend on it and also animate the lines like how a vector line is being drawn in most vector application.
This is very hard for me since i need to imagine everything in my head to code it out. (-_-")

3. Render background, but the 4 lines with blended color is actually done by particle system?
Sounds crazy (0_o)?

other than that I have no other ideas how they made those.
All I need to know is a method, so it doesnt has to be any language limits.

Please help out, thanks.

[Nikos Beck]

Each wave is likely a PNG with an alpha channel. It's white that fades to transparent and it's a sin-wave with the edges lining up perfectly. Stick two images side-by-side and you shouldn't notice a break. Slide them both across the screen, when one is no longer visible of the side (like leap-frog), move it to the other side and keep scrolling. That's how I'd do it.

[zerodevice]

hmm. wouldn't that be very very slow or heavy usage of the memory just to use PNG for this background?

coz, the background is not originally sin wave, it's 4 horizontal lines and then turns into sin wave then loop like a leap-frog slide. (although it doesnt look like a loop, it's more like the same 4 lines morphing like how a FLASH ShapeTweening would have done)

[zoombapup]

I'd to it as a bunch of polygons (essentially a line) with vertex colours at the edges set to white. Animate the vertices with a sine wave and obviously have a seperate strip in the middle so that only the edges are alpha'd.

Basically, its very simple 3D stuff.

[zoombapup]

Or if you want to be extravagent, use a triangle strip and a gradient texture UV'd to wrap horizontally.

[zerodevice]

hmm.... 3D?
I thought it's just a 2D coding.

well, I'm having other problems here.
I can't even get SDL to do a screen fade.

if it's 3D you say, should I be using OGRE?

[Maupin]

If I was doing this in Python with Pygame (SDL wrapper) in the case of a simple background animation I'd pre-generate the background animation frame by frame as PNGs and step through them, perhaps changing their position onscreen as needed. For a more complex or variable animation, I'd use a math module with matrices to generate blur/gradients/whatever on a plotted curve. I don't have a PSP so just judging by the stills I can't tell how variable the animation is.

Fading to black in SDL is simple. Just make a transparent black box the size of the screen, blit it ontop of the screen, and slowly decrease its transparency.

[Spaceman Spiff]

(Having been a registered PSP dev somewhere in his murky past, Spiff responds)

If I had to guess, the wave display is done as 3d, probably in through mode (where the vertices submitted are in screen space coordinates) using vertex color and alpha blending to a 32-bit frame buffer. The PSP is not a strong machine for traditional 2d operations.. it's slow as hell to blit sprites to EDRAM using the CPU.

Actually, there are several things about the PSP that make much less powerful than it so easily could have been. (Destination Alpha writing anyone?)

[zerodevice]

The PSP is not a strong machine for traditional 2d operations.. it's slow as hell to blit sprites to EDRAM using the CPU.

Actually, there are several things about the PSP that make much less powerful than it so easily could have been. (Destination Alpha writing anyone?)


What if I were to do that in a PC? shouldn't that be easier and doesn't matter if it's a 2D or 3D?

[ChrisP]

2D should be doable on a PC, provided your resolution isn't insanely huge and you use an efficient per-pixel scheme.

Any of the 3D methods mentioned would be faster, assuming your target machines have 3D hardware capable of doing alpha channels in a reasonable manner. Everything recent from NVidia and ATi will do it with ease. The integrated Intel chips will probably be OK with that too.

As for whether to use SDL or Ogre, that completely depends on the rest of your app. Either way, you'd just be making straight OpenGL calls. Ogre won't help you with this kind of graphical effect, so don't bother with it unless you need proper 3D scene handling (a scenegraph etc.) for other parts of the app.

If I was only looking to replicate that effect, and there was nothing else I had to render, I'd use SDL+OpenGL.

[zerodevice]

Thanks.

I decided to go with SDL and now i need a decent tutorial on making the screen fade, i tried to play around but it was ugly.

going to do my best to try more times.

the outcome would probably be a very noob coding and very unoptimized.

[ChrisP]

Draw as usual, but multiply all your colours by a floating-point "fade" variable. The fade variable should usually be 1.0. When you're fading to black, simply ramp the variable down to 0 over time. (i.e. Subtract some value each frame, depending on how much time has passed since the last frame.)

Fading to other colours is a little more complicated, and cross-fading is quite a bit more complicated.

The other method is to draw a big black partially-transparent quad over the top of the entire scene. That works fine in accelerated 3D, and is very easily extensible to fading to other colours (and even cross-fading, with some work) but it's rather slow in software (e.g. 2D).

By the way, this kind of beginner question may be better suited to gamedev.net than this forum.