# Writing an Editor Extension to Customize Mesh Colours in Unity

I’m an engineer and a programmer, not an artist. This sometimes becomes an issue for me when I work on games as while I can make the game technically sound, the art is often downright horrible, or I spend way more time on it than I have any right to. I’m currently working on a long-term, back-burner type game project to keep me busy and distracted when I occasionally need a break from real life. Programming-wise, I’m fine, but what’s a game without art? Well, aside from Dwarf Fortress and most Roguelikes out there, it’s not much. Fortunately, I recently stumbled across (what I think) is a great art style: geometric assets, as shown below:

This is an art style that while it may take some ability to master and look great, I think it can look decent with relatively minimal work. Note that it is also really low-poly, so creating assets this way is great for mobile games (including things like the Ouya). For information on creating this look in Blender, I can’t recommend enough the cgcookie tutorial on it written / presented by Metalix Studios. After creating these assets, we must import them into Unity. Since Unity has such great support for Blender files, this is more or less of a non-issue, however when the models get imported into Unity they must use a special shader which will allow the colour to come out (these models aren’t textured at all). Metalix has also written a tutorial on this, but I found their script a bit cumbersome to use to colour meshes with, so I decided to mod it a bit for my own use.

My custom script makes use of an editor-extension to support multi-object colour editing as well as a saved palette of colours that you can easily pick from. This will take the inspector for these meshes from something that looks like:

Into something that looks like:

Since I try to organize my projects extensively, I started by creating a new script in a folder called Assets/Scripts/Customizations/MeshColour.cs, with the contents:

Note that there isn’t anything special here, other than remembering a mesh’s colour and keeping a static list of all colours in our palette. The real magic happens in a file I called Assets/Scripts/Customizations/Editor/MeshColourEditor.cs. Note that editor customization scripts MUST be located in a folder called Editor for them to work. Start off by adding the following to the file:

This just sets up the class to be an extension of the Editor class, for the MeshColour class defined before, and enabled multi-object editing on it. Multi-object editing is so that I can select say 5 trees and make them all the same colour at once rather than having to select each one individually. Next, we create a colour property which can be exposed to the user:

What this did was allow us to change the colour of the colour property (which points to the MeshColour.meshColour variable we defined in MeshColour.cs) across all the selected instances of objects with the MeshColour script attached. However, the script still isn’t that useful: if you run the script at this point, it won’t do anything (or at least, it won’t seem like it’s doing anything, as it’s just changing the meshColour property, which doesn’t actually apply colours to the meshes). In order to apply the mesh colour to the selected meshes, we’re going to need some more code:

A lot changed here, but I will try to go over it all. First up, in the OnEnable function, we get a list of all the transforms that the user has currently selected using Selection.GetTransforms. The options here will pick up all child transforms that aren’t prefabs (we don’t want to mess with those) and that are actually modifiable. Next, we go through our list of transforms and collect a list of all the meshes that are associated with those transforms (skipping any transforms that don’t have a mesh attached). For each mesh that we have, we actually instantiate a new copy of the shared mesh. This will result in a new mesh being created for each object (instead of each object sharing the same mesh) which will allow us to have multiple models but with different colours. Note that doing this will increase the number of draw calls, but I will address this issue in my next post. This OnEnable function will be called each time we select an object with the MeshColour script on it, so this list will only be updated when we select objects (which is what we want anyway). Next up, in the OnInspectorGUI function, we check if anything changed in the GUI (either the selected colour changed, or a button was pressed, etc). If something need change, we loop through all our previously stored meshes. For each of those meshes, we loop through all the vertices of that mesh and assign the new colour to those vertices. Once we’ve assigned all the colours, we store it back in the mesh, and we’re good to go!

The above script works great, but I find it beneficial to generate a “palette” when I’m creating these assets so that I can quickly set the “trunk” colour of all my trees to be the same brown, for instance. While the Unity colour picker does allow you to save preset colours, you can’t access them until you’ve clicked on the colour box and moved your mouse over to the window - an inefficiency we can [relatively] easily solve. To add this functionality, we get to the following version of the script:

What this added code does is first add two buttons (and a label) in a horizontal line across the inspector. When the + button is clicked, it simply adds the current selected colour to the static list stored in the MeshColour class (the palette of colours is stored as a HashSet so that we don’t get duplicate colours). Similarly, - removes the colour. Next, we draw the Palette. We loop over every colour in our list, and for every 7 colours, we start a new horizontal row. In that row, we set the GUI colour to the current palette colour a draw an empty button for the user to click on. If they do click on it, we set the colour property to the saved colour and make sure to update it with serializedObject.ApplyModifiedProperties() (otherwise the colour picker won’t get updated). And that’s it!

With this script in place we can now easily colour meshes to our hearts content! There’s just one more thing we can do to make our lives a bit easier, and that’s to create an easy way to add this script to all the meshes we want to colourize. I do that by adding a menu item to unity that when pressed will add the MeshColour script to all selected objects with both a MeshFilter and a MeshRenderer component attached:

This code just adds a menu item (in the “BlazingMammothGames -> Geometric” menu section) that when clicked will show a popup window. With a place to put a material. This will be the material used when adding the MeshRenderer component. When the Add it! button is clicked, we loop through all the selected transforms and add the MeshColour component to each one that has both a MeshFilter and MeshRenderer component, injecting the material along the way.

Voilà!

# Simple Bézier Curves in Matlab

I’ve always been curious about how [Bézier] cubic splines are generated and I how I can use them in various projects (game development probably being the most immediately obvious). If you don’t know what I’m talking about, Wikipedia has a decent if somewhat tedious description. After digging through the math, I came up with these results which I’ll share for the simplicity of it all (they really are simpler than I ever though). I found most sources started at the beginning and gave huge mathematical backgrounds, which although are nice, are typically just not what I was looking for. What I was looking for (and what is presented here) is just the end result - given a set of input weights, how do I calculate the actual spline?

First things first, this is the kind of spline I’m talking about:

Bézier splines are parametric curves, meaning instead of a function like: $$y(x) = …$$ you instead get functions like:

Where $t \in [0, 1]$. This isn’t a big deal though, and in fact makes our lives even easier - we can just create a list of points in between 0 and 1 and get the corresponding x, y, [and z] coordinates that belong there:

The next thing we need to know is that $x(t)$ and $y(t)$ are just polynomials, defined as:

Where $A \ldots H$ are just coefficients. These coefficients can be calculated as such:

and:

Or, if you’re not big into matrices and vectors:

Note that the equations are essentially the same for each dimension, so $z$ would follow the exact same format (note how the $y$ coefficients are calculated the exact same way as the $x$ ones).

In order to construct this in Matlab, we could do something like the following:

Such that we get points like:

We can then calculate coefficients as such:

Finally, to create the parametric curve we can combine everything:

So that we get something like:

Note that the “resolution” of this is entirely dependent on the number of points that exist in $t$. By default, in linspace, this will be 100, but we can easily drop that down:

Which results in:

And we’re done! That was a lot easier than I was expecting!

Note that this formulation is just for one segment that would typically be part of a much longer line composed of multiple segments. If we wanted to connect two segments together, in order to make the connection smooth all we have to do is ensure the slope of these curves are equal. The easiest way to do this would most likely be to calculate $(x_1, y_1)$ in the second segment using $(x_2, y_2)$ and $(x_3, y_3)$ from the first segment such that:

(Use the same formulation for the $y$ dimension).

I’ll probably post more things later, such as how to calculate the length of each spline segment so that we can do things like determine appropriate $t$ resolutions and calculate total lengths of lines etc, but hopefully this will get you off to a start right now!

# Switching to Octopress

My biggest issue with Octopress (Jekyll, really) so far is that it is written in Ruby, and I downright HATE Ruby. I don’t know what it is about it, but Ruby and I never get along. For example, I spent about 7 hours last night just getting the Octopress rake up and running - for some reason or another I continually ran head-first into Ruby errors, Gem errors, and bundle errors. The only reason I didn’t give up was because I couldn’t allow myself to be bested by a dumb system.
I did somehow get things to work in the end (don’t ask me how, I’m not totally sure myself), and so that’s what you’re seeing here. And really, I can live with those headaches if it means I get to git my blog, write posts in Markdown in Sublime Text, and even make use of some Sublime packages for easy deployment straight from Sublime. I still have some extra customizations in mind, but given that they’ll have to be written in Ruby, it might take a while for me to get those together and working. Maybe once I’ve gone through some real projects and code with Ruby I’ll appreciate it more, but for now I’ll be sitting here plotting on ways to pipe things through Python instead…