Unity PIXELATED RENDERING in URP Using Custom Renderer Features (Code Walkthrough)

[@dicony3427]

Hello, if you are facing a problem with a black screen or freezing scenes in the build, then you need to open the player settings, then go to the Graphics section and add the pixelation shader to the list of shaders that are always included.😉

[@dcry1003]

question do you have any idea about the error (object reference not set to an instance of an object) in pixelizePass:36? if it helps the only thing i did for now was copy the codes into a script and added the pixelize feature in the urp renderer

[@huntiault7660]

@@dcry1003 did you ever figure this out?

[@AbachiriProduction]

thanks

[@StasSHV]

@@dcry1003 Ever found out the problem?

[@Squeazer]

Very cool video! One suggestion: Don’t completely blur out your other code when you’re walking through it, it makes it super difficult to jump around / understand the context.

[@a1a3a5]

I've been wanting to do a game with this style. Thank you for giving this out for free with a chill video!

[@malimakes]

I glad you enjoyed this :D

[@user-dd9is6iy9m]

I know you said it wasn't a tutorial but it sure felt like one and was SUPER HELPFUL!

[@malimakes]

Thank you for your comment! Glad you liked this :)

[@carriganreilly]

EDIT: I found that you can clear the error using pixelBuffer = RTHandles.Alloc( new RenderTargetIdentifier(pixelBufferID)); but the effect still does not work and it creates a whole bunch of other issues Hey! Quick question! Currently working in URP 14.0.8 and RenderTargetIdentifier has been marked as obsolete and should be replaced with RTHandle So then retrofitting the two variables gets "RTHandle colorBuffer, pixelBuffer". (pixelizepass line 10) While this fixes the issues with Blit(), but it breaks the creation of a new RenderTargetIdentifier/RTHandle "pixelBuffer = new RTHandle(pixelBufferID);" (pixelizepass line 45, changed from RenderTargetIdentifier) when replacing that RenderTargetIdentifier with RTHandle it completely collapses and says that RTHandle has no constructors that take an integer. RTHandle documentation is pitifully small and I can't really find any information anywhere that is even close to creating a new RTHandle using shader IDs Any chance you know how I could fix this? Or should I attempt a different version of this effect?

[@carriganreilly]

its not like you could even change any of the RTHandle attributes either since theyre all read-only :(

[@carriganreilly]

unfortunately, since its completely obsolete, the render effect doesnt work at all unchanged

[@malimakes]

Hey sorry, I haven’t been able to keep up. I’ll look into it but I don’t have so much time these days. Hope you found a solution

[@Opuhlos]

Yea Im having the same issue as well

[@owenhey3187]

Did you ever solve this?

[@StasSHV]

Great video dude! Seeing as you keep mentioning you're just learning, I'd love to see what you found out about this method since releasing this!

[@peplms]

Yo ! Thank you so much for this Video. I didn't know anything about Renderer Feature, it seems to be a really powerful tool. Also i love the rythm of your tutorial. Going straight to the point but still giving a lot of details. I will now have to dig a little bit into what else is possible with this approach.

[@malimakes]

I appreciate this comment. I was really insecure about this video. Glad you liked it

[@vexedev]

Hi there, getting deprecated errors on the Blit lines, "Use RTHandles for source and destination" but I wasn't quite sure the right way to alloc these handles and release them. Any ideas?

[@owenhey3187]

Did you ever figure this out?

[@vexedev]

@@owenhey3187 Nope. Took a path of lesser resistance. Dealing with URP APIs is raw pain in the ass.

[@dcry1003]

yooooooo! i love your new style (still miss the green hair tho) also its good be back to your videos thank you as always!

[@malimakes]

I appreciate the support! Thank you!

[@olivererlandsson30]

I'm having the problem that the shader is being applied to the scene view instead of the game view, help please.

[@jonathanwolfs8779]

I'd been looking forward to trying out this effect for myself, but it seems like the URP 16 update changed some things around. So it doesn't seem to work anymore :'( anyone have any idea if there is an updated version somewhere out there? I've been trying but no luck just yet.

[@rd4603]

I copied everything in this video and applied it to all URP-Renderers and tried every one (there are three now). However, the edges are blurry and not sharp as they should be. Can someone help me please? EDIT: I noticed that there is no difference between sampler_point_clamp and sampler_linear_clamp. EDIT2: I figured it out. There was Anti Alialising applied in URP-High Fidelity (or the other options).

[@malimakes]

Blurry means it was the anti aliasing. Glad you figured it out :)

[@-vanitas5229]

The key is using point filter instead of linear filter when we change the render scale

[@malimakes]

Yep!

[@BLANKdev]

Now this looks awfully familiar 👀 I cannot wait to see how this works!

[@malimakes]

using the effect in not a golf game made me realize it could actually be improved with some new tech that has come out since my previous video on the topic

[@thewanderingone679]

what do you mean?

[@malimakes]

Hey everyone! I have not been feeling like I can get myself to do anything creative so here you go with a 2020-whateep-code-walkthrough kind of video. I've left a lot of detail out so I'll just leave some notes here. 1) You can check out the code in my GitHub repo (link in the description) 2) URP renders overlay-mode UI on top of everything, so we don't have to worry about the effect pixelating our UI and rendering it unreadable 3) Use the frame debugger (Window > Analysis > Frame Debugger) to explore the rendering steps you're game is going through EDIT: Some people have been having issues with the effect resulting in a black screen in builds. I believe this is due to the automatic generation of the material in the renderer feature/pass. If you're experiencing this issue, please make sure to expose a new Material field to the Custom Pass Settings and create the Material in the project window manually. This will not have any impact on how the effect works, will just fix the issue at the expense of having to manually setup the material once. Alternatively, you could implement the solution in @dicony3427 's comment below :) (Thanks DICONY) This is NOT a tutorial: I've got plenty to learn about this subject and I don't feel qualified to talk about it in detail. I just felt like I should update you on this topic since I've outgrown my older tutorial myself. If you find it difficult to follow because you don't know some of the things I'm talking about take your time and study the code, and perhaps check the resources linked in the description.

[@justadevlog1667]

i want to learn more about creating custom render do i have a good tuts or code walkthrough i can learn from since im new to scriptiablerender also nice video keep it up

[@malimakes]

@@justadevlog1667 well, there’s some resources in the description, you can start there and make your way around the wiki

[@AmgedAlfakih]

hello bro. how to reference render Objects Feature In script, and how to adjust its value like camera POV or Material

[@theoneandonlylg3824]

this

[@БФБФ-щ2у]

Hi, thanks for the video! Everything works fine in the editor, but in a build it is only black screen without any objects (2021.3.8f1 LTS). What could you advise on this matter?

[@dicony3427]

Hello, I faced the same problem and found the solution myself! In order for everything to work, you need to open the player settings, then go to the Graphics section and add the pixelation shader to the list of shaders that are always included.

[@БФБФ-щ2у]

@@dicony3427 Thanks! I'll try this.

[@chrisheld8463]

@@dicony3427 Ha! This saved me. I was runnning into the same issue. Thanks!

[@harukaj8567]

@@dicony3427 YOU ARE A GOD I BOW SAVED MY TEAMS FINAL YEAR VERTICAL SLICE SUBMISSION XD

[@dicony3427]

@@harukaj8567 Glad to help!

[@pengoo1933]

Actually thank you so much! There is no reason not to call this a tutorial, super helpful!

[@Sonnenrot3]

Hello there! Has anyone a solution that it does not pixelate my world space UI? :) Im not sure if I'm missing something important here

[@cheezenuts2357]

render the ui with a different camera

[@inxendere]

I literally love you. Thank you so much. Sub earned

[@malimakes]

I really appreciate that! Thanks!

[@happy_run]

I’ve got it working. I used a code from one of the comments and it removed the errors

[@ULTRADARKSETH]

Subscribed! Love your content and how you present it. This helped me allot. I do have one question for you on this. How can we change this to apply only on one layer. Similar to the "Render Object ( Experimental )" Option. If you can add that this would be something only one other person managed to do and didn't share.

[@swiftcreations]

Great video and excellent learning experience. Am I allowed to use this in non-commercial projects? Can't find a license on your Github page.

[@malimakes]

You’re free to use it wherever! Giving credit is always appreciated but non necessary :)

[@swiftcreations]

@@malimakes You're awesome man, I used it in a jam! If you want I can send it to ya

[@SlothHuntOnYou]

Hi, thanks for great video, but what the best way for downscale resolution on mobile with pixeleted picture(without blurry effect) = for example if mobile have screen 1080p => lets render unity game in 540p on that screen(for integer scaling) = but blurry effect ruined it=(( what the best way to fix it?

[@capmayonesa]

It is possible to make with Shader Graphs?

[@mings2994]

Hello! I really like this video and thank you for make this video. So I have a question. I tried add Pixelize Feature click URP-Renderer -> Add Renderer Feature and i can't find Pixelize Feature just three options Renderer Ojects, Decal, and Screen Space Shadows that's it. What should i do?

[@shikkuu8295]

THANK YOU VERY MUCH, you're a G

[@icantdraw3783]

Where do I find those Rendersettings? I dont have a folder with Settings nor Renderers??

[@СергейПолевщиков-х5ц]

Hi! It's very cool video. Although after this video I've got one more question. Does this method can handle transparent objects or this feature is too complicated to implement?

[@malimakes]

It does support transparent object as it is applied after everything has been rendered

[@margotlinne]

thank you for sharing this, this shader is amazing. But do you have any idea how to add vertex colour?

[@relay2358]

Hey, thanks for the shader! It works really well in the editor, but it shows a gray screen whenever the render pass is turned on (only in the build). Do you have any idea as to why this might be happening? Thanks!

[@dicony3427]

Hello, I faced the same problem and found the solution myself! In order for everything to work, you need to open the player settings, then go to the Graphics section and add the pixelation shader to the list of shaders that are always included.

[@mazander_man]

It looks awesome, I'm just wondering if it works with post processing...

[@malimakes]

It currently only works before post processing, but I’m working on updating it to work after post processing too! Update should be out soon, I hope

[@Neekobh]

I don't know if it is just me, but this method breaks my game completely when I build it, while in editor mode it works fine, when I build it, it simply freezes while changing scene, the scene still loads, but the screen just became the last frame of the last scene.

[@dicony3427]

Hello, I faced the same problem and found the solution myself! In order for everything to work, you need to open the player settings, then go to the Graphics section and add the pixelation shader to the list of shaders that are always included.

[@Neekobh]

Interesting.... maybe I will try to use it again and test what you did, I had given up and just used the old render texture method.

[@alecraigan4568]

Hello, My editor does not have URP Renderer while it has other URP, I realize this is not your problem but I searched on the internet and can't find a solution, any ideas?

[@malimakes]

Can you please elaborate on what you mean “it has other URP”?

[@malimakes]

If you’re using URP your project should include a renderer. The file’s name in the project window should be the same as the one that is selected in your camera’s inspector, you might also be able to locate it from the camera inspector’s itself

[@alecraigan4568]

@@malimakes You are right! Thank you very much, I'm new to URP so when I saw that I had "URP-Balanced" or "URP-Perfomant" in the setting I got confused why I did not have "URP-Renderer" but I did check the camera as you said and it's called "URP- High-Fidelity-Renderer", will pay more attention next time, again thank you!!

[@DarkblueIbanez]

So I'm having a strange problem with this. I downloaded your code directly from github and added it to my project and it doesn't work. No errors just doesn't pixelate anything. I still get the error on line 22 like you get in your video. I tried making a new project with the urp and just testing it on a basic cube. Still nothing. I'm really baffled I looked through your tutorial several times and I can't find anything you did different. I used your code directly from github with no changes.

[@malimakes]

It’s an old tutorial, so some things might have changed with URP since, I don’t know for sure. My recommendation is to not download the code but try to implement it yourself with the aid of the tutorial so you can spot the issues as soon as they pop up along the process

[@DarkblueIbanez]

@@malimakes I'll try. Unfortunately the reason I downloaded it is because I don't really know anything about urp shaders. It'll probably be awhile before I have anything to show for it.

[@kingzinhorr]

How do I do to make UI don't be affected by this pixelization effect?

[@malimakes]

The way I do it in this video it will not be affect overlay screen space canvases

[@kingzinhorr]

@@malimakes Is there any way to make my UICamera (that holds the UI) ignore this pixel rendering? I know you said that it will not affect canvas but its happening in my case, and I guess this is happening with me because i'm using a camera to hold the UI and I need it to be in this way.

[@malimakes]

, the effect will not affect screen space overlay canvases. You need to rework your ui

[@timeSlidrGaming]

How can get screen height in code so I can animate it?

[@PamukdevstuffFC]

When I compile the game, the camera is gray

[@malimakes]

Yes. Rather than creating the material at runtime you need to create a material asset, expose a variable in the inspector and assign it that way

[@PamukdevstuffFC]

@@malimakes Was that shown in the video or something? cuz i dum

[@malimakes]

Nope, it’s something that came up in a later version than what I filmed this video with I think? But you’re not the first person to comment about it so I had already investigated it

[@PamukdevstuffFC]

@@malimakes Oh

[@theoneandonlylg3824]

Damn this is like the proper way of doing it, Thank you, love it

[@SantiagoIsAFK]

Bro. thanks you, this is exactly what I was needing

[@jayleo500]

Why does your shader code not use appdata and v2f structs?

[@malimakes]

It has those, but are named differently! I wrote this shader based on already existing URP shaders and they use different naming conventions.

[@SquishysAdventure]

Very informative tutorial man, great work! When only moving left and right while being in the orthographic camera, you would think that the shapes of the objects would stay the same, leading to the pixels staying in the same position, but that does not seem to be the case unfortunately. The pixels seem to be "swimming", with lots of erratic movements, if that makes sense I've been trying to solve this problem of pixel artifacting for a while, but I have no clue how to ): EDIT: I think the issue is called "pixel creep". It seems to be caused by the camera not snapping to the pixel grid or something, but I'm honestly not sure.

[@malimakes]

First of all: thank you! Secondly: I believe you’re on the right track. Look up sub pixel camera movement. It’s a way of achieving a pixel perfect effect that should remove the artifacts you are noticing right now

[@procinogen]

Hi! I'm trying to get acquainted with Unity's URP and I figured this video could help me start. Anyways I was wondering why the needs the pixelized output to be rendered to a render texture before it can be rendered with the main camera. Thanks for the great and insightful video!

[@malimakes]

Ok so, it's not actually doing that. From my understanding, What's happening is that the camera is rendering the texture I store in the colorBuffer variable. This texture has a static assigned ID "_ColorAttachmentA", which is what is later going to be passed to the post processing passes. We need to first re-render the texture to a temporary buffer, and then replace the data in the _ColorAttacmentA buffer with our shader's result to then be drawn to the screen.

[@procinogen]

@@malimakes Not sure why I didn't get a notification for your reply, so sorry for replying 2 months later. Anyways, thank you for the explanation!

[@neozoid7009]

Perfect timing thanka super awesome 👍. Please can you share the toon shader ?

[@malimakes]

Sure, I’ll make a short about it tomorrow or the day after!

[@malimakes]

It basically just interpolates between to colors based on the dot product between the light’s direction and each vertex’s normal with some posterization applied

[@neozoid7009]

@@malimakes thanks

[@malimakes]

Just an update, the video will be coming out tomorrow :)

[@dannekho]

You can use render texture with single camera setup

[@malimakes]

You can? This actually seems great info. Can you share how to do that? Thank you!

[@patek2385]

It doesnt work with raycasting

[@rynab85]

Hey! is there a way to apply the shader to the ui ?

[@stharuki]

Nice video! That's exactly what I want. Thanks a lot!🥰

[@juanpabloportilla4491]

Amazing. but I have a problem. When I move objects around , they leave a trail that takes a while to catch up. Honestly. I have no idea what the code is doing, but I hope some actual nerd reads me and be like "that is so obvious". (Or someone just tell me this is not meant for moving objects)

[@malimakes]

What is the value for your camera’s clear flags?

[@juanpabloportilla4491]

@@malimakes you mean de clipping Panes? 0.3 to 1000

[@XiaoChen-lw3hm]

thank you for your sharing

[@holup9463]

Thanks a ton!! Works like a charm. I was wondering, however, how did you get the lighting on the objects like that?? Did you simply texture them as such??

[@carni7866]

Thank you! This is super helpful

[@ghostradiodelete]

I couldn't get the shader to work with Render Graph in URP, but this looked identical to my eye. This is for Unity 6, btw. Could use some work from someone with more skill. using UnityEngine; using UnityEngine.Rendering; using UnityEngine.Rendering.RenderGraphModule; using UnityEngine.Rendering.Universal; public class PixelateFeature : ScriptableRendererFeature { public RenderPassEvent passEvent = RenderPassEvent.BeforeRenderingPostProcessing; private PixelatePass_ColorCopy m_PixelatePass_ColorCopy; public int m_PixelScreenWidth = 320; public int m_PixelScreenHeight = 180; private RTHandle m_PixelateTexHandle; private const string k_PixelateTexName = "_PixelateTexture"; public class TexRefData : ContextItem { public TextureHandle pixelateTexHandle = TextureHandle.nullHandle; public override void Reset() => pixelateTexHandle = TextureHandle.nullHandle; } public override void Create() => m_PixelatePass_ColorCopy = new PixelatePass_ColorCopy(passEvent); public override void AddRenderPasses(ScriptableRenderer renderer, ref RenderingData renderingData) { if (renderingData.cameraData.cameraType != CameraType.Game) return; var pixelDesc = renderingData.cameraData.cameraTargetDescriptor; pixelDesc.width = m_PixelScreenWidth; pixelDesc.height = m_PixelScreenHeight; RenderingUtils.ReAllocateHandleIfNeeded(ref m_PixelateTexHandle, pixelDesc, FilterMode.Point, TextureWrapMode.Clamp, name: k_PixelateTexName); m_PixelatePass_ColorCopy.SetRTHandles(ref m_PixelateTexHandle); renderer.EnqueuePass(m_PixelatePass_ColorCopy); } protected override void Dispose(bool disposing) { m_PixelatePass_ColorCopy = null; m_PixelateTexHandle?.Release(); } } ------------------------------------------------------------------------------------------------------------------------------------------------ And the pass: using UnityEngine; using UnityEngine.Rendering; using UnityEngine.Rendering.RenderGraphModule; using UnityEngine.Rendering.Universal; public class PixelatePass_ColorCopy : ScriptableRenderPass { class PassData { public Material pixelBufferMat; public TextureHandle source; public TextureHandle destination; public Vector4 scaleBias; public RenderTargetIdentifier pixelBufferId; } private Vector4 m_ScaleBias = new Vector4(1f, 1f, 0f, 0f); private ProfilingSampler m_ProfilingSampler = new ProfilingSampler("PixelatePass_ColorCopy"); private RTHandle m_PixelatePass_ColorCopyHandle; public PixelatePass_ColorCopy(RenderPassEvent evt) => renderPassEvent = evt; public void SetRTHandles(ref RTHandle dest) => m_PixelatePass_ColorCopyHandle = dest; public override void RecordRenderGraph(RenderGraph renderGraph, ContextContainer frameData) { UniversalResourceData resourceData = frameData.Get(); UniversalCameraData cameraData = frameData.Get(); PixelateFeature.TexRefData texRefData = frameData.GetOrCreate(); if (cameraData.camera.cameraType != CameraType.Game) return; using (var builder = renderGraph.AddRasterRenderPass("PixelatePass_ColorCopy", out var passData)) { TextureHandle source = resourceData.cameraColor; TextureHandle destination = renderGraph.ImportTexture(m_PixelatePass_ColorCopyHandle); texRefData.pixelateTexHandle = destination; if (!source.IsValid() || !destination.IsValid()) return; passData.source = source; passData.scaleBias = m_ScaleBias; passData.destination = destination; builder.UseTexture(source, AccessFlags.Read); builder.SetRenderAttachment(destination, 0, AccessFlags.Write); builder.SetRenderFunc((PassData data, RasterGraphContext context) => { Blitter.BlitTexture(context.cmd, data.source, data.scaleBias, 0, false); }); resourceData.cameraColor = destination; } } } ------------------------------------------------------------------------------------------------------------------------------------------------ There's no shader to this, like I said, couldn't make it work. I compared before and after using the old code with the shader and the new Render Graph version without, and I saw maybe 8 pixels different in the scene. I don't know how useful this is. When I tried doing the Render Graph making the shader available like so: builder.SetGlobalTextureAfterPass(destination, m_OutputId); // Make the output texture available for the shaders in the scene builder.SetRenderFunc((PassData data, RasterGraphContext context) => { // Blit the input texture to the destination target specified in the SetRenderAttachment method Blitter.BlitTexture(context.cmd, data.source, data.scaleBias, data.material, 0); }); Well...this didn't work. I got a black mesh draw and nothing more. It did try to use the shader, but I had to actually do Shader.SetGlobalTexture("_CameraTargetAttachment", destination); right before the BlitTexture call. Then remove _MainTex property from the shader, and replace the inputs with _CameraTargetAttachment. It still doesn't work, but in the frame debugger I could at least see the proper texture instead of an empty white box. Okay have fun.

[@neozoid7009]

Can this work in Unity 2D URP ?

[@malimakes]

I think you might have to rewrite the shader

[@simeonj.5035]

Awesome tutorial!

[@chrisheld8463]

Thank you. Very nice video.

[@Paul-to1nb]

This is awesome, Great job! For "not being a tutorial", I find it to be one of the most resourceful videos. Any idea how you would add a 1 pixel edge detection depth based outline around objects (like a short hike)? I had it working when using RenderTextures, but switching to this method makes either makes edges drop off before they're pixelized or unpixelized if done after pixelization.

[@malimakes]

Hey, I really appreciate that!

[@malimakes]

to answer your question, I was gonna make a video about that too but got burnt out while recording it. If you reach out on discord (server invite is in desc.) I might be able to provide you with some code to do that. From your comment I reckon you will be able to figure out how it works :)

[@literallyjeff]

@@malimakes I hope you do release that video eventually, I would be interested to see it!

[@infokubarcade]

Amazing. I subscribed.

[@quvew]

THANKS!!!!!!!!!!!!!!!!!

[@coobbyo]

Uh oh, he lost his hair again. Hope you find it my man!

[@malimakes]

Hahahaha I swear the weather here is too hot for long hair 😭😭😭 I had to do it

[@-vanitas5229]

nice content

[@RandomPerson-wl5id]

Thank you!!!

[@aqg8232]

thanks a lot

[@Moliser3]

受益匪浅

[@217tman3]

nice

[@DonMhylios]

I've been looking for a solution for weeks! Do you want to marry me? Thank you so much!!

[@wagnerfernandes4899]

Thank you very much! It worked great!