Creating a cross-platform wireframe shader [Unity/C# 🇬🇧 tutorial]

Поделиться
HTML-код
  • Опубликовано: 24 янв 2025

Комментарии • 37

  • @Rigdereine
    @Rigdereine Год назад +6

    Having been immersed in Unity for several years, I've consumed a multitude of tutorials. However, this particular one stands out as among the best in terms of its explanation and presentation.
    Exceptional work!

    • @minapecheux
      @minapecheux  Год назад +1

      Thank you so much for your nice comment, I'm super happy you found the tutorial interesting and helpful! :)

    • @Rigdereine
      @Rigdereine Год назад +1

      ​@@minapecheux
      Thank you for your kind words! I've been exploring more of your channel lately, and despite the shift away from Unity (given the recent decisions they've made, it's understandable), your newer content continues to be incredibly valuable. The quality and insights remain top-notch, making them definitely worth watching. I'm looking forward to seeing more of your analytical videos in the future and wish you continued success in all your endeavors.

  • @TheDemonking82
    @TheDemonking82 Год назад +2

    This tutorial made me actually purchase your shader guru book and the ai book also. So far very impressive.

    • @minapecheux
      @minapecheux  Год назад

      Thank you very much! (For the comment and for the support ^^)
      I'm glad you're enjoying the books so far, hope you'll learn some interesting things ;)

  • @Wasabiofip
    @Wasabiofip 5 месяцев назад +1

    Hmm I notice the A value of the split node is unused and that gave me an idea: since the vertex colors are RGBA values, we could actually use the A value as a "fourth color", so that we can support meshes whose graph is 4-colorable! Tried it out and it works.
    We don't actually use any of the RGB values of the "color" as colors, so it doesn't matter that the A is an "alpha" - its just another float in the vector, whose interpolation we can abuse to get barycentric coordinates. So now each vertex is either , , , or

  • @themanwithoutaplan9447
    @themanwithoutaplan9447 5 месяцев назад

    This was an absolute lifesaver! I can't thank you enough

    • @minapecheux
      @minapecheux  5 месяцев назад

      You're very welcome, I'm glad you liked it! And thanks for the comment :)

  • @JCD1313
    @JCD1313 9 месяцев назад

    Thank you for the inspiring idea to use barycentric coordinates and the shadergraph implementation to use them. In hindsight an obviouse because very fitting choice, but to get there i needed your help :).
    For the precomputation part I suggest one improvement: Store the coordinates in a seperate UV channel - no need for the intensive distribution process and even failsave, because you can assign different values to the same vertex on different triangles - so no conflicts anymore and no distribution algorithms.
    You saved me a lot of headaches!

    • @minapecheux
      @minapecheux  9 месяцев назад

      Heya - thanks for the comment, glad you liked the video and found it useful!
      And thank you for the suggestion, that's definitely an interesting idea :)
      Cheers!

  • @ScorpioServo
    @ScorpioServo 8 месяцев назад

    Excellent tutorial! Thank you very much!!

  • @KuzmaProDev
    @KuzmaProDev Год назад +1

    Life saver! Struggled with geometry shader on Quest 2 VR headset. Although it's declared as supported on that particular GPU, it just didn't work for me even with the trivial geometry shader.
    BTW, I separate triangles by duplicating vertices, it greatly simplifies vertex coloring.

    • @minapecheux
      @minapecheux  Год назад

      Glad it helped, thanks for the comment! :)

  • @sprucefruit
    @sprucefruit 6 месяцев назад

    I'm interested in rendering both sides of the mesh like at 16:45. Not super familiar with writing shaders. Do you have any leads for how to do this? Great tutorial, btw!

    • @minapecheux
      @minapecheux  6 месяцев назад +1

      Thanks, glad you liked it!
      To render both sides, you'll need to look into culling, and more specifically how to disable it :)
      I don't remember how to do it off the top of my head, but I think if you look for that on the net you'll find the option to add/set in the shader to get the right result!
      Hope it helps,
      cheers :)

  • @jussirautiainen3784
    @jussirautiainen3784 Год назад +1

    Yeah as the fellow below says after wathing about 30 seconds I got more useful and clear information than shuffling through hundreds of RUclips videos in the past week ...

    • @minapecheux
      @minapecheux  Год назад

      I'm super glad it helped, thanks for the nice comment! :)

  • @erikm9768
    @erikm9768 9 месяцев назад

    Great tutorial, it works really well. Would it be possible to make this work also for quads and not just triangles?

    • @minapecheux
      @minapecheux  9 месяцев назад

      Glad you liked it! Displaying quads is way harder and I'm actually not sure it's possible with this exact technique, because the whole point here is to colour your edges with 3 possible R/G/B values... so you can't really handle a 4th side ^^
      I haven't dived into this enough to tell you how to adapt it to the case of quads, sorry!
      Cheers :)

  • @TheDemonking82
    @TheDemonking82 Год назад +1

    Just wondering how I would implement this into a Vr project.

    • @minapecheux
      @minapecheux  Год назад

      Heya! Sadly, I'm not very experienced in VR :(
      I think pre-computing on the CPU would be too costly for VR, given the hardware constraints, but I also think the usual VR architecture support geometry shaders better than Macs, so perhaps you could go for the "normal" technique with geometry shaders?
      Cheers!

    • @KuzmaProDev
      @KuzmaProDev Год назад

      Described method works like a charm in VR.

  • @mikhailhumphries
    @mikhailhumphries 8 месяцев назад

    How would you only render quads and no diagonal or triangles?

    • @minapecheux
      @minapecheux  8 месяцев назад

      Heya! Sadly this technique only works for triangles, since we're using barycentric coordinates - we only have 3 "colours", 3 positions at maximum to define our faces! Perhaps there's a way of adapting it for quads, but I haven't looked into how...
      Cheers :)

  • @alfonsolafosse4611
    @alfonsolafosse4611 6 месяцев назад

    I've used this shader on a game of mine. I have built the game in unity and when running the exe the wireframe does not show. Does this shader not work on builds?

    • @minapecheux
      @minapecheux  6 месяцев назад

      Heya! Mmh I think it should work but to be honest I haven't tried it... sorry!
      I hope you'll find a solution,
      Cheers:)

  • @guy1477
    @guy1477 Год назад

    I enjoyed your tutorial of drawing a triangle outline with 3 colors. But I want to display one quad with 2 colors, I don't know how to modified the wireframe shader graph.
    red - green - green - red ===> quad outline (2 triangles, 4 vertices)

    • @minapecheux
      @minapecheux  Год назад

      Thanks, glad you liked the video! I haven't had the time to check it out thoroughly but, from what I know, the usual trick to getting quads is to "erase" the longest side of your triangles, which are the diagonals of quads... but honestly I'm not sure how cross-platform this can be ;)

    • @alfonsolafosse4611
      @alfonsolafosse4611 7 месяцев назад

      were you able to figure this one out im working on something at the moment and this shader works perfectly but I just need it in quads instead

  • @chopin1998
    @chopin1998 Год назад

    webgl not support... how can i show similar wireframe effect when platform is webgl?

    • @minapecheux
      @minapecheux  Год назад +1

      Heya! Well since I think you can't use geometry shaders either on WebGL, perhaps you should rather try and go for a screen-space edge detection (see here for some basic concepts on that: citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.93.9731&rep=rep1&type=pdf).
      This should work, although I admit I haven't tried it myself!
      Hope it helps,
      cheers :)

    • @chopin1998
      @chopin1998 Год назад

      @@minapecheux thank thee very much

    • @MeloMontoyaMX
      @MeloMontoyaMX 5 месяцев назад

      Got it to work for 1 object in WebGL, can't seem to be able to open the recommended link. Would appreciatte any info on that :p

  • @rommax9294
    @rommax9294 Год назад

    For some reason, this shader dont work after compiling build :(
    Any idea why this could be?

    • @minapecheux
      @minapecheux  Год назад

      Hello!
      Sorry, no idea at the moment :/
      But if you happen to find a reason, I'm super interested in getting the info!

    • @straybratt8795
      @straybratt8795 Год назад

      ​@@minapecheuxfound the reason, it's the unity editor onvalidate function in the meshwireframecomputor.cs being the only thing calling the update. i made a manager script that finds all the objects with that script attached, and updates them all at runtime instead

    • @Mendez16289
      @Mendez16289 Год назад

      Check ProjectSettings -> Player -> OtherSettings -> Optimize Mesh Data is not enabled. Also on the MeshWireframeComputor script I had to add a call to UpdateMesh() on Start