How to roll a ball in your game, like the unity roll a ball standard asset, but better!

The standard asset

Jokes aside, Unity offers a really good starting point for you to make your own rolling ball game.

It comes with the standard assets pack with any 3D Unity project, you have a prefab of a ball and couple of useful scripts to help you move it.

Now I’m not gonna talk about it because you can find plenty of resources and information in the Unity manual.

What I’m gonna talk about is how to make it more juicy and responsive to the player inputs.

If you haven’t read about my early devlogs about physics I strongly recommend you to:

Devlog about Physics optimization

Devlog about Jelly Shader

Movement

For any platformer movement is crucial, metrics are very important and need to be controlled via scripts to adapt to various situations.

To move the ball in the direction you want (in front of the camera) you use the rotation of your camera:

The reason why you use rotation instead of direction like in the standard asset is that you don’t want to go up or down as well, so to prevent slowing down your ball when you’re looking at the ground you use the Y-axis rotation of your action camera and assign it as an angle to the inputs.

If you don’t have a world up like in space, for instance, you will use the direction instead.

Something to implement as well as a script to lerp the Player’s rigid body drag to its velocity. So when you go faster you get less resistance to the air and you keep going faster. It makes the player feel the acceleration and doesn’t feel like a rigid max speed value.

You can use lerp too instead of a curve in the editor.

Here’s the difference without and with:

Another small thing that I thought about in Crumble is a script to slow down the player speed if there are no inputs registered. So the player won’t slide off the platform or won’t overshoot a distance because he was too slow to give the right inputs. A simple condition with input == 0 and a velocity lerp should do the trick.

Camera movement and player animations play a great deal in the feel.

Jumping

Jumping should be fun and consistent.

The first thing you need to do if you use gravity is to increase the value by times 2 to 10 because you don’t want the player to feel like it has no weight.

The perfect jump for my game was to have a very quick boost upward and have a small window of low gravity at the end so that you can decide where to go.

To help with that you can lerp the jump force with time and a curve:

This will change the way the jump will behave based on the shape of the curve.

The vector up is there because I wanted to have a use for wall jump in the game even if it’s not the main feature because of the chaotic nature of the physics.

Here is the code for it:

It uses a wall angle float to check if the normal hit raycast is above, so you don’t wall jump on a too steep a wall.

Feedbacks

Now, this step seems superficial, but it is very important to give your game good feedback to the player.

Simple things you can add, vibration if your game supports the gamepad (it should)!

And again Lerp saves the day. impulse magnitude is the collision force of your character.

You can add visual feedback such as trails and jump Fx like the one I have on the upper gif.

And don’t forget to add a nice sound effect to it.

Extra Things

I’ve noticed that the player complained about the camera behavior in Crumble’s demo and I changed it to not collide with physics but only to hide it!

This can be done via shader and raycast. (I will do a devlog about it too)

I’ve added an effect of speed when you reach a certain speed, the effect …

Read More »

How about a devlog about a watercolor shader? Sounds good! And you don’t even have to bring your brush with you!

Inspiration

Let’s talk first about what inspired me to make this watercolor shader in the first place.

I’m a big fan of Moebius and when I saw the tweet from @harry I knew I had to try and emulate that sweet style.

And I think I’ve succeeded, you can see the result of the shader in the last LDJAM I did HERE.

Quick gif of it:http://web.archive.org/web/20201130175714if_/https://static.jam.vg/raw/b1b/91/z/28d20.gif

I’ll talk more about the design and the process and show some textures.

What we want to have

For it I want to have:

-A cutout texture

-Outline

-Unlit with colored shadow

-Moving shadow

-Moving textures

-Ink Fx Mask

The Base

We start with a base shader in Unity3D with light and texture.

This is the base shader for the watercolor effect. This includes color, texture, and fog.

I simply made patches of color and used the Fx tool in Photoshop to get a clear black outline, the background is transparent because I use the alpha channel to mask the base color of the asset.

Outline

The outline is pretty basic and doesn’t need a lot of explanation, only later because of the ink mask I’ve got for the “fade” effect.

Add the shadow

Now we’re going to have fun with shadow and it’s really easy to do in the fragment shader, also we can color the shadow in this process 🙂

The shader is getting a bit long so I retracted it. A couple of things to pay attention to, I added the line “uniform float4 _ShadowColor;” which is the color value for the shadow but it’s not a property in the shader, it’s a property modifiable via shader, but you can as well put a _ShadowColor in the property of the shader if you want to control it via material.

There is also the use of a smooth step function to control the shape of the shadow, which will be useful for what we need to do next!

Also on the screenshot, you can see some grains added by the post process of the camera, adding grain is a good way to have that watercolor paper vibe.

Make the shadow move

You may not want to have this in your game or for your visual assets but I like to have some kind of life in my environment and I prefer to do it via shader.

A moving shadow makes the asset look watery.

I’ve also added a color gradient for that subtle Moebius/watercolor color easing.

Don’t mind the magic flying values, I’m a math wizard.

The actual import part of the shadow control is here:

I use a lot of smoothstep to control how the shadow line should behave then I lerp it to a second inverted shadow line to get that saturated dark watery edge you get when you put too much water with watercolor.

There are many more things to the shader like a moving background texture declared at this line:

And the color gradient at these lines:

If you want to stop there you should because the next step is a bit more advanced and if you don’t know what you’re doing it will not work for you. The last one is good for a watercolor effect without any mask or additional effect, the only thing you can change to make it better is by drawing your own textures.

Ink mask

/!\ If you don’t want the mask use the shader code with moving shadows above!

This is an example for the use of the Ink mask in the project. It’s a great way to instantiate objects with Fx etc… And it keeps the visuals interesting and alive.

For that, you’ll need a RenderTexture and a Camera to render it.

This is the full final shader of the effect, I tried to clean it up a bit.

If you’re not familiar with using RenderTextures in shader let me explain with some lines from it.

Uniform means you’re getting it from a global value that you can modify via script much like how I manage the shadow …

Read More »