Billboarding using Geometry Shader (WinRT)

As I said before, some parts of my book removed due to the page counts and I decided to present them in this blog, this time is about billboarding using Geometry Shader.

In order to achieve an impressive 3D look of outdoor scene, you need a lot of 3D objects, for example trees, grass, fire, or etc. We can use full 3D mesh objects for each of them but wait, this will slow down your game rendering performance.
To solve this problem we can use a technique called “billboarding”. Billboarding widely used for rendering 2D textures instead of fully 3D geometry. However, this texture must always face to the camera. 

The Prerequisites

The following are some essential prerequisites that should be considered before developing an application using DirectX 11.2:

  • The first important requirement is a personal computer or tablet running on Windows 8.1.
  • You need to set up Microsoft Visual Studio Express 2013 for Windows 8.1 as a developer environment.
  • Make sure you set up the Windows Software Development Kit (SDK) for Windows 8.1. The Windows SDK for Windows 8.1 contains headers, libraries, and tools that can be used when creating Windows 8.1 applications.
  • Download the source code of this project which uploaded by me on MSDN Code Gallery.

Before getting our hands dirty with codes, first we need to learn what is geometry shader.

What is Geometry Shader?

Geometry Shader is type of shader which is introduced by DirectX10. This stage operates on assembled primitives transformed by Vertex Shader and generates set of new primitives for another stage. The geometry shader, as opposed to the vertex shader, has full details of the primitive, in the other word, for each inputted primitive, the geometry shader has access to all the vertices that make up that primitive.
While the vertex shader always takes one vertex as input and generates one vertex as output, the geometry shader has the unique capability of making changes to the primitives.

For example within geometry shader we can change the topology of the primitives, or drop some primitives for generating less or more vertices rather than inputted.

Please note that Geometry Shader might be slow especially on tablets, so make sure to select an efficient solution for your rendering pipeline when you want to target tablets market.

Let’s get back to the code, open “BillboardGShader.hlsl” from your folder located in solution\Assets\Shaders, please make sure get the source code of this project from from here.

In Vertex shader, we just passed the position of each vertex, but Geomatry Shader stage is responsible to implement the billboarding technique just like the following code:



We’ve started with compute position of vertices, then computed the world matrix so that billboard is aligned with YAxis and faced to the camera. After all we set the texture coordinate of each texture and finally saved our parameters to output value, which will be used later by pixel shader.


You can use your own asset for texture of each billboard for example a simple tree with alpha transparency or anything you would prefer, but I wanted to simulate a simple fire, so in the pixel shader stage, the sample noise must mapped three times with different texture coordinates which were generated in previous geometry shader stage and then compute the summation of signed noise. Finally get perturbed coordinates and returns the multiply of opacity and base color.

The following image, shows the result of our sample. I hope this article will be useful for you.
DirectX 11.1 Game Programming | Billboarding using Geometry Shader (WinRT)

2 thoughts on “Billboarding using Geometry Shader (WinRT)”

  1. Hi my name is Emily and I just wanted to send you a quick message here instead of calling you. I discovered your Billboarding using Geometry Shader (WinRT) | DirectX 11.1 Game Programming page and noticed you could have a lot more visitors. I have found that the key to running a successful website is making sure the visitors you are getting are interested in your website topic. There is a company that you can get keyword targeted traffic from and they let you try their service for free for 7 days. I managed to get over 300 targeted visitors to day to my site. Visit them here:

  2. My program is a rain particle system. After processing a list of positions of rain particles, I passed them to the geometry shader for generating a billboard for each position.

Leave a Reply

Your email address will not be published. Required fields are marked *