PIXELART EFFECT IN UNITY | BASIC TUTORIAL - NO SHADERS

Поділитися
Вставка
  • Опубліковано 3 жов 2024

КОМЕНТАРІ • 127

  • @fuyuan822
    @fuyuan822 3 роки тому +19

    It's like learning stuff while watching a good comedy. Double efficiency! Great!

  • @JariobBroost
    @JariobBroost 4 роки тому +25

    Amazing concept. Can't wait to see the advanced versions!

    • @Madalaski
      @Madalaski  4 роки тому +4

      Your wish has (finally) been granted: ua-cam.com/video/Z8xB7i3W4CE/v-deo.html

    • @JariobBroost
      @JariobBroost 4 роки тому +2

      @@Madalaski Watch this drag me back to developing my game (with a vengeance)

    • @Madalaski
      @Madalaski  4 роки тому +2

      @@JariobBroost Muhahahahaha, yes my plan all along was for you to be fulfilled and successful in your endeavours.

  • @flameprincess7313
    @flameprincess7313 4 роки тому +14

    You're the funniest Unity developer youtuber I've seen yet 😂

    • @Madalaski
      @Madalaski  4 роки тому +1

      Oh damn, thank you. You're the best character in Adventure Time so that's something.

    • @Vermoctus
      @Vermoctus 3 роки тому +1

      True!

    • @subwaye
      @subwaye 3 роки тому +1

      @@Madalaski lol

    • @rasengo6026
      @rasengo6026 3 роки тому

      Dani be like

    • @dylan85guy
      @dylan85guy 3 роки тому

      @@rasengo6026 milk gang confirmed

  • @quacktalk3792
    @quacktalk3792 3 роки тому +3

    I really like how you ended the video, it sums up well what it means to us too.

    • @Madalaski
      @Madalaski  3 роки тому

      Haha, well I had been debating even making the video series for a while. But I'm glad I did!

  • @elektra81516
    @elektra81516 4 роки тому +9

    Wow I thought the camera method was the only way, the SRP method is certainly something I'll look forward too, reminds me a lot of Prodeus which is also being developed in Unity. Very informative and funny, have a sub!

    • @Madalaski
      @Madalaski  4 роки тому +1

      Oh dear, oh god, why does noone have any good tutorials on SRP?

  • @12edcorea54
    @12edcorea54 3 роки тому +1

    I like your channel because it's so cool. I am developing a game in Korea. The main focus is the network, but it was a great help to the game I made as a hobby. Thank you to you and your video content. be happy forever

  • @E-nfileexe
    @E-nfileexe 2 роки тому +3

    This is what im trying to achieve....but XD
    Im not smart or experienced enough to keep up with your speed of explination
    how do I make a Camera that doesnt render anything?
    And apply the Ui to that camera?
    cause my game already has a ui on it
    I cant keep up and its confusing and complicating things for me XD
    I was kinda hoping that there would have been a basic Post Processing way of doing this instead of something.....at least this conplicated.
    I want my entire game and all the models, that are on their own layers for different interactions, to be pixelated. But not my ui XD
    and......cause im not good at math or coding. No coding either XD
    but it was very enjoyable to listen to and watch
    you do have a very fun way of explaining things

  • @davidcox941
    @davidcox941 3 роки тому +9

    Comedy is great, but fuck me this is hard to follow as a beginner. I'm pausing nonstop and frame by frame nudging trying to keep up where you're going in the menus as there's a lot of quick snaps and zoom in so I can't really grab context of what asset properties I'm tweaking. I got to the code part and was like "where is this being applied? What file is this?!?". I've watched the beginner to advance tutorials and while I'm very entertained, I feel like the actual walk through parts need more hand holding and explanation, it just has so many gaps that are easy to get lost on. I REALLY wanna learn this effect for a game idea and this is the only tutorial series that seems to have an answer and it kills me I can't even get through the Basic part T_T.

    • @Madalaski
      @Madalaski  3 роки тому +2

      Hey there. Sorry to hear that you're finding the tutorials hard to follow. I'd recommend going into the description as I have easier to follow Step-by-Step instructions that should save you a lot of time and stop you from getting lost. As well as this, I have provided the code in an example project so you can download that and examine the code for yourself which I highly recommend if you're a beginner. This is true for all my tutorials.
      Overall, I make these tutorials fast and cut down on a lot of fluff so I don't waste anyone's time though, yes, I do design them around my own assumptions of knowledge as a Unity developer of about 6 years and that can be rough for a beginner. I'll try and keep my camera shots more succinct in the future, though I likely won't stop more often and be more hand-holdey around beginner concepts because I'll only be repeating what 1000s of other tutorials have explained, 1000x better than I ever could.
      In case you haven't come across them though, here are some of the best beginner tutorialists that I've known over the years:
      ua-cam.com/users/Brackeys
      ua-cam.com/channels/LyVUwlB_Hahir_VsKkGPIA.html
      ua-cam.com/channels/R35rzd4LLomtQout93gi0w.html
      ua-cam.com/users/SpeedTutor
      Whoops sent this message a bit earlier than intended, sorry if there are any spelling mistakes. If you still need anything specific explaining, just say the world and I'll be happy to help you out!

  • @ZaccoOfficial
    @ZaccoOfficial Рік тому +1

    This video is perfect! You seem to know a lot about what you're preaching, and not only that, you're funny about it!

  • @yuanchiu1512
    @yuanchiu1512 4 роки тому +2

    Damnn dude, I've been waiting for such a tutorial! Thank you!

    • @Madalaski
      @Madalaski  4 роки тому +1

      Thanks! I try to make tutorials about things no-one normally covers. Tell me if you've got any suggestions!

    • @yuanchiu1512
      @yuanchiu1512 4 роки тому

      Madalaski Will do

  • @IndieGamesWTF
    @IndieGamesWTF 8 місяців тому

    Interesting the outline after pixelation!

  • @matthewwinchester4396
    @matthewwinchester4396 3 роки тому +1

    This is really clever. Helped me a lot. Thanks!

  • @Doctor_XI
    @Doctor_XI 2 роки тому +1

    this is a lifesaver, thank you so much!

  • @crunch.dot.73
    @crunch.dot.73 2 роки тому +2

    This is really helpful actually, thank you!

  • @titlehere2969
    @titlehere2969 2 роки тому +1

    Thanks for the help❤

  • @JacksonAcademy1
    @JacksonAcademy1 3 роки тому +2

    UE5: Realtime Lighting + Nanite.
    Unity:

    • @Madalaski
      @Madalaski  3 роки тому +1

      Don't tempt me, I'll do it on Unreal too 😑

  • @Neceros
    @Neceros 4 роки тому +6

    Make more videos. More. I must learn.

    • @Madalaski
      @Madalaski  4 роки тому +4

      It's your funeral dude.

  • @EvilDogProductions
    @EvilDogProductions 2 роки тому +1

    Very cool!

  • @TheeCelestial
    @TheeCelestial 2 роки тому

    Nice work bro. Keep going!

  • @pommpeii
    @pommpeii 3 роки тому

    this is underrated

  • @subwaye
    @subwaye 3 роки тому +2

    Your voice makes me want to subscribe xd

  • @s4nzyG
    @s4nzyG 2 роки тому

    OMG this is so cool!

  • @KavYT
    @KavYT 4 роки тому +2

    really entertaining but difficult to follow :< 1:41 i dont know what or where is "here" to drag the texture to and cant figure out what it is when its zoomed in

    • @Madalaski
      @Madalaski  4 роки тому +1

      My bad. It's actually uninterrupted footage it's just Unity unlocks a bunch of extra settings which offset the actual location where I dragged it. It's the "Output Texture" field on the Camera. I put steps in all my video descriptions so you can follow those instead, if the video's too quick. Glad you found it entertaining :)

    • @KavYT
      @KavYT 4 роки тому +1

      @@Madalaski Thanks! ill give it another go. I really appreciate the reply

  • @kentkather4805
    @kentkather4805 2 роки тому

    I came back after 2 months and im ready to try and understand the video

  • @PVR_Official565
    @PVR_Official565 2 місяці тому

    wheres the output thing I drag the render texture onto?

  • @ipotrick6686
    @ipotrick6686 3 роки тому +2

    why dont you just make the rendertexture like 1/4 res and render the pod, then merge the the render texture with the main renderbuffer. should look the same but is much faster with a lot less code

    • @Madalaski
      @Madalaski  3 роки тому

      Check out my Intermediate tutorial which details this! You run into trouble with the Depth Buffer (which I address in the tutorial) and Transparents (which I address in the further Advanced Tutorial). This version was to get the basic concepts down for a fast, simple way of doing the effect for one object.

  • @Good_Minso
    @Good_Minso Рік тому

    cool video, and RIP to all of those who left

  • @MondoMurderface
    @MondoMurderface 2 роки тому +1

    or.. call me crazy.. Attach the camera and plane to the teapot and have the camera and plane always look at your camera. Invert the camera aim at the teapot obviously. btw I've done this for years to make fake pixel characters. You can even toss in a script to disable the camera now and then to lower the frame rate and make it really look like a voxel.

  • @mingesack5606
    @mingesack5606 3 роки тому +1

    That intro alone is enough to make me shut up and listen

    • @Madalaski
      @Madalaski  3 роки тому

      Yeah people seem to think it's self-deprecating but, like, who else you gonna listen to? Some sort of "qualified" person?

  • @diabloflp
    @diabloflp 2 роки тому

    im curious about doing performance tests on it

  • @EpicBlackflame07
    @EpicBlackflame07 Рік тому +1

    Where is layers? can you make a more in depth tutorial that isn't zoomed in on everything?

  • @JohnDoe-pk8lc
    @JohnDoe-pk8lc 3 роки тому +1

    I believe the new retro fps Prodeus used a similar concept for its objects

    • @Madalaski
      @Madalaski  3 роки тому

      Well I can tell you they definitely did not get the idea from me...

  • @MotionMenace2
    @MotionMenace2 3 роки тому +1

    anyone know how to do this culling mask using cinemacine? Awesome tutorial!

    • @Madalaski
      @Madalaski  3 роки тому

      Hi! My Intermediate tutorial should cover doing the exact same culling technique but with Cinemachine! There's a demo project on GitHub linked there that might help if not!

  • @megasaIexandros
    @megasaIexandros 3 роки тому +2

    Isnt this the art style used in "calm time"?

    • @Madalaski
      @Madalaski  3 роки тому +1

      I'm not familiar with it (I'm way too much of a wimp to play most indie horror games) but from a cursory glance it seems they use animated sprites to represent characters, where as this is turning 3D models into sprites.

  • @rics907
    @rics907 3 роки тому +1

    Thank you!!!

  • @arpatsche3903
    @arpatsche3903 5 місяців тому +1

    Can I use this method for my Player and all Characters in my game too?

    • @Madalaski
      @Madalaski  5 місяців тому +1

      Yeah dude, I wouldn't've made the video if not

    • @arpatsche3903
      @arpatsche3903 5 місяців тому

      @@Madalaski thank you sir!

  • @Kskospo99
    @Kskospo99 5 місяців тому

    Bro the URP Post Possessing not working

  • @axel06c
    @axel06c 2 роки тому

    I really want to realize what you are showing, but I can't follow what you are doing... I am lost every second...
    I got to the time of the camera tracking script, but from there, nothing works anymore. I think I missed some steps before...
    And when I think it's supposed to be for "beginners", when the whole video is cut and zoomed, it doesn't help to understand.😢
    Sorry for not being able to follow you 😅

  • @jaumecarrionramos9452
    @jaumecarrionramos9452 2 роки тому +1

    Does it augment performance if I render a 3d object as a 2d texture, and can be appliable to dynamic objects, for example if I am doing a transform.Translate, will it affect that object?

  • @justapotato6653
    @justapotato6653 Рік тому

    What unity version did you use while making your "Back Four Seconds" game?

  • @TomFowkes
    @TomFowkes 3 роки тому +2

    when i created the render texture i got this colossal 2d object in my scene which i think was the render texture itself, do you know of a way to make it smaller or invisible? thanks

    • @Mungo13
      @Mungo13 2 роки тому

      did you figure out? same thing happening to me

    • @57Folhinha
      @57Folhinha 2 роки тому

      @@Mungo13 Uuuuh i also need something to fix this

  • @Terszel
    @Terszel 4 роки тому +6

    youtube being weird and showing me videos with

  • @clasiqh
    @clasiqh 3 роки тому +2

    low res ftw, I watch stuff in 144p now.

    • @Madalaski
      @Madalaski  3 роки тому +1

      Personally I use Chrome Extensions to get it down 2-3p but each to their own 🙄🙄

  • @poey2811
    @poey2811 2 роки тому

    did I just have fun watching a unity tutorial?

  • @Helmert93
    @Helmert93 4 роки тому +1

    Nice video!
    I have a problem however. The quad in my project keeps the background as seen in the Camera Preview, it isn't transparent. If I enable Alpha Clipping either nothing happens, or the entire thing disappears when adjusting the Threshold. Any idea what I'm doing wrong? Thanks!

    • @Madalaski
      @Madalaski  4 роки тому

      The main thing I believe is to make sure the background of the Pixel Camera "Uninitialized". Maybe use a Transparent shader on the quads material? You can download my project through the GitHub link in the description. Glad you enjoyed the video!

    • @Helmert93
      @Helmert93 4 роки тому

      @@Madalaski Background type of the Pixel Camera is set to "Uninitialized", so I'm drawing a blank. I'll download your project and compare them. Thanks!

  • @SonictheHedgehogInRealLife
    @SonictheHedgehogInRealLife 3 роки тому +1

    How do you limit the angle you can view the model at ive been trying to do that please!!!!

    • @SonictheHedgehogInRealLife
      @SonictheHedgehogInRealLife 3 роки тому

      Yes i need to do this because im trying to make a 3d sonic game that looks like pixel art and limit the angles you can view the 3d models so it kind of has a DOOM effect

    • @Madalaski
      @Madalaski  3 роки тому +1

      Hmmm, well there are a few ways you can go about it so I'll do my best to summarise!
      1) Low Framerate
      What I demonstrate in the video above is actually controlling the pixel camera to only render at 2 frames per second to give it the look of limiting the angle of the model. This is p easy code you can find on the internet to enable and disable the camera on certain frames but likely not useful for your purposes.
      2) Limit Camera Angle
      Using this example, you don't have to parent the pixel camera to the main camera, but rather give the pixel camera a script that it will update it's position and rotation once the angle between the main camera's offset to the object and pixel camera's offset to the object is above some threshold. This should give you some satisfactory results but still requires this basic faux billboard method that comes with this version of the pixel effect. The code would look something like this in the update function:
      if ( Vector3.Angle(pCam.position - obj.position, mCam.position - obj.position) > 30f ) pCam.SetPositionAndRotation(mCam.position, mCam.rotation);
      3) Limit Model Angle
      Okay so I had the basic mathematical concept down but I had to go into Unity to experiment for a few hours while writing this comment and I believe I've produce some (basic) (semi)workable code. If you rly want this to work, you're gonna have to come to terms with the maths behind it so I can't help you with glitches but hopefully you'll be able think of solutions to problems that show up.
      You can find the code here: pastebin.com/BDLnGmWs
      Basically I created a Look rotation that would rotate the model (which in this script is a child of the actual object so you can still rotate it independently) from it's neutral/identity/zero rotation to a rotation that would point it at the camera. I think inversed this rotation and converted from a Quaternion (a 4 dimensional vector representing an angle and the axis it's rotated around that all rotations secretly run on) to Euler Angles (your more traditional (but mathematically unsound) XYZ rotation that you see in the inspector). I then did the same method as pixelation where I divided the components of the inverse euler rotation by a factor, round them to the nearest integer and multiply them by the same factor, in this case forcing the angle on each axis to be multiples of 30 degrees. You see, by turning the inverse rotation back into quaternion, applying it to the look rotation and setting the model rotation to the result, we are essentially making sure that the model is always pointing at the camera but trying to get back to it's original rotation by multiples of a set angle, thus making it look like the model can only be viewed at angles of 30 degrees.
      Does this work with lighting? No! I'd recommend the 1st or 2nd method if that's a must. Or some kind of shader solution? *shrugs*. This was fun to experiment with though and, like I said, doesn't work perfectly, especially when the camera goes directly above the model. If I mess around some more and get a better solution, I'll let you know! Might even make a tutorial on it ;) No promises!
      TL;DR 3D rotation is hard and there's reason we didn't start learning about it until 3 years into University (well 4 years for me but it was brought up in an extra curricular I took) and even then they avoided going too hard into the core maths. The simplest solutions are a pain and the more complex solutions are also a pain.

    • @SonictheHedgehogInRealLife
      @SonictheHedgehogInRealLife 3 роки тому

      @@Madalaski i have an idea 💡. What if instead of all that you give everything in the level a cam_rotation variable and make it like an offset. So when the camera rotates in 30 degree increments the whole level including obects and the player rotates at the same time at 30 degree increments + plus any addition rotation the player has from rotating around when you control him. So basically rotate the whole level depending on the cameras rotation and give it a limit

    • @Madalaski
      @Madalaski  3 роки тому

      @@SonictheHedgehogInRealLife Okay I think I've wrapped my head around what you're suggesting and I'll say for a start that if you rotate the entire level, you're going to break basically every system Unity has, like lighting, physics, navigation the whole lot. I'm a little confused as to where the effect is being applied to here, is it the player? Also you don't need a cam_rotation variable since Camera.main.transform.rotation would do you okay, though I'd recommend setting Camera.main.transform in the Start function because I've heard it's a FindGameObject() function which is expensive.
      Regardless, I feel like this is more complicated than just figuring out how to restrict the angles of model itself, meaning the scripts I've linked you would only be applied to one object. However, if you think it would work, by all means implement it! It's your idea and the effect you want to put in so if you've got an idea for the solution, code it in and prove me wrong! Make sure to experiment along the way and build it up step by step so you can make sure you're not making any wrong assumptions. Good luck to you!

    • @SonictheHedgehogInRealLife
      @SonictheHedgehogInRealLife 3 роки тому +1

      @@Madalaski thanks for the help. One more thing id like to say. You know how in doom the enemies are just sprites and when you rotate the camera the sprite changes to make it look 3D? I want everything in the level to be like that except everything is actually a 3d model. I want the game to be in third person with a 3D sonic. When you rotate the camera around to see the back or front of sonic i dont want every angle from 0-360 to be shown. Maybe i can just make the camera jump from increment to increment instead of making it smooth to have the angle limit effect. When you rotate the camera make the angle jump from 0 to 15 from 15 to 30 30 to 45 and so on so it looks a bit choppy like doom. Im trying to get this effect that its a sonic game from the genesis but its 3d but still looks exactly like sonic 1 so i want everything to appear as a sprite but really isnt to get perfect angles of sonic and the world around him.

  • @daichi_devs
    @daichi_devs 4 роки тому +1

    Thanks for your awesome vid. I'm getting this problem where the previous frame remains on screen so whenever I move objects I get a trail. Do you know how to fix that? Thanks!

    • @Madalaski
      @Madalaski  4 роки тому +1

      Check out my further tutorials on the subject and see if any of that fixes it. Sounds like when you're writing to the render texture it's not overriding the old pixels with the new clear pixels. Could be something in the Render Texture settings.

    • @daichi_devs
      @daichi_devs 4 роки тому +1

      @@Madalaski hey thanks for the quick reply. I was hoping not to get too "technical" but I guess I have no choice now!

    • @Madalaski
      @Madalaski  4 роки тому +1

      @@daichi_devs Sadly nothing good in life can come without diving into turbulent waters that is "technical". But if I come across a simple fix, I'll let you know!

    • @daichi_devs
      @daichi_devs 4 роки тому

      @@Madalaski cheers! loving your videos

  • @people7409
    @people7409 3 роки тому +1

    I think the Background Type option isnt in Unity 2020, so I cant make the background uninitialized. Can you help?

    • @Madalaski
      @Madalaski  3 роки тому

      Works fine on my end! Should be under "Environment" on the Camera settings. Are you using URP/HDRP?

    • @people7409
      @people7409 3 роки тому

      @@Madalaski No, Im trying to use a 3D model for a 2D game scene transition.

    • @Madalaski
      @Madalaski  3 роки тому

      @@people7409 ah well the background settings are only available in URP/HDRP. Without that, I'd suggest you write either a shader that will make the black parts of the sprite transparent, or a script that uses the OnRenderImage function to write in the transparent parts. Hope this helps!

  • @exil_s4247
    @exil_s4247 Рік тому

    do the same tutorial in your native language

  • @ethantembo4235
    @ethantembo4235 3 роки тому

    does anyone know if i can do it in godot and if so show me please and thank you

  • @Bardent
    @Bardent 4 роки тому +1

    Noice

  • @s3nju279
    @s3nju279 2 роки тому

    It just smears around.

  • @DoidaBrazul
    @DoidaBrazul Рік тому

    Alguém sabe como fazer isso? Kkk

  • @Agelvik
    @Agelvik 3 роки тому +2

    holy fuck

    • @Madalaski
      @Madalaski  3 роки тому

      Language! =P

    • @Agelvik
      @Agelvik 3 роки тому

      @@Madalaski neat effect man, been looking for something like this for ages. however there's one thing i'm struggling with. uninitialized background is supposed to get rid of the solid background color, right? for me its still there, and cant really get rid of it unless i switch over to Overlay, which i don't want, cus OVerlay doesn't have the Render Texture option available. any ideas?

    • @Madalaski
      @Madalaski  3 роки тому +1

      @@Agelvik Hmm, curious. Have you tried making a "Custom Render Texture" instead in your Assets where you get more options with how the background colour works?
      I believe you can set it to clear itself on every frame so it might be the solution you need!

    • @Agelvik
      @Agelvik 3 роки тому +2

      @@Madalaski hell yes! doing this then making a material with transparency did the trick! youre the best man

    • @Madalaski
      @Madalaski  3 роки тому

      @@Agelvik glad to help!

  • @Anatoli001
    @Anatoli001 9 місяців тому +2

    This tutorial is BEYOND unclear.

    • @Madalaski
      @Madalaski  9 місяців тому

      Steps in the description

    • @foxyz8503
      @foxyz8503 3 місяці тому

      Skill Issue :D

  • @AsifShaikh-uz8kg
    @AsifShaikh-uz8kg 4 роки тому +1

    how to fix pixelated edges ?

    • @Madalaski
      @Madalaski  4 роки тому

      Um, if it looks rough around the edges try adding anti-aliasing? If this isn't your problem, then I might need some more context.

    • @AsifShaikh-uz8kg
      @AsifShaikh-uz8kg 4 роки тому +1

      @@Madalaski i tried Aliasing already .

    • @AsifShaikh-uz8kg
      @AsifShaikh-uz8kg 4 роки тому +1

      @@Madalaski i really needed this fix. how can i show you that what problem I'm facing.

    • @AsifShaikh-uz8kg
      @AsifShaikh-uz8kg 4 роки тому +1

      @@Madalaski and I'm also not zooming it's not that bcz of zooming scale i have amd graphic card

    • @Madalaski
      @Madalaski  4 роки тому

      Okay. Sorry, having a busy day. Send screenshots of what's going wrong to my business email, mattredmonduk@gmail.com. I'll try and help you out as best I can. As far as I know the graphics card shouldn't affect anything but also the Intermediate/Advanced versions of this tutorial should fix any issues you have.

  • @MrMogadishu
    @MrMogadishu 3 роки тому

    Less deprecating humor=more subs

  • @kidpog3d101
    @kidpog3d101 2 роки тому

    Please dont make your microphne bad sometimes it is absolutely out of this world annoying