How to Configure Hyper-casual Game Shaders With Unity

Hyper-casual is a genre of games that can be developed fairly quickly. Not surprisingly, more and more developers are choosing this direction. I've been in game development for more than 10 years. For the last 8 months, I’ve worked at hyper-casual publisher, Ducky, collaborating with beginning and experienced hyper-casual development teams.

One of the most frequent questions beginning hyper-casual developers face is how to make a game's scene look good and spend less time on its design.

The answer to this question consists of many points of design and development, such as color palette selection, object creation, shaping, shaders, and other visual parameters.

In this article, I’ll focus on setting up shaders and share how to make the game scene developed in Unity more pleasing to the eye.

What Are Shaders in Unity and Why Are They Important

Shaders in Unity are programs that run on a GPU (graphics processing unit). Shaders calculate the appropriate levels of light, darkness, and color during the rendering of a 3D scene. This process is known as shading.

The shaders in Unity create engaging graphics from an incomplete scene. The range of achievable effects is huge — from basic lightning shades added to an X-ray view or cartoony outlines.

Properly adjusted shaders allow beautiful, clean colors, stylish cartoon looks in games, and various effects added to the rendering output. In hyper-casual games, shaders are widely used to make a prototype or a full game scene look good.

Knowing the basic rules for using and configuring shaders will help make the prototyping process faster, which is invaluable in fast-paced hyper-casual development and testing cycles.

Basic Rules for Setting up Shadows for a Hyper-casual Scene

Let me take you through this guide with the example scene of a simple hyper-casual game. Let’s say that the designers have already chosen four colors for one of the scenes of this future game:
At first, the scene might seem gray and dirty. This is the point where the team starts working with shaders to eliminate this perception following these basic rules:

1. Avoid black shadows. Black shadows make the scene quite gloomy and draw too much attention. The emphasis in the scene should be on the characters (the main character, allies, enemies), obstacles, and coins, but not on a deeply black object shadow.

Just picture a scene in a game with a light background and hundreds of characters and each of them cast a black shadow. It's definitely not pleasing to the player's eye. For a hyper-casual game, it's better to use cartoon-looking shaders.

2. Keep a limitation in mind. As a rule, every object in the scene has a light side and a shadow side. And both sides have one color in all places and no halftones. But the scene doesn't look like this before shaders are adjusted. In the example above, I have shown a typical scene before setting up shaders.

As you can see, the left shadow side of each object is black and the right side is light, which creates a strong contrast between the colors. This effect hurts the eye and the designer must smooth it out. In addition, both sides contain one color in all places and no halftones.

3. Avoid shadows that are too dark or dirty. Such shaders are obtained by using black and grey colors. It’s better to replace black and grey shadows with colored ones — green, purple or blue.

What's good for beginners is that there is an option to get and adjust ready-made shaders, instead of developing everything from scratch.

Where to Download Ready-Made Shaders for the Game’s Scene

I would recommend the Unity Asset Store, which is a great place for thousands of free or affordably priced assets that save critical time and effort for Unity creators.

Designers can choose from a massive catalog of 2D and 3D models, SDKs, templates, and tools to speed up their hyper-casual game development. Both Unity Technologies and members of the community create these Assets and publish them to the store.

All of these shaders are simple to work with. For example, I'll tell you a little about the Flexible Cel Shader. This asset can do a good job of transforming the scene in terms of color and shadows:

As you can see, the scene has become much more light-weighted and easier to perceive. This shader helped to get rid of black shadows, and all elements blend well together. The scene on the right still needs to be completed, but the shaders already look much more like something that can be seen in a simple hyper-casual game.

Once the shaders asset is applied, it’s time to adjust the shaders of different objects according to the needs and the idea of a particular hyper-casual game.

Step-by-step Unity Shader Setup Guide

Setting up shaders in Unity is quite simple. The path to the black belt in shaders looks like this:

1. Create new material. Add the floor, or something else from a scene, and select a shader that doesn’t have an outline. It could be the Flexible Cel Shader.

2. Go to Base Color and Textures, and choose the texture for the object. In my case, I want to use a plank pattern for the floor. Consequently, I should load a picture with it in the necessary color. In addition, I pay attention to whether there are textures here. If not, then my picture should be just a solid color, selected before.

3. Go to the Global Color Modifier. It allows us to change the color of the whole object immediately. I used this feature to add a color hue to the floor color. If the initial color looks fine, this step is unnecessary.

4. Set up the Lighting Ramp. It helps set the border between light and shadow. By default, this feature shows two ramp levels (gradations of shadows). I can change this setting and add more gradation, but in this case, I don't need it.

**5. Adjust High Light.**It allows us to adjust the color and brightness of the illuminated part of the subject. For example, I can leave the color white and set up the brightness. So in the scene, the object looks as close as possible to the color I initially planned (not too dark, but not over-lit).

6. Adjust Low Light. Choose a color that imposes on the texture in shadows. It would also be nice to adjust the intensity so that this color is slightly darker than the base color. Also, it’s better to avoid grey or black.

7. **Set up the outline.**Setting the color and size of the outline is the last step of working with shaders. This part might be skipped.

All the other textures are configured in the same way. The core principle is setting the base color and adjusting the color and the saturation of the shadows.

Wrap Up

The configuration of shaders is an important step in creating a hyper-casual scene, which comes between the choice of colors and shapes and finishing the final scene look with textures, details, and interface.

This is simple to start working with but a powerful parameter allows the scene to look much more smooth and more enjoyable for players.

Be sure to use its power from the very first attempts to create a hyper-casual game. Keep in mind the basic simple rules for setting up shaders, experiment with downloadable assets, and

be prepared to go the extra mile if you want to achieve something really spectacular.

Photo by Zdeněk Macháček on Unsplash