Any ideas on how to accomplish this image style?

[hashbrown]

I’m trying to accomplish this style of rendering:

I made it in Blender with the following steps:

• Frame Size: 128x128px
• Used Blender’s toon shader called (Free Style)
• and then scaled the image back up.

Is there anyway I can accomplish the same effect with GLSL? Where I draw the image in a small frame, not use anti-aliasing, and then scale it back up so I get that “pixelated” effect?

I have book that shows me how to write a toon shader, that’s not a problem. I’m just not sure if drawing in a small frame and then scaling up like I did in Blender is the solution, and if it is…I have no idea how to do that.

[Silence]

@hashbrown;1284096

- Used Blender’s toon shader called (Free Style)

You answered your question yourself

Check for toon shader, or cel shading in google. There are plenty of examples. This one for example.

[hashbrown]

[QUOTE=Silence;1284100]You answered your question yourself

Check for toon shader, or cel shading in google. There are plenty of examples. This one for example.[/QUOTE]

Thanks for the answer I got the toon shading handled, but what I don’t know is how to draw to a smaller frame and then scale the final image up so it looks like the final image sample I shared in the opening thread. Don’t know what to look for.

[PLeLuron]

Use FBOs; they are basically off-screen render targets. Use one smaller than your window dimensions and use the resulting texture on a fullscreen quad.

[john_connor]

i made a code example (calling it “tutorial” would be overstated, there is VERY little description) for a simple renderer

john.87.connor - Tutorial 04.2: Framebuffer Size

the solution is:
– render your scene into your own framebuffer (using texture attachments)
– then copy the rendered image into the “default framebuffer” (of the window) by calling glBlitFramebuffer(…)

glBlitFramebuffer(
    0, 0, m_width, m_height,           // source area
    0, 0, windowsize.x, windowsize.y,  // destination area
    GL_COLOR_BUFFER_BIT,               // buffer bitmask
    GL_NEAREST);                       // filter parameter

if you want to have that “pixelated” effect, use GL_NEAREST as filter parameter

[hashbrown]

[QUOTE=john_connor;1284104]i made a code example (calling it “tutorial” would be overstated, there is VERY little description) for a simple renderer

john.87.connor - Tutorial 04.2: Framebuffer Size

the solution is:
– render your scene into your own framebuffer (using texture attachments)
– then copy the rendered image into the “default framebuffer” (of the window) by calling glBlitFramebuffer(…)

glBlitFramebuffer(
    0, 0, m_width, m_height,           // source area
    0, 0, windowsize.x, windowsize.y,  // destination area
    GL_COLOR_BUFFER_BIT,               // buffer bitmask
    GL_NEAREST);                       // filter parameter

if you want to have that “pixelated” effect, use GL_NEAREST as filter parameter[/QUOTE]

This is perfect, exactly what I was looking for, thanks!