Stagnant

Stagnant is a visual novel game, created as a university project. I was the character designer, UI designer, and also did some programming for the project.

Project Description

• Project Type : University project

• Duration : 19 June 2023 - Present

• Engine : Unity

• Language : C#

• Roles : Character Designer, UI Designer, Programmer

• Other Apps : Figma, Clip Studio Paint, Procreate, Photoshop, Illustrator

My Contributions

Character Design

At the beginning of the project, I was supposed to only work as the UI designer, but due to a shortage of people to work on the project, I was also tasked with designing the characters. During the pre-production, the script for the game was not yet done, and all I had was a short summary and descriptions of the characters that would appear in the game, they did not even have names yet. The director wanted a painting-like quality to the visuals of the game, which was quite a struggle for me to do at the beginning as my art-style is line heavy, but I manage to get the hang of it eventually.

More artworks and concepts can be found on the gallery below this article.

Here is an example of my design process for the Fiancé character:

Designing & Creating UI Assets

Since the game is a visual novel, it mainly consist of UI and art assets, with the bulk of the gameplay revolving in player clicking and making choices.

I sketched up the UI, factoring in to what the project leads want in their game, what kind of gameplay mechanic they wanted to add. Originally, there would be a sort of point and click adventure aspect, with minigames, but the latter was scrapped.

I used Figma to create a mockup for the UI, as at the time, there were some problem in the programming department of the project and I cannot use the game project itself when designing the layout. Using Figma allows it to be interactable, which help the feedback i got.

One key design element that was originally supposed to be more prominent was the phone, such as chatting, minigames, and other functionality. But due to some setbacks, the phone functionality in-game was reduce significantly.

During the implementation stage, I was asked to change a few assets, like the phone and the timer to look more painting-like, as it clashed with the art style of the game.

UI Implementation & Programming

I implemented and programmed a few UI elements and functions in the game. Here are a few snippets of the scripts that I wrote.

Phone Menu Script:

public void ActivatePhone()
    {
        if (!isActive)
        {
            //phoneMenu.transform.DOMove(new Vector2(targetPoint), 1);
            Vector2 reset = resetPoint.transform.position;
            Vector2 target = targetPoint.transform.position;
            phoneMenu.transform.position = Vector2.Lerp(reset, target, 1);
            //phoneMenu.transform.position = target;
            isActive = true;
            phoneConent.SetActive(true);
            anim.SetTrigger("Active");

        }
        else
        {
            Vector2 reset = resetPoint.transform.position;
            Vector2 target = targetPoint.transform.position;
            phoneMenu.transform.position = Vector2.Lerp(target, reset, Time.deltaTime * 2f);
            phoneMenu.transform.position = reset;
            isActive = false;
            phoneConent.SetActive(false);
            anim.SetTrigger("Deactivate");
        }
    }

Automatic Button Stylist Script:

public void EstablishType()
    {
        switch (buttonType)
        {
            case ButtonType.Bedroom:
                buttonIcon.sprite = bedroomIcon;
                buttonText.text = "Bedroom";
                break;

            ....

            case ButtonType.Car:
                buttonIcon.sprite = carIcon;
                buttonText.text = "Car";
                _SC.ChangeScene("Car");
                break;
        }
    }

Various Art Assets

Check the art gallery for this project here!