XNA 2D Game Engine with Lighting and Shadows

[MrKnightCraft]

its 3d the objects are moving in all 3 directions (the light can move up and down

the movement is 2d and maybe the 3D objects are just plane 2ds but its still 3d

[bobthecbuilder]

@MrKnightCraft the only thing 3D in the video is the light gizmo (only used and seen in the editor, not in-game). the scene, player, and pipes are all traditional 2D sprites. ;)

[areyoucallingmeauser]

This might help clarify some things.

There is some depth in almost all 2d due to draw-order. Whenever two 2d objects overlap there is implied depth as one is "on top" of the other.

[Viking009]

Is that forward or deferred shading?

[bobthecbuilder]

@Viking009 I believe this project was using forward rendering - but SunBurn Game Engine supports both forward and deferred rendering, so it could be either of them.

[TheodenN]

This is more like 2.5D.

[lukechalfantt]

God, some people are so dense... I can't believe the amount of people who don't believe this is 2d.

[AaronPr19]

anything using 3d models is 3d.

[bobthecbuilder]

@AaronPr19 Really? Well it's a good thing we're using 2D sprites then, which I guess makes this 2D (as mentioned above). :)

[mrdkaaa]

@bobthecbuilder Hmm, no height/normal maps, but just plain flat 2D?

[bobthecbuilder]

@mrdkaaa no height maps used, normal maps can be used for bump / specular highlights but are not necessary for lighting and shadows. :)

[JayRecoil]

I have a similar game , just search for soul survivor xna shooter . I need some opinions on it and whether i shouls try to implemnt something like this

[SeanDeigh13]

is alpha channel used for "depth"?

[r34ct0rx]

dude walking :P

[SpEEdHackEr101]

That's easy if your engine knows where the lower pipe and higher lever pipe so the light will make shadow for it,

[morttonfire1]

Wow

[superkellerman8D]

Why bother making it 2d?

[messi996]

@superkellerman8D probably due to the fact making a 3d game is much harder and is hardly worth it just to show simple effects

[superkellerman8D]

@messi996 meh... true. But I find it a tad illogical to use a 3d engine to make a 2d game. But I guess if you want those effects like normal mapping and shadows.

[Schwenneyboy]

It Looks SOOOOOOOOOOOOOO Epic ... OMG NICE ***_****

[MasterOfAllVideos]

Is that UDK?

[bobthecbuilder]

@MasterOfAllVideos Nope, it's using the SunBurn Game Engine's 2D rendering :)

Check out the link in the description for more info - awesome stuff! :)

[jimthegreat1012]

So many idiots saying this isn't 2D. It obviously is. You can tell by the way the shadow is cast incorrectly at :12.

[bobthecbuilder]

Btw: anyone skeptical of this being 2D, the tech has been available for ~3 months and there are quite a number of impressive games being developed with it. :)

Check out the links in the video details for more info!

[Cassildo]

nice grapgics

[silenceofthehills]

How does that work?

[LOUISofSHERWOOD]

nice effect, might have to check this sunburn engine out..

[bobthecbuilder]

Our 2D tech (featured in this video) is available in SunBurn 1.3.2.

I just posted an updated 2D video, see this video's description.

[lucasmontec]

I can't understand how you manage to cast the character shadow from a 2D quad?

[KXMoon]

I wouldn't call this 2d :P

[bobthecbuilder]

@KXMoon why not?  flat 2D sprites (textures on quads) == 2D. :)

[zombis667]

Looks like an awsome game, what program would be the best to use for top-down shooters??

[bobthecbuilder]

@zombis667 if you don't mind a little bit of coding then check out the SunBurn Engine, that's what we used in the video.

We just wrote a simple spritebatcher that outputs a vertex buffer, SunBurn handled all the lighting, shadowing, and rendering for us.

[ILFZ2]

Why does it have 3 Axes? It's not 2D

[bobthecbuilder]

@ILFZ2 read above: "as mentioned before the floor, character, and pipes are all 2D sprites (quads)...."

[troizy]

@bobthecbuilder

but as you can clearly see the light hovers ABOVE the surface, wich makes it 3d

[bobthecbuilder]

@troizy as mentioned by about 30 people, the EDITOR is 3D to allow relative light placement, the GAME / SCENE is entirely flat 2D sprites, which is the point. ;)

[troizy]

@bobthecbuilder

i'm sorry since i'm to lazy to read all the comments

but i did make a point :p

[bobthecbuilder]

@troizy hehe no problem :)

[AntCoder]

Very nice. Very very nice. i have something similar in the works if you wanna check my youtubes vids in a few weeks when i upload some vids :)

[MinkisProductions]

WoW! thats ballin you think it would look good on a side scrolling platform??

[bobthecbuilder]

Yes definitely - top-down and side-scrollers work great with this technique.

We also have isometric working great now too, but don't have that rolled out publicly yet.

[0u73rh34v3n]

nice!

kinda reminds me of the Unreal3 editor

[JEZAGREEN]

If its 2D, why are there 3 axis (x,y,z) on the move tool?

[Schmatko89]

@JEZAGREEN For the lighting, so that you can make shadwos from a light source high above or down close to the ground

[Marco9603]

the third axis is here to pull the light far away from the ground, so it will be weaker

[ImNotLink102]

becouse the light position is in 3d. The actual rendering is in 2d.

[Sizol8]

haha youre funny

[DoubleAG90]

this reminds me of a old game for the playstation...anybody remember the name?! i remember the levels and enemies but thats it...o yeah an you have a gun! lolol

[ZFrancis1993]

nice work

[JordanMaster22]

that is 2d? D:?

if it really is 2d, good work on doing all of those math equations i guess

[bushidopride]

3D viewed from top

[bobthecbuilder]

hey guys, as mentioned before the floor, character, and pipes are all 2D sprites (quads).

The light axes are 3D because the engine and its editor were designed for 3D use. This actually helps with light placement though as you get a sense of how close point lights are to the sprites.

You can tell the sprites are flat by looking at the light axes. While the axes show a heavy perspective (standard fps), the sprites still appear fully top-down even at the edge of the screen.

[LBcoyote]

Very cool!

So sprites, floor etc are all 2D polygons orientated parallel with the view plane and having normal maps, but for proper shadowing I suppose they also must have z maps.

Am I right?

[rxbanditboy1112]

I think its definitely possible, its just much more difficult to do that in 2d, rather than 3d. Also all the art needs to "look" 3d to make the illusion work... Part of me wants to say NO that is a bunch of 3d models in a 2d perspective though.

[DanMa3x]

uhm...that's strange. Maybe it's 2d but.. why the light has 3 arrows for x, y ,z(3 dimensions)?

[KeldorKatarn]

Any chance to get some more technical information on how exactly this is done?

I'm a Computer Science student specializing in software engineering and computer graphics and I'm very interested how effects like this can be created. I think the result is impressive.

[tehsimo]

prob just parallax maps

[dlmenslon]

I think it's not really 2D. I'm very sure about this!

Making such dynamic shadows (look at the pipes) is imho only possible by using a 3D Enviroment.

The 2D effect is made by the view/projection matrix ;).

This would be the way I would start to test when I would use something like this.

I can't imagine, that this is made with realy 2D.

[Intiom]

@dlmenslon

It is very possible to do this with 2D only. You ask people to look at the pipes, but 2D lighting can be even more realistic that that. You can have per-pixel dynamic lighting without resorting to a third dimension.

[dlmenslon]

Look at the lights and shadows, that have to be at least extrem shaders, which are a feature of 3D afaik.

otherwise proove it or give me a link pls :)

[charliebrown76]

Yes, almost certainly. 3D rendered with viewpoint camera looking down from above to get the 2D top-down perspective. However it's all put together though, it's nice.

[voltz15]

Kinda looks like the new batman game from an overhead view.

[nono94777]

OH WAIT!

[Metaby90]

Great job dude!

i cant believe its 2D ! o.o

[chjustin69]

impressive

[bChiCkeNpLuCkeRd]

Errrrr....ummmm..... are you sure you not lying because upon closer look those are some sick ass 2d graphics! Either way good work. : )

[bChiCkeNpLuCkeRd]

WOW! If I just saw this video with no explanation I would swear it was 3D. Good work!

[trimer34]

That light effect is so nice....!!!!!

[ThomasPoersch]

2D dynamic light + bump mapping

[bobthecbuilder]

Yes, plus dynamic shadows - that's the tricky part (though the engine handles that for us). :)

[ThomasPoersch]

Cool thing. :)

[BozzReunion]

thats 3D

[bobthecbuilder]

So using flat 2D quads == 3D?

And comments as to why?

[BozzReunion]

you moving the lights and the pipes throwing shadow as a 3d objekt ;), sprites doesnt throw shadows like that.

its 3d, only that it hast a view from above.

so we can say 2d :D

[bobthecbuilder]

That's the point of the video, with SunBurn 2D sprites DO cast shadows like that.

If you look at the player the top-down perspective doesn't change as he moves further off screen center.

Also the bad alpha clipping on the pipes (due to my poor art skills :) can't be simulated with 3D (unless using a ton of polygons).

SunBurn uses the information already applied to 2D rendering in XNA and can create semi-realistic shadows based on it.

[BozzReunion]

hmmmm ok sounds logical.

if it is so than it is a nice engine.

does it needs a strong hardware?

if yes wouldent it be easyer to make a 3d game wih a view from above`?

[bobthecbuilder]

The engine's 2D requirement are similar to the 3D requirement, PS 3.0 (minimum nVidia 6600, though 7000 / 8000 is recommended).

Whether 2D or 3D is easier is based on the artist / developer. Some people find 2D easier, others 3D. Personally I like them both.

But 2D still has a cool retro feel, even when using updated graphics. :)

[runecrosser]

If it really is all 2D, how do you define shadows? How do we know that the walls aren't higher than the light source?

[bobthecbuilder]

Not following your question. There are no walls - only pipes, a floor, and the guy - all flat 2D quads with alpha clipping.

The lights are above all of these objects as they're lit (the objects would be dark if the light was below / behind them).

[runecrosser]

No, I mean, how do you know how tall the shadows are? For example, say you had a quad representing a six foot tall guy, and a 12 foot tall guy. Would the twelve foot shadow not be longer than the six foot, even though those two figures are represented in two dimensions (lacking the required third)?

[bobthecbuilder]

The shadows would be the same for both - in 2D top-down the player / viewer loses all sense of height, overly tall shadows from one would look broken as both sprites are otherwise identical.

For side scrollers though taller players do cast larger shadows.

[runecrosser]

So, shadow heights are explicitly set, right?

[rafaelrapalo]

that is 3D...dont you see the green, blue and red arrows?

[bobthecbuilder]

You can see by the lack of perspective on the character sprite that all the scene objects are 2D.

The SunBurn Editor and its light icons are always rendered in 3D (for easy placement relative to other objects).

[csisyfiu]

very nice! :) How did you do the 'y' coordinate in 2D? Is this deferred shading? Or what is the "SunBurn"? 5* :)

[bobthecbuilder]

SunBurn is the lighting and rendering engine we used for the demo (I added a link to the video description) - it handled a lot of the "depth".

SunBurn supports both traditional forward rendering and deferred rendering, but we used forward for the demo.

[csisyfiu]

Yeah, nice renderer. :) Thanks for the reply.

[vas3000]

Very nice! Can you tell me how you did the animation? whit sprite sheets? thanks!

[bobthecbuilder]

We used a custom sprite sheet baked down from the XNA Skinning example's "dude.fbx" - we dumped out several frames of the walking animation, combined them onto the sheet, and cycled between them while the sprite is moving.

[alston2reel]

man you are way better than me, i am still kearning 2D lol

[wilmergamboa]

WOW, congratulations!!!!

[Storm336]

how are shadows rendered? O_o

[bobthecbuilder]

Hey guys, thanks!

[KorsAir1987]

nice job man, the game is looking great

[JForceGames]

Oooo, do want.