Esoteric Software

[Nate]

I played around with davede's shader here and a rough normal map to apply lighting to a Spine skeleton in libgdx:



Code (with davedes' permission) is here:
https://github.com/EsotericSoftware/spi ... pTest.java

Runnable JAR is here:
http://esotericsoftware.com/spine/files ... ormals.jar

Sort of related, this is neat:
http://www.spritelamp.com/

[Nate]

Updated to have better diffuse and normal maps:

Runnable JAR is updated too.

[DoobyDude]

I looks much better in the runnable example than the still images show - that is actually very cool, good work!

Are you planning on using this in a game?

[Nate]

No, not at the moment. It actually needs a bit more work:
http://www.java-gaming.org/topics/2d-no ... /view.html
The normals need to be rotated with the bones. It's still kinda neat though.

[Deee]

Hey guys, I'm currently doing some experimenting with spine and dynamic lighting.
So far, I managed to create some normal maps from rendered animation frames, but, coming from a more artistic background, I have no idea how to preview my animations with dynamic lighting.

Nate, I read your posts here and the ones on java-gaming.org.
What I am looking for is a small shader tool, something like your executable jar file, only with the possibilty to feed it with my animation frames (diffuse and normal mapped).

So if anybody could give me a hint (or a tool) on how to test my normal mapped animations without needing java skills, I would be very thankful.

[Nate]

The little demo I did doesn't rotate the normals, so once an animation rotates images, the light is applied from the correct direction anymore.

Gallo has done a proper implementation for Unity:
viewtopic.php?f=7&t=2138
Getting it running might take some coding. Maybe he would provide a tool that loads any skeleton and normal map.

Have you seen Sprite Lamp?
http://www.spritelamp.com/
They are planning something with/for Spine. Worst case you could test out your static images with normals in Sprite Lamp.

[Deee]

I've had a look at Gallo's implementation some days ago and couldn't get anything to run, as I have absolutely no experience with Unity.

Of course I have heard about Sprite Lamp. And what I have seen so far looks awesome. However, if I get it right, you have to paint 4 lighting profiles for every frame of an animation. This sounds like a lot of work. Hopefully, Finn finds a way to integrate it with Spine.

On the rotation problem:
I guess, you are working with normal mapped body parts animated in Spine?
I considered doing that, too, but as you say, the light direction is lost when rotating images.

My idea is to go with depth mapped body parts.
As i am working with png sequences as an output format, instead of using runtimes, my approach is to render the "diffuse map" and the depth map of every frame separately (just using different images in the same animation) and process the depth maps into normal maps afterwards.

Currently, I'm doing that in CrazyBump, where I can also see a dynamically lit preview of one static image.
I made a small gif of really bad quality:
http://s.gullipics.com/image/z/q/9/7s9e ... ormals.gif

A small tool loading custom skeletons and normal maps would be awesome, just like the "spine player" you coded, only together with a shader. I'm definitely going to annoy Gallo with this request.

[Nate]

For Sprite Lamp you have to paint at least 2 lighting profiles, and they can be rough. When using it with Spine, you wouldn't paint them for each frame, you'd paint them for each image you attach to your skeleton.

I guess using a bump map wouldn't have the same rotation problems as a normal map? In that case maybe I could make my tool work for you.

[Deee]

Okay, I got into the Sprite Lamp alpha, and messed around with it like crazy.
You are right, painting lighting profiles only for the attachments should be enough, as they contain the depth information, not the normals.
Seems like you would have to paint 3 lighting profiles: horizontal, vertical and front, just like the channels of a normal map.
So I created a normal map from my depth map with CrazyBump, extracted the channels and fed them to Sprite Lamp, together with the fancy occlusion and specularity maps to see how it turns out in the Sprite Lamp Preview.
Check this out:
http://s.gullipics.com/image/y/9/i/7s9d ... review.gif

Yes, I think when using a bump map, the shader directly gets the depth information from the bump map. An implementation of this would be amazing.
In case of this being too much work, a version of your spine-libgdx-normals.jar accessing external images that can be changed, would also be a neat thing to play with.

[Nate]

Try this:
http://esotericsoftware.com/spine/files ... apTest.zip
Run it like this:

java -jar normalMapTest.jar path animation

Where path is the path to the skeleton JSON, diffuse atlas and normal image, and animation is the name of the animation (omit to use first animation). If both arguments are omitted, it is the same as running:

java -jar normalMapTest.jar spineboy/spineboy walk

This will use spineboy/spineboy.json for the skeleton JSON and spineboy/spineboy-diffuse.atlas for the diffuse atlas and spineboy/spineboy-normal.png for the normals.

Click/drag to set the skeleton position, mouse around to set the light position.

[Deee]

Nate, you are a genious!

Thanks so much for this amazing stuff!
I got it working and it is exciting.

I tried to make it a little brighter by adding a 50% gray background image to the root bone.
It still turns out kinda dark, and the light source seems to be behind some body parts (maybe I bumped the head too much), but seeing animated characters with dnyamic lighting is just crazy.
I made a small video:
https://dl.dropboxusercontent.com/s/qx2 ... ormals.mp4

I used normal mapped body parts just like you, so the rotation problem is still there.
In a second experiment, I cheated this by using only one bone, with pre-rendered animation frames attached to it. It looked a bit more realistic, but apart from being really bad pratice, it leads to huge atlases.

Thanks again, Mr. Sweet. This is really neat

[Nate]

Looks cool! Download it again, I added a little UI for you.

[Deee]

Wow, this is unbelievable. I have been playing around with it for hours. Thank you so much!
I will upload some more videos soon. Before that, my normal maps need to be fixed, as they appear to have an inverted Y-axis, so the light is not correctly applied.
Though Sprite Lamp's output seems to be the standard, normal maps produced by Photoshop and Gimp plugins seem to have an inverted green channel by default.

Anyway, your UI is just wonderful, maybe you could add an option to save the settings (just a simple checkbox to use the current settings by default)?

[Nate]

I made it save everything automatically, added a reset button and an invert Y checkbox so you don't have to change your normal maps. Just download it again.

[Deee]

Absolutely amazing work!
I can't stop staring at my screen

This is what the zombie pirate looks like with correct y-Axis normals:
https://dl.dropboxusercontent.com/s/h6f ... rmals2.mp4

[Nate]

Very cool stuff, lighting really makes a big difference.

[cparki3]

Hey guys,

I LOVE the examples here! I am curious how to get the same look transferred to Unity... Is there some specific shader I should be looking for. What steps are involved to take what I see in this demo and move it into my project?

Thanks!

[Søren]

Hey guys,

I LOVE the examples here! I am curious how to get the same look transferred to Unity... Is there some specific shader I should be looking for. What steps are involved to take what I see in this demo and move it into my project?

Thanks!

In Unity you can use the Spine Skeleton Lit shader. Recently the Unity runtime was updated you can see the details here https://github.com/EsotericSoftware/spi ... pine-unity

[jaimitoes]

hi I managed normal mapping and specular with Game maker studio:

with the engine´s function i make this but i don´t know if the lighting is correct(sorry for my english):



---




normals follow rotation