# How to use shader in Babylon for the final screen image output

**URL:** <https://forum.babylonjs.com/t/how-to-use-shader-in-babylon-for-the-final-screen-image-output/38210>\
**Category:** Questions\
**Tags:** shader, postprocessing\
**Created:** [February 14, 2023, 10:19am UTC](https://forum.babylonjs.com/t/how-to-use-shader-in-babylon-for-the-final-screen-image-output/38210 "2023-02-14T10:19:48Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![heyefeng229](https://avatars.discourse-cdn.com/v4/letter/h/f04885/32.png) [@heyefeng229](https://forum.babylonjs.com/u/heyefeng229)\
**Post date:** [February 14, 2023, 10:19am UTC](https://forum.babylonjs.com/t/how-to-use-shader-in-babylon-for-the-final-screen-image-output/38210/1 "2023-02-14T10:19:48Z")

</div>

I want to view the entire screen as a quadrilateral image, and view the quadrilateral imag as a original texture.

So far I have completed the code of shader to compute the mapping of the screen image.

Now I’m wondering how to use shader in Babylon for the final screen image output.

I tried to PostProcess,but I don’t know how to pass variables such as position、worldViewProjection.

I’m looking forward to receiving your reply and thank you for your help.

> **[Babylon.js Playground](https://playground.babylonjs.com/#DAC1WM%23175)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

> **[Babylon.js Playground](https://playground.babylonjs.com/#1SLLOJ%233305)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [February 14, 2023, 1:32pm UTC](https://forum.babylonjs.com/t/how-to-use-shader-in-babylon-for-the-final-screen-image-output/38210/2 "2023-02-14T13:32:20Z")

</div>

For a post-process, you don’t provide the vertex shader because the system uses a default one. Also, this is a 2D post-process, you can’t use 3D coordinates. You can use the `vUV` varying, though:

> **[Babylon.js Playground](https://playground.babylonjs.com/#DAC1WM%23177)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

---

<div class="post-metadata">

**Author:** ![heyefeng229](https://avatars.discourse-cdn.com/v4/letter/h/f04885/32.png) [@heyefeng229](https://forum.babylonjs.com/u/heyefeng229)\
**Post date:** [February 15, 2023, 12:55am UTC](https://forum.babylonjs.com/t/how-to-use-shader-in-babylon-for-the-final-screen-image-output/38210/5 "2023-02-15T00:55:41Z")

</div>

But I want to calculate UV based on the coordinates after the mvp transformation.Is it possible to achieve with post-processing? Or is there another way to do it?  
In unity, I can do this by binding the shader to the camera.

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [February 15, 2023, 1:40am UTC](https://forum.babylonjs.com/t/how-to-use-shader-in-babylon-for-the-final-screen-image-output/38210/6 "2023-02-15T01:40:08Z")

</div>

> [@heyefeng229](#):
>
> But I want to calculate UV based on the coordinates after the mvp transformation.Is it possible to achieve with post-processing? Or is there another way to do it?

A post-process uses a single quad (2 tris) for the geometry, so you will only have 4 transformed vertices. If you want your shader to apply to a real mesh and not simply a quad, you must use a regular shader and not a post-process.

> [@heyefeng229](#):
>
> In unity, I can do this by binding the shader to the camera.

I don’t know Unity, but I’m not sure that a post-process in Unity would be any different than a post-process in Babylon.js, that is a full screen quad rendering. I don’t really know what mean to bind a shader to the camera: is it that all meshes are rendered with the shader you bind to the camera? Something like a shader override: the shader for each mesh is replaced by the “camera shader” at rendering time? In that case, can’t you assign this shader to all meshes in Babylon?

---

<div class="post-metadata">

**Author:** ![heyefeng229](https://avatars.discourse-cdn.com/v4/letter/h/f04885/32.png) [@heyefeng229](https://forum.babylonjs.com/u/heyefeng229)\
**Post date:** [February 17, 2023, 6:46am UTC](https://forum.babylonjs.com/t/how-to-use-shader-in-babylon-for-the-final-screen-image-output/38210/7 "2023-02-17T06:46:09Z")

</div>

I have found other ways to achieve my goal, and thank you very much for your help.