Development Blog (Week 5)


Development Blog (Week 5)

I've been working on the UI for the game, in particular, the score and combo system, creating a fire shader to tie into this combo system. I also investigated a mobile version of the game.

Published on December 16, 2019 by Amy Elliott

C# Programming Unity Design & Research Shaders & Technical Art Dev Blog College

12 min READ


Please note: The code and content within this blog post is not representative of my current skills.


Week Number & Date: Week 5 - 16/12/2019

List of Tasks planned for this week:

Task List

This is all I had planned, I didn’t have any other idea of what I wanted to do this week, so I’ll be planning along the way.

Current Position -

What did I do this week and why did I do it?

Unity - Score/Combo UI

Since I managed to get both of my Score and Combo system working pretty quickly, I decided to do some UI.

Task List

DaFont font finding - Firstly, I thought it would be sensible to get a font which I like first, so I can do all of my sketches and my planning knowing what fonts I have available.
The college had blocked font websites so I had to download them on my phone and email them to myself.
These are the fonts I’ve downloaded, they’re all either 100% free or free for personal use. I’m going to go through all of these in Unity and see which ones I like the most.

Fonts

I made a google form on all the different fonts, asking people which font they like the most.

Form

Sketches/Planning -

I began by sketching my plan for how I want the text to be animated, and where I want the text to be on the screen, this has helped me come up with lots of different ideas.
Sketch Plan

Once I had a rough idea of what it would like I began planning out my combo system in more detail, thinking about what specific combos could do the effect the game and so on, I done this so I can put it into my game for testing.
Sketch Plan for Combo System

Colour Scheming -

I began this by making multiple GIFs with different colour schemes on them, and these are the ones I’ve made:

To help pick the colours I got a few people to vote on their favorites using a google form.

Vote

This is the winner of the vote on the google form:

This colour scheme is from the Suns colours!

Functionality - 

I wanted to test this by actually putting the fonts into the game and testing how everything would look like that, so I tried my first concept on my sketch, where the text would bounce out from the corner.
I had to make an animation, which is simple enough in Unity, it was a bounce animation so I used the animator tool and resized the scale with a keyframe and then back again, I then applied this to the text.
And to get the combo animation and displaying working, I had to add a few lines of code into my script.

foreach (ComboBoundary bound in boundaries)
{
    if (transform.position.y > bound.height && !bound.hasBeenHit)
    {
        combo++;
        Debug.Log(bound.comboText);
        bound.hasBeenHit = true;
        text.text = bound.comboText.ToString(); // This is the line I added
        comboObject.GetComponent<Animator>().Play("Text", -1, 0f); // This is the other line I added
    }
}

This is the result:

Unity - Fire Shader

Task

Now I wanted to add the fire to the player when they hit an ‘AWESOME’ combo.

This is how I got the fire to work, which means the fire instantiates above the player character and as a child of the character.

// Cinemachine Camera Shake script
public CinemachineCameraShake CMCamShake;
public AudioSource audioSourceChange;
public float currentPitch;
public GameObject comboParticles;
public GameObject Character;

// The particles and the character are there so I can apply particles as a child of the character

void Start()
{
    text = comboObject.GetComponent<Text>();
    CMCamShake.stopShake = true; 
    // This makes sure the camera doesn't start shaking when the game is starting.
}

void Update()
{
    foreach (ComboBoundary bound in boundaries)
    {
        if (transform.position.y > bound.height && !bound.hasBeenHit)
        {
            combo++;
            Debug.Log(bound.comboText);
            bound.hasBeenHit = true;
            text.text = bound.comboText.ToString();
            comboObject.GetComponent<Animator>().Play("Text", -1, 0f);

            if (text.text == "Impressive")
            {
                CMCamShake.stopShake = false;
                CMCamShake.ShakeAmplitude = 10f;
                audioSourceChange.pitch = Mathf.Lerp(1.05f, 1.0f, 0.1f);
                currentPitch = 1.05f;
            }

            if (text.text == "AMAZING")
            {
                CMCamShake.ShakeAmplitude = 20f; 
                // This sets the amplitude for the camera shake, how hard the camera shakes
                audioSourceChange.pitch = Mathf.Lerp(1.1f, 1.0f, 0.1f);
                // This lerps the pitch of the audio so it doesn't just snap up to the next pitch
                currentPitch = 1.1f;
                GameObject go = Instantiate(comboParticles, transform.position, transform.rotation) as GameObject;
                // This instantiates the particles to be where the player character is
                go.transform.parent = Character.transform; 
                // And makes them the child of the player character
            }
        }

        if (transform.position.y < bound.height)
        {
            bound.hasBeenHit = false;
        }
    }
}
using Cinemachine;
using UnityEngine.Events;

public class CinemachineCameraShake : MonoBehaviour
{
    public bool stopShake = true; 
    public float ShakeAmplitude = 20f; 
    public float ShakeFrequency = 2.0f;

    // Here are 3 variables, the bool controls if the camera should be shaking or not, 
    // and the floats deal with how much the camera is shaking

    public CinemachineVirtualCamera VirtualCamera;
    // Here's a public variable to access the Cinemachine Camera

    private CinemachineBasicMultiChannelPerlin virtualCameraNoise;
    // Here's a private variable to access the noise of the camera

    void Start()
    {
        if (VirtualCamera != null)
        {
            virtualCameraNoise = VirtualCamera.GetCinemachineComponent<Cinemachine.CinemachineBasicMultiChannelPerlin>();
        }
    }

    void Update()
    {
        virtualCameraNoise.m_AmplitudeGain = ShakeAmplitude;
        virtualCameraNoise.m_FrequencyGain = ShakeFrequency;
        // This makes the camera shake

        if (stopShake == true)
        {
            virtualCameraNoise.m_AmplitudeGain = 0f;
            // This checks if the stopShake bool is true, and if it is, it will stop shaking
        }
    }
}

This is the fire shader I made and how I made it.

Fire Shader

This shader basically takes the texture of the fire and distorts it using Perlin Noise, it also moves it along an offset with time properties so it flickers like a flame, I then made this shader into a Material, and then made a particle system using that material to make the fire, I also added some smoke.

Task Done

Unity - Stylish Combo

Task

Even though I’ve completed this, I’ve tried to simplify my scripting, to make it shorter, since I know I could use a for loop and have one array which has 3 values.

Code

This has made the code a lot cleaner and shorter then it used to be.

Task Done

Unity - Attempt to make mobile tilt controls

Task

All this is is just messing around with mobile builds and see how the game plays on mobile.
The script to get mobile tilt controls to work with this is very similar to how you get normal move controls to work.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class _MobileControls : MonoBehaviour
{
    [SerializeField] float speed;
    Rigidbody rb;
    public bool isFlat = true;

    void Start()
    {
        rb = GetComponent<Rigidbody>();
    }

    void FixedUpdate()
    {
        Vector3 acc = Input.acceleration;
        if (isFlat)
        {
            acc = Quaternion.Euler(90, 0, 0) * acc;
        }
        rb.AddForce(acc);
    }
}
Result:

I didn’t like this result at all, I was very disappointed at how poorly the tilt controls worked and how slow the game ran on my mobile, the reason it is running so slow is perhaps down to the shaders and the amount of memory which is being used on my game to get each building to move to the music, and each building having a mesh collider instead of a box collider.
I figured that it’s probably not the best idea to have this game made for the mobile.

Task

Unity - Score UI

Task

This was fairly simple to get working, all I had to do was add my UI and then reference it in my _Points C# script 

public Text scoreText; // Here

public ComboBoundary[] boundaries;

// Cinemachine Camera Shake script & particle FX
public CinemachineCameraShake CMCamShake;
public AudioSource audioSourceChange;
public float currentPitch;

public GameObject FireParticles;
public GameObject DustParticles;
private GameObject spawnFireParticle;
private GameObject spawnDustParticle;
public bool hasHitTOP = false;

void Start()
{
    text = comboObject.GetComponent<Text>();
    CMCamShake.stopShake = true;
}

void Update()
{
    scoreText.text = score.ToString(); // Here
    foreach (ComboBoundary bound in boundaries)
    {
        
    }
}

Reference

Task

I found making the Score UI easy, but getting the combo stuff to work was a slight challenge until I thought of it in a different way, and then it was easier! At first I was going to determine the combo stuff by checking the players Y-Axis but, then I thought using bools and floats would be easier to make it much more accurate.
I found instancing the fire just right to be a bit of a challenge, but I eventually done it!

Planning for next week - 

  • How do I plan to catch up? Do I need to change anything about my work or planning?

Next week, or after Christmas, I plan to work on sound effects for the game and making more of an impact on the player by having the score interpolate up instead of snap to the next value, and having sound effects, and making a start on menu screens.