Magical Pencil – Unity Client

Do I need to document everything? It’s super long if I do so.

I think it’s better to put a link to the source codes and only explain essential parts here.

Source Code

Before I start.

In the past, I’ve only made one unity projects, the VR one called It’s Time to Go to Time. I didn’t know too much about Unity at that time. I only know Start and Update and considered the whole engine as a P5js canvas.

This time I’m going to be serious, so at first, I spent two days on learning two basic courses:

  1. C# Essential Training.
  2. Unity 2D Essential Training.

Each time I learned something from Lynda, I feel empowered and willing to channel my power into some project. In another world, I was so motivated and want to make a game immediately!

Then I did it, and those two coursed helped me so much.

Here are my steps for making this game.

1. I designed this structure:

  1. Basic scripts
    1. Items behave differently in different contexts, so there is a script managing context, which other scripts can check and set contexts.
    2. A script manages all the behaviors of items.
    3. A script allows the user to draw and can send this to my prediction server.
    4. A script manages how puzzles are solved.
  2. More
    1. A script allows spawning item into the game world.
    2. Some of the items can be picked up, so there’s a script managing inventory.
    3. A script manages player’s HP.
    4. When an item was spawned on the ground, a script managing its interaction.
    5. When an item was picked up in the inventory, a script managing its interaction.

How to paint in Unity.

I found a tutorial on youtube, learned a lot from it, then improved his solution.

It’s interesting that the way you take a picture in Unity is by using a camera in Unity.

My Script

So I create a canvas in Unity, use RayCast to find where the user is pointing. Then, if the mouse is pressed, store the mouse position in a LineRenderer. When I finish a stroke, I take a picture of the canvas using a camera and send the image to my API server.

Make a 3d feeling scene in Unity

I drew the first scene in different layers, then place them in different z position to create a 3d perspective.

Spawning items with user’s doodles as sprites.

This can be done in OpenCV, but OpenCV for Unity cost 90 dollars. So I created an API to turn drawings into sprites, then return to Unity to spawn it as sprites.

My Script

Invoking function in C# is such a neat trick

Items have different behavior in the real world, hence needing different functions in Unity. How do I know which function to call?

if (name == “broom") SweepTheFloor();

That’s brutal, yet stupid because it’s impossible to make 340 ifs. Then I categorized all the items into around 30 categories, then check the category and call the corresponding function. Inside the function, I check if this has some particular function to call.

That’s still too dirty, though it’s survived the Quick & Dirty Show. However, when I try to rebuild those functions, it’s a pain in the ass.

Then I come up with a new idea. Can I define which function to call as text strings in the database, then in the game, I try to find a function with the same name?

Yes, luckily C# provides a way to make this happen.

So I can write those functions and store their name in the database.

Then I invoke them when our character is using the item.

    public void InvokeItemFunction(int id, Sprite sprite, string functionName, GameObject gameObject)
        MethodInfo mi = Instance.GetType().GetMethod(functionName);
        if (mi != null)
            Item item = ItemData[id];
            mi.Invoke(this, new object[] { item, sprite, gameObject });
            Debug.Log(functionName + " doesn't exist");
            UIManager.Instance.ShowTip(ItemData[id].StoryOnUse + "\n (this function is not finished yet)");


Then my classes are tidy and clean now.

Leave a Reply

Your email address will not be published. Required fields are marked *