Pixelation

General => General Discussion => Topic started by: Alex Sinigaglia on February 13, 2015, 10:16:40 am

Title: [Tool] 3D to 2D Blender Pixel Shader
Post by: Alex Sinigaglia on February 13, 2015, 10:16:40 am
http://www.cgchannel.com/2015/02/this-free-blender-shader-turns-3d-models-into-pixel-art/

Quote
Free Blender shader turns 3D models into pixel art
(http://www.cgchannel.com/wp-content/uploads/2015/02/150210_BlenderPixelArtShader.jpg)
Japanese artist Toshihiro Kushizaki has released the Pixel Art Shader: a free Blender shader that should convert any 3D model into old-school pixel art.

To render out a pixel art image, you just need a 3D model in .x format and a palette texture, which defines the set of colours to be used; but you can augment the result with standard texture maps, even including AO.

The image is generated in BMP format, and the results look pretty good, at least in the demo scene.

There’s a detailed online manual (https://translate.google.com/translate?act=url&depth=1&hl=en&ie=UTF8&prev=_t&rurl=translate.google.com&sl=auto&tl=en&u=http://kushi.lv9.org/pixelartshader/manual/index.html), but like the rest of Kushizaki’s site, it’s in Japanese, so if you’re a non-Japanese-speaker, you’ll need to navigate Google Translate.

Download the Pixel Art Shader on Toshihiro Kushizaki’s website (https://translate.google.com/translate?sl=auto&tl=en&js=y&prev=_t&hl=en&ie=UTF-8&u=http%3A%2F%2Fkushi.lv9.org%2Fpixelartshader%2Findex.html&edit-text=&act=url) (Automatic English translation)

Read an English-language user-contributed tutorial on using the shader. (http://initialsgames.com/main/?p=1360)

Other examples:
(http://initialsgames.com/main/wp-content/uploads/2015/02/andre_gold.gif)
(http://initialsgames.com/main/wp-content/uploads/2015/02/andre2.gif)
(http://initialsgames.com/main/wp-content/uploads/2015/02/2015-02-13-11_51_57-Blender_-E___Files_PixelArtShader_v1.0.0_andre_src_sample4.blend-copy.png)
(http://lesterbanks.com/lxb_metal/wp-content/uploads/2015/02/20141111_anim.gif)

I didn't see this posted here, so here it is. As always, please move, merge or delete this topic if it already exists or is in the wrong place.

I guess there already are tools that can make this happen.
Still, give it a try if you're interested and skilled with Blender.
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: Kazuya Mochu on February 13, 2015, 11:04:24 am
I saw this pop up on facebook. It looks really cool and its by far the best pixelated 3d I've seen.

the only issue with 3d and pixel art is that 3d is very rigid when it comes to animation.
I had a try and replicating this using 3dsmax and did something slightly cool, but nothing as good as this. kudos for the developer!
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: wzl on February 13, 2015, 11:34:30 am
I found interesting what they did with guilty gear xrd (https://www.youtube.com/watch?v=O8Hmyy0m6Q8) It probably doesn't qualify as pixel art, but it shows some nice handling of animations. They for one thing don't interpolate between keyframes to keep the oldschool frame-based animation feel to it. To compensate they added the effect/blur trails(?) as an extension to the mesh.
When i'm looking at it i'm still pondering whether thats actually 3d until the camera starts to orbit around the characters. It's impressingly well made.
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: Kazuya Mochu on February 14, 2015, 12:51:22 am
This is what my experiments got me. no antialiasing on the render and used a gradient ramp on the diffuse, set to follow the light direction
(https://fbcdn-sphotos-c-a.akamaihd.net/hphotos-ak-xpa1/v/t1.0-9/10994337_928722223819248_2609166824251964848_n.jpg?oh=f96eb734e3a34843265bcd8a1ca6a5fc&oe=558B0858&__gda__=1431006176_65387134953a4ee6f6cffe1ceca2a7be)
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: lachrymose on February 14, 2015, 01:17:39 am
So like, could I use this to avoid learning to animate?  :crazy:
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: Kazuya Mochu on February 14, 2015, 01:36:54 am
animation is animation. 2d or 3d. they just look slightly different because of the technical aspects, but they are base on the same fundamentals
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: Ai on February 14, 2015, 01:50:04 am
So what is the advantage over my standard pixel-art method with Blender (which is just: Use diffuse ramps with hard edges, use either no speculars or specular ramps with hard edges; turn off antialiasing)?
All I can see so far is that perhaps it works better with multicolor layered textures.

EDIT: Examples of the results of my methods: 1 (http://i.imgur.com/K4xXhpu.png) 2 (http://i.imgur.com/lF5A2bY.png)

EDIT2: This (https://translate.google.com/translate?act=url&depth=1&hl=en&ie=UTF8&prev=_t&rurl=translate.google.com&sl=auto&tl=en&u=http://kushi.lv9.org/pixelartshader/manual/index.html)
gives some vague clues as to what is going on beyond what base Blender does.

Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: PixelPiledriver on February 14, 2015, 03:04:50 am
Looks pretty cool.
Lethal League (http://lethalleague.reptile-games.com/) used a similar process and it looks nice.
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: Conzeit on February 17, 2015, 02:00:29 am
this doesnt really look that interesting to me, it looks like a celshade script that is focused on not creating too many jaggies....(I guess there's some pallete going ons from Kazuya's post?) what I really want to see is someone tackle open source-ifying what they did with Guilty Gear Xrd. it has so much potential for doing pixelarty stuff.

there was a part about using normal maps (or something to that effect, I dont really 3D yet so I dont have perfect langauage :p) to tell the program to shade things differently from what the geometry would suggest. They used it to make very pixelarty things, what they did with the hilights of May's anvil thing struck me as specially full of potential.

I REPOST THIS SHIZNIT AGAIN BECAUSE I THINK EVERYONE SHOULD HAVE FLIPPED OUT OF THEIR MINDS AND NOBODY DID!! FSDADSDSADA

the english transcription of the GGXRD behind the scenes interview thingy.
http://www.polycount.com/forum/showpost.php?p=2099538&postcount=229
http://www.polycount.com/forum/showpost.php?p=2107579&postcount=241

original article
http://www.4gamer.net/games/216/G021678/20140703095/
http://www.4gamer.net/games/216/G021678/20140703095/index_2.html

*cast spell on 3d experts of the forum so they flip out about this shit and make a big fucking community activity out of creating some mad script maggiks that make it really easy for a 3d moron like me to do this kind of shit*
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: Ai on February 17, 2015, 03:03:31 am
Quote from: Conceit on February 17, 2015, 02:00:29 am
this doesnt really look that interesting to me, it looks like a celshade script that is focused on not creating too many jaggies....(I guess there's some pallete going ons from Kazuya's post?) what I really want to see is someone tackle open source-ifying what they did with Guilty Gear Xrd. it has so much potential for doing pixelarty stuff.

there was a part about using normal maps (or something to that effect, I dont really 3D yet so I dont have perfect langauage :p) to tell the program to shade things differently from what the geometry would suggest.
That would be a normal map if it had anything to do with normals ;). I guess the right thing to call it might be a shader input texture -- a texture that the shader uses, that isn't directly displayed in any normal sense.

Quote
They used it to make very pixelarty things, what they did with the hilights of May's anvil thing struck me as specially full of potential.
It's an anchor, no? Kind of different from an anvil :)

Quote
the english transcription of the GGXRD behind the scenes interview thingy.
http://www.polycount.com/forum/showpost.php?p=2099538&postcount=229
http://www.polycount.com/forum/showpost.php?p=2107579&postcount=241
Hey, that's really interesting.
It has some things in common with Paperman IMO.
I think you could do most of that stuff using Freestyle in Blender.

Looking at the things in detail, you have:
* line thickness info in Alpha channel of vertex color
* ambient occlusion in Red channel of vertex (since it's using a cel shader, this is functionally just an offset for the light/dark threshold )
* separate ambient occlusion layer also in Green channel of control texture (used to make areas always shadowed or always lit)
* Specular size and intensity in B and R channels of control texture
* SSS color is a separate texture, nothing complex there.
* Vertex color Green and Blue channels are ignored.

The axis-aligned textures are really weird, honestly. I understand how it works but it's gonna be a pain to get the angles working how you want.

I'd like to hear more about the bone system for the face, personally -- I suspect that they automatically manipulate the bones relative to the camera normal so that the geometry looks sculpted for whatever perspective you are viewing it at. (in addition to the normal animation keying they refer to in the second translated article)

Bone scaling in 3d -- not sure I know of any other system that does this out of the box. It's obviously very useful for exaggerated movements. Not sure how to do in Blender.

The mentioned postprocessing effects are definitely doable in Blender, not sure how to make them make sense in relation to pixel art though.
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: Conzeit on February 19, 2015, 04:16:37 pm
I'm glad you think it can be done (freestyle? you mean no extra coding?) in blender.

LOL it'd be pretty funny to have someone fight with an anvil XD dunno what I was thinking.

The artist made ambient occlusion on the R channel of vertex (that's what I was confusing with normal maps, probably because it's displayed as a grayscale texture :p) is what interests me most, this one trick is what takes this game from regular crappy fake celshading to something that can really stand next to hand drawn celshading.
Not sure about the ambient occlusion they store on G channel, self-shadowing tends to help bring volume, for example look at later KOF sprites. XI does it a lot
Quote
Vertex normals are adjusted to simplify the light response and eliminate small scale polygonal shadows. Apparently the export from Softimage to UE3 automatically regenerated normals so they had to rewrite it. Faces were adjusted by hands, other parts by transferring normals from proxy objects, with the examples of Sol's pants (http://www.4gamer.net/games/216/G021678/20140703095/screenshot.html?num=060) or character hair in general (http://).
I dont really understand this part but I *think* "simplify the light response and eliminate small scale polygonal shadows" means they're eliminating more micro-self shadowing? this seems smart if it helps create the celshading they did.

The line thickness variation is great  (at alpha channel of vertex?), I would've probably exagerated it more. Specially interesting is the part that they map the how much it scales with the camera (green channel of vertex) All sorts of scaling with camera seem very pixel relevant, just like smaller res sprites tend to have bigger heads to fit expressions (that they swap to more super deformed head models on zoom out sems relevant too).

Quote
Basically on a lit surface the response will be something like (light color + ambient color) * texture color, while in shadow the response is ambient color * texture color * SSS color, so you can tint the shadows.
Defining shadow color defintively seems useful what with all our hueshifting and all. (http://www.4gamer.net/games/216/G021678/20140703095/screenshot.html?num=083)

I'm just now realizing that the gradient map of this 2dBlender Pixel shader plus this trick for defining shadow color would be really cool, you get  two ramps for the shading to go down.

Very much like the Street Fighter 3 faking of ambient lights.
(https://i.imgur.com/zNvd5Ai.gif) (https://i.imgur.com/Y81hShK.gif)
look at how on the lit parts of ibuki and Leo here the darkest tones are orange, while on the darkened parts the darkest tones are a different hue (blue for ibuki purple for Leo)

I'm having a hard time finding the specular stuff that I liked about May's anchor...hm =/ it's probably just what they illustrate with  I-no's image (http://www.4gamer.net/games/216/G021678/20140703095/screenshot.html?num=071), in wich they use the ILM texture and R is specular intensity, B is specular size. but the way it looks  here

 really sells me on animeish hilights.

BTW I know what R,G,B and alpha channels are, I have a somewhat vague idea of what vertex shading is, but I have no idea what a vertex texture is, or a control texture or SSS texture is a ILM texture for that matter.

definitively agree about the bones in the face. I think they either had even more swappable heads, or they just deformed the mesh to benefit each predefined shot for the cutscenes, and for regular ingame view just assumed regular sidescroller point of view. kind of like Meindbender does with their stuff.


There's a rigging demostration of it on vimeo (https://vimeo.com/22844101) =)

and people have replicated it on blender =)



Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: PixelPiledriver on February 19, 2015, 05:28:15 pm
Just wanted to jump in and blather a bit.

Quote
I have a somewhat vague idea of what vertex shading is
Vertex Shaders are passed data from vertices.
Then each vertex is processed, one at a time.
Some of the data is then passed to the Pixel Shader.
Each pixel is then processed using the data passed from the vertex shader, and then a single color is returned as the result in (r,g,b,a) format.

The entire process could just be called a Shader.
But you could also call it Vertex Shading.
Fact is you cant draw a single pixel without a vertices in the shader pipeline. --> in general :blind:
It's just built that way.

Quote
but I have no idea what a vertex texture is, or a control texture or SSS texture is a ILM texture for that matter.
SSS texture = Sub Surface Scatter (http://en.wikipedia.org/wiki/Subsurface_scattering) texture
ILM = probly Illumination Texture for glowy stuff

Not too sure about control texture or vertex texture.
I'd have to see the context.
But in general you can pass in textures as any sort of data.
The colors they represent are used to process a calculation of sorts, so they could be really anything at all.
You could have a fade texture, a blur texture, a y axis texture, an x axis texture, a daylight texture, etc.
I once wrote a shader that passed in positions of items in the level as a texture.
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: wzl on February 19, 2015, 06:08:11 pm
Quote from: PixelPiledriver on February 19, 2015, 05:28:15 pm
Fact is you cant draw a single pixel without a vertices in the shader pipeline. --> in general :blind:
It's just built that way.

you can use Points or Line/LineStrips though. Efficiency is a different matter though :P
And those too are routed through the shader pipeline.
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: Ai on February 19, 2015, 11:35:35 pm
Conceit, you should definitely check out Blender's Freestyle functionality since you are interested in what they are doing here. eg. Google images (https://www.google.com.au/search?q=blender+freestyle&tbm=isch) shows a good variety of different effects achieved by freestyle. You can see cel shading is fairly popular. Every so often somebody posts an anime-style cel-shaded character using Freestyle on the Blender Google+ page.

What PPD has said is accurate, but if you really want to get a sense of how it works I suggest you do at least a little experimenting with weight-painting to see how the values blend and how you are limited by the color being per-vertex.

If you don't understand the vertex normal discussion very well,, you definitely could benefit from more 3d experience. I guess that the adjustment they perform might be considered as a type of selective 'sharpen' filter in terms of 2d imaging .. making the normals of adjacent faces differ more so that light will tend to light up one or the other but not both. IIRC there are existing 'filters' to apply this kind of adjustment to a mesh in blender, but usually they adjust the actual mesh, not only the normals.
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: PixelPiledriver on February 20, 2015, 07:07:17 pm
Quote
you can use Points or Line/LineStrips though. Efficiency is a different matter though :P
And those too are routed through the shader pipeline.
You called my "in general" bluff.  :blind:
I wanted to imply there are more layers to the topic without actually talking about them.
However, just to return volley:
How are points and lines defined?
Verts.
 :o


Also here's some great examples for understanding the potential benefits of modifying normals.
http://wiki.polycount.com/wiki/VertexNormal
Title: Re: [Tool] 3D to 2D Blender Pixel Shader
Post by: lachrymose on February 28, 2015, 03:38:59 pm
Tried to use the shader, won't render the pretty geometry. All I get are black frames.
Whats everyone running on? Trying to narrow things down. I'm running Win 8 64bit, AMD GPU.

Edit: After more reading around...AMD cards are indeed the problem.