Journey Sand Shader: Sand Normal

This is the third part of the online series dedicated to Journey Sand Shader.

In this third post, we will focus on the normal mapping that will turn smooth 3D models into sandy dunes.

Continue reading

Journey Sand Shader: Diffuse Colour

This is the second part of the online series dedicated to Journey Sand Shader.

In this second post we will focus on the lighting model used in the game, and how to recreate it in Unity.

Continue reading

A Journey Into Journey’s Sand Shader

This is the first part of the online series inspired by the sand rendering of Journey. Join me in this journey into the secrets that made Journey’s sand shader so iconic.

Continue reading

Believable Caustics Reflections

Creating believable caustics reflections is something that most technical artists have attempted achieving at some point in their career. If you are a game developer, one of the main reasons to use Twitter is the endless stream of inspiration it can provide. A few days ago Florian Gelzenleuchter (kolyaTQ on twitter) posted a GIF of a caustics effect created in Unity using shaders. The post (below) quickly reached 1.5K likes, showing a genuine interest for this type of content.

While I usually focus on longer, more technical series (such as Volumetric Atmospheric Scattering and Inverse Kinematics), I could not resist the temptation of writing a short and sweet tutorial about Florian‘s effects.

At the end of this article, you will also find a link to download the Unity package with all the assets necessary. Continue reading

Interactive Map Shader: Vertex Displacement

This online course is dedicated to interactive maps, and how to create them using Shaders in Unity.

This is a tutorial in three parts:

This effect will serve as the base for more advanced techniques, such as holographic projections and even Black Panther’s sand table.

A link to download the Unity package for this tutorial can be found at the end of this article.

Continue reading

Sprite Doodle Shader Effect

This online course will teach you how to recreate a popular sprite doodle effect using Shaders in Unity. If this is an aesthetic that you want in your game, this tutorial will show you how to achieve it without the need to draw dozens of different images.

Such a style has become increasingly popular over the past few years, with many games such as GoNNER and Baba is You heavily relying on it.

This tutorial covers everything you need to know, from teaching the basics of shader coding to the maths used. At the end, you will also find a link to download the complete Unity package.

This series is also strongly inspired by the success of Doodle Studio 95!.

Continue reading

Parallax Shaders & Depth Maps

In the previous part of this series, Inside Facebook 3D Photos, we have explained how modern mobile phones are able to infer depth from pictures. Such a piece of information is stored in a depth map, which is used for a variety of effects. From blurring the background to three-dimensional reconstruction, this type of technology will become more and more present in our daily lives.

This is a two-part series. You can read all the posts here:

A link to the complete Unity package is available at the end of the tutorial.

Continue reading

Inside Facebook 3D Photos: Parallax Shaders

In the past few months, Facebook has been plagued filled with 3D photos. If you have not had the chance to see one, 3D photos are images inside a post which gently change perspective as you scroll the page, or as you move your mouse over them.

A few months prior to their introduction, Facebook had been testing a similar feature with 3D models. While it is easy to understand how Facebook can render 3D models and rotates them according to the mouse position, the same might not be as intuitive for 3D photos.

The techniques that Facebook is using to create the illusion of three-dimensionality on two-dimensional pictures is sometimes known as height map displacement, and it relies on an optical phenomenon called parallax.

This is a two-part series. You can read all the posts here:

A link to the complete Unity package is available at the end of the tutorial.

Continue reading