Home Technical Talk

Wireframe only shader for UDK

polycounter lvl 19
Offline / Send Message
TorQue[MoD] polycounter lvl 19
Hey all,

So does anyone know how you would go about making a shader similar to this for UDK
wireframe.jpg

Where its an edge detection effect that shows every edge of a mesh and everything else inside the edges is transparent so you can have objects that are textured with single colors? Basically I just want to be able to turn on the wireframe of a mesh but also display the texture underneath.

The Sobel Edge Detection shader doesn't show every edge at all times and neither does Polycube's shader http://polycube.blogspot.ca/2010/03/udk-edge-detection-shader.html

Replies

  • James Ordner
    You could try baking the UV outlines into the diffuse texture, or store the UV outlines in the alpha channel of a texture to edit as you will.
  • Butthair
    Offline / Send Message
    Butthair polycounter lvl 11
    UDk has one,
    http://udn.epicgames.com/Three/DevelopmentKitGemsSobelEdgeDetection.html

    It's simlar to the polycube linked one, but it might be a worth looking into because you can change the little things like edge contrast, thickness, depth control. Scroll near the bottom to see some variations it can achieve. Also, at the very bottom should be the .zip file so you can check it out.

    But I dunno if that's what you're looking for, so maybe this link would be helpful. http://blog.environmentartist.com/?p=724
    It talks about what your asking about, render a scene with wireframe.
    Sorry I couldn't be more help, :P.
  • Ace-Angel
    Offline / Send Message
    Ace-Angel polycounter lvl 12
    Nope, what James said is pretty much the cheapest and easiest solution, bake your UV's and apply them to your model. That shader is just what it name implies, "Edge Detection", it's not a wireframe, poly or anything else shader.

    You can use the technique that Jeff is showing, but it will show your models triangulated, so your mileage may vary in that case.

    Why not show off your wire-frames in your separate App like Max or Maya and use UDK for beauty shots only?
  • System
    Offline / Send Message
    System admin
    theres a wireframe option in the material. in fact in the engine folder there is already a material named wireframe or something set up.
  • TorQue[MoD]
    Offline / Send Message
    TorQue[MoD] polycounter lvl 19
    Thanks guys. Yeah, the wireframe material has the downside of triangulation. I'm actually thinking this might be a really cool visual effect for a game actually. I'm not trying to show off wires for a portfolio.

    @James - That has the downside of requiring a really high resolution diffuse texture/material if you want to do that otherwise it looks really aliased.

    @Butthair - Really? Butt hair? That's almost as bad as Ben Mathis' alias :P
    Yeah I already mentioned Sobel Edge Detection in my fist post. Its not quite what I want. That video you linked me to though is actually the closest thing to what I want. Just really sucks that it will be triangulated geometry... doesn't look as clean. And it would be nice to be able to thicken the edges. I might just go with the baked wireframe. Was just hoping that you could do it with a shader because that way you don't have to have high resolution textures and a ton of unique islands in your UVs for high poly models.

    @Ace - the above points are why this actually isn't the cheapest or easiest solution. Not to mention its more time consuming than a shader would be.

    @Chris - thanks, you said in one sentence what Butthair's video link said in 5 mins :P

    Is there not some way to tweak either the Sobel shader or Polycube's to make it detect every edge not just the outer ones? The screenshot above is actually my model inside p3D.in with shader set to shaderless and wire - http://p3d.in/14nNM/wireonshadeless

    I guess there's no way to force the engine NOT to triangulate geometry is there? lol
  • TorQue[MoD]
    Offline / Send Message
    TorQue[MoD] polycounter lvl 19
    So I tried playing around with Sobel Edge. Its definitely a great edge detection shader but I'm just wondering why you can't (or how you can) control the edge tracing. Is there a way to tell it to get more or less edges?
    Sobel_edge.jpg

    For example, looking at this image, notice that its not even tracing completely around the character's hand. Any idea why this is or how I could increase it? I've tried adjusting the min/max distance and that didn't change anything.

    The scene depth node looks to just be setting up the maximum depth, not a minimum.
  • Neox
    Online / Send Message
    Neox veteran polycounter
    put more contrast in the zbuffer

    to understand whats going on in there open up an image with an according zbuffer in photoshop

    like this

    http://www.ixbt.com/divideo/ae-plugins/3d.jpg
    http://www.ixbt.com/divideo/ae-plugins/zbuffer.png

    put the zbuffer on top, duplicate it, blur it by X pixels and set its layermode to difference, this is how the outline is created. you can multiply the result with your rendered image. If stuff fades away its basically just a lack of information in zbuffer
  • TorQue[MoD]
    Offline / Send Message
    TorQue[MoD] polycounter lvl 19
    Ok thank you Neox for pointing that out. Though there's another problem now...
    edges_character.jpg
    edges_landscape.jpg
    If I want the character to look fully outlined, I have to really lower the max distance and up the contrast but this makes the landscape look terrible.
    The other way makes the character outline disappear completely though raising the contrast to 64 will bring it back, it still only goes to the hips and then introduces more artifacts on the landscape.
    edges_medium.jpg

    Is there a way to do the character and the environment in a separate pass?
  • Neox
    Online / Send Message
    Neox veteran polycounter
    are you sure your math is right? :O
    back in the days when i did it for airborn it worked way better, besides i couldn't antialias it without gazillions of instructions, which made it look pretty bad. i never had such a result.
  • TorQue[MoD]
    Offline / Send Message
    TorQue[MoD] polycounter lvl 19
    I'm not the one who did the math. This is using the Sobel Edge detection shader from Epic. With the default settings, I got a similar result to the first screen. I figured this was just the default draw distance for the edge detection and the fact that landscape is really high res. I had to set the max distance to 134217728 in order to get the landscape cleaned up but that's when I noticed that pushing the max distance up that high - its a really large landscape piece. A bit larger than 128000 units squared- caused the edge detection around the character to disappear. Your suggestion of increasing the contrast is how I was able to get it back, but the higher the contrast, the more the landscape mess comes back. Also its strange that the minimum distance has no discernible effect. I always take a before and after screenshot so I can compare the differences as a lot are subtle but the minimum doesn't change anything - even if I push it up to a really large number like 2048.
  • System
    Offline / Send Message
    System admin
    www.chrisperrella.com/ftp/celshade/CelShade.zip

    try this one, pretty sure you can instance it and control the edge highlighting if i remember correctly, its been a couple years.

    basically the same thing with a few different calculations... again i cant remember and cba to look at the epic page right now
  • TorQue[MoD]
    Offline / Send Message
    TorQue[MoD] polycounter lvl 19
    Chris you're my hero! This is a much better setup... here's a comparison:
    shader_compare.gif

    Are you okay with us using this for our game provided we give you credit of course?
  • System
    Offline / Send Message
    System admin
    of course :P i wouldnt have given you the link if i minded haha
  • Autocon
    Offline / Send Message
    Autocon polycounter lvl 15
    With so many people who work at Epic reading PC all the time how do they not know we ALL want a wireframe mode in UDK that isnt that shity see through thing they have?

    Flat shaded, no transparency wireframe in the next unreal engine please epic :)
  • TorQue[MoD]
    Offline / Send Message
    TorQue[MoD] polycounter lvl 19
    @ Chris - You are officially my hero then (before it was unofficial)

    @Autocon - LOL I guess I'm not the first one to ask about this. Yeah the problem with the wireframe material is that you have to double all of your scene geo in order to get it to work. I was thinking it might look really cool to make a game with plain colors and wireframe, but its really no feasible if you have to do it via a material.

    Now I'm just going with a cartoon look...
    JF_ToonShaders.gif
    what do you guys think? Which do you think looks the best?
  • System
  • TorQue[MoD]
    Offline / Send Message
    TorQue[MoD] polycounter lvl 19
    ha ha. That's literally what everyone else has said :) I think I'll try to do a blend of the two. One is a bit dark and 3b is a bit bright.
  • aaron2
    I use one UVset to map the main shapes and lines, as well as details. I use a 2:1 ratio texture, because that way I can fit more tiling strips.
  • TorQue[MoD]
    Offline / Send Message
    TorQue[MoD] polycounter lvl 19
    aaron2 wrote: »
    I use one UVset to map the main shapes and lines, as well as details. I use a 2:1 ratio texture, because that way I can fit more tiling strips.

    You mean to get the wireframe effect working? I'm lost on what exactly you're talking about.
Sign In or Register to comment.