Month: July 2017

This week, I’ve been focusing on making sure that the “combat” scene was functional so that my artists could start playing around and adding assets in the first arena. I had a functional 2D UI system working for the combat at first and then translated that into the 3D world as we were planning to make all the UI in 3D space. That wasn’t very hard to do.

I figured out why my csv reader was very inconsistent (which I’m both very happy and annoyed about because it was such a minor thing) so I’ve moved on from working on the dialogue system and focusing more on the combat system now!
Marc set up a scene with some assets that we could use to test everything out and I made sure that my system was working correctly.

Today, we got a couple of people, including myself, to do some voice lines for a few of the characters that will be in our game! It was definitely an interesting experience, the setup that the little recording room had was really cool too! I also realised how horrible I am at voice acting 😀 Please don’t cringe

It’s another technical post kind of day. If you’ve ever struggled with making trees for a game, I have walked through the valley of shadow and ugly normals so you won’t have to. This is the forbidden knowledge I have been given by the nyrns of Blender.

Chapter 1: The Branches

What does it mean to be a tree? For starters, you’re going to need a trunk and some branches. Obviously we don’t want to waste any time, so modelling it all by hand is out of the question. Instead, start with a curve. A bezier curve, in fact. Before you start positioning the points of the curve to start your tree, you’ll want to match these settings in the curve data panel:

The important parts here are setting the fill of your curve to full to make sure your trunk wraps all the way around your curve. The bevel depth decides how thick the trunk is displayed, the bevel resolution will make your trunk smoother at cost of more triangles. I’d recommend keeping it as low as possible while you’re building the tree and then fine tuning it later before you convert it all to mesh. The same goes for the the Preview U panel under the shape resolution. Less is more as it gives you more control while building.

Now is the time to grab the control points, move them around (G) and extrude (E) to shape them into a base shape for the tree¹.

Now that we have this jumping off point, you can just duplicate (Shift+D) the curve in object mode², jump back into edit mode and do the same to make a few branches. You don’t have to go overboard with making a realistic amount of branches with sub branches since we’ll be faking the way the leaves grow anyway, but feel free to go into as much detail as your poly budget can afford.

Now that we have a barebone skeleton for the tree, it’s time to adjust the resolution settings to get as much fidelity out of the curves as needed. It’s a good idea to jump into wireframe (Z) to see how the actual geometry is turning out.

Once you’re happy with the number of edge loops, select one of the curves in object mode and press Alt+C to open up the Convert To dialog. Select Mesh from Curve and repeat for any other curves you’ve made.

Unfortunately, you’re still stuck with an alien looking mess of tubes, so let’s remedy that. Select one of the new meshes and go into edit mode. Now before we start pushing vertices around, make sure proportional editing is set to connected like this: . I like to use a sharp falloff, but just use whatever works best for you. Now you can go around the branches and select an edge ring with Alt+Right Click. Make sure you’re in vertex selection mode and hit Alt+S to expand the vertices out or in, increasing or decreasing your proportional editing range with the mouse wheel.

You might need to move some of the branches’ end points around to hide the ends inside the trunk. You’ll still be left with hollow caps where the branches point outwards, so just select the vertices around the ends, extrude them out a little bit and merge them with Alt+M in their center. Now is also a good time to merge all the meshes into one.

Finally, you’ll probably want to UV the base of the tree before we continue. I’m just going to cut one seam along each branch, making sure it faces in a direction that won’t easibly be seen by the player. The quickest way to do that is to make sure Live Unwrap is enabled in the Tools Window (T in the 3D View to display that), then select one of the starting vertices on a branch and while holding control, select the end point and marking a seam along the now selected edges³.

¹I’ve decided I’m making a shrub here, but it all applies to trees as well, it’s all about the shape.

²You could theoretically do it all in edit mode, but making a separate curve for different elements allows you to adjust the resolutions for them later.

³Results may vary on complex branches. Always make sure to check what the algorithm actually selected before committing.

Chapter 2: The Leaves

Before we can make the tree magically grow leaves, the tree needs somewhere to grow the leaves from. You could grow them directly off the branches, but that would result in a very strange, fuzzy looking tree. Instead, we’ll make a few spheres that the leaves can grow off which gives a whole lot more control over the final look. Start by creating an Icosphere, going into edit mode and moving a few duplicates of the mesh into place. They don’t need to be very high resolution, so make sure to set the subdivisions of the sphere to 1 when you create it. Also, make sure create UVs is off.

Set the shading to smooth and open up the UV editor with all the faces of the spheres selected. Load in a leaf texture and you’ll see these terrible UVs:

Conveniently, that’s exactly what I want in this case¹. That orange triangle is every face on the spheres UVd individually. Now it’s just a matter of select all of these, scaling them up a little and you have yourself something that looks somewhat like leaves from a distance.

Of course, it still looks atrocious close up. If you’re aiming to make LODs for this tree, I recommend you create a duplicate of these spheres before continuing, since they work great for seeing the tree from a distance and are really cheap to render. You’ll also need a backup of the object again at a later point, anyway.

Moving on, it’s time to give the tree its foliage. In order to that, you’ll need a leaf plane. Create a plane, name it LeafPlane and enable Generate UVs and assign the leaf texture to it. Jump into edit mode, select all the vertices of the plane and move them so that the pivot of the plane matches up with the stalk of the leaf².

Now we make the magic happen. Select the spheres surrounding the tree, navigate to the Particles panel and press the big New button to create a new particle system.

The aim here is to create a hair simulation that uses the LeafPlane we’ve just made to give the tree its fluffy leaves. To do that, change the particle system type from Emitter to Hair. There’s quite a few settings we need to tweak here, so I’m just going to list them down with a screenshot on the right. I’d encourage you to play with the settings as much as you can to see what works for you. Once you’re happy with the result, create a backup of the object and move it on a different layer by pressing M and then selecting a layer in object mode, just in case you want to go back and make adjustments later.

After that, go into the modifier tab with the original particle object selected and press the convert button. Blender is now going to create an object for every particle, so make sure you don’t lose your selection now. Press Alt+C again and convert the selection to a mesh and then press Ctrl+J in order to merge them back into one.

I just quickly assigned a material with the leaf texture to the resulting leaves object and created a hemi lamp to preview the tree. It looks something like this:

It’s a nice start, but still not very good. All the leaves normals are pointing all over the place, making the tree look very early 2000s CG. But we can fix that! First, select all the leaves in edit mode, create a new Vertex Group and assign everything to it. Tab back into object mode and merge the leaves with the base tree (don’t forget to assign material slots).

Now bring in the earlier backup of the spheres you used to create the particle system. Go into edit mode, select all (A) and use Alt+S to expand the spheres until they completely cover the leaves.

For even better results, add a Subsurf modifier and make sure the spheres are perfectly round, polycount here doesn’t matter since the object will just be used to bake the vertex normal direction for the leaves. Apply the subsurf modifier before you move on.

Back in object mode, select the tree and add a normal edit modifier.

It may throw up a warning to turn on Auto Smooth. You can do that in the mesh tab next to the modifiers. Make sure you set the angle to 180 degrees so that everything on the tree is shaded smooth.

With that out of the way, it’s time to set up the settings for the Normal Edit modifier. Set it to Radial with the enlarged sphere as a target object. Select the Leaves vertex group as the mix target and, (this one is up to personal preference – experiment!) set the mix factor to 0.9 to keep a small amount of the original normal direction.

The leaves still won’t look perfect though! This is because the back of the leaf is always facing the opposite way to the front³. We’ll be fixing this in engine, so don’t worry about it.

Now the tree is ready to go into the engine of your choice. I’ll be moving on with Unity, but the principles are the same. All that’s left now is to export the tree as an FBX file. To do that, feel free to copy my export settings for Unity.

¹Because I’m lazy. There’s nothing stopping you from making a unique texture for the bubbles. I’d suggest a tiling version of the leaf texture with leaves thrown over each other to wrap around the sphere.

²If you want to, you can now add subdivisions to the plane and bend them around a little bit to give the leaf more volume, but it will exponentially affect your poly count.

³Duh. Seems obvious, but it took me days to realize this.

Chapter(-ish) 3: The Magic

Here is the part I was struggling with for a long time. How does one make leaves look leafy? The answer lies in the shadows. Standard shaders don’t work particularly well due to the way light works on leaves in real life. They tend to be somewhat translucent, so the back of a leaf will be lit up by the sun hitting it from the front, most shaders don’t accommodate for that. The solution: use a translucent shader or, alternatively, a shader that gives you full control over shadow colour. I found a great translucency shader for Unity by Farfarer that could serve as a good starting point for a custom one, although you will need to add your own transparency function. For Buto, we’re using the Unity Chan 2.0 shader, which means we get full control over the colour and grading of the shadow. The main thing is to keep the contrast between light and shadow on the leaves as low as possible. Ambient lights or global illumination help immensely, too.

All in all, once the right shader is in place, it all comes down to fiddling with colours and intensities and there’s your tree.

With the redesign of the main mechanic of the game being changed from combat based to dialogue/emotion based, I needed to go back and do new animations for Buto and Peace. eg. If Buto is using Fear on Peace – Buto will be trying to inspire Fear in Peace, so they need to react accordingly.

So Buto’s animation would be scaring Peace and Peace’s animation would be being scared by Buto.

Their expressions were the first thing I went and added to. I made each element separately like before, so they can be mixed and matched to create a ton of expressions as needed!

During the holidays, our team received a lot of feedback about the current state of the game. A lot of them were very eye opening and it showed us where our game was lacking and what needed to change. We knew that we had to rework the combat system so that its simple and fits our game better.
At first, we had several plans such as:

Changing from a real-time based battle system to a turn based system

Making sure that players don’t feel like they’re using cards but emotions

Not requiring players to fill all 6 mood bars as it didn’t feel significant enough and felt more like a chore

We’ll be using the Fungus plugin for Unity (which we used for our 2nd prototype) to handle most of our dialogue systems. To make it easier for us to input dialogue options in the long run, I’ve got a csv reader working properly so that we can easily edit spreadsheets instead of hard coding them in! I’m really excited to see how this new system turns out!

Yep, as usual we have decided to change thing up rather a lot! Nothing is set in stone for us, ever…

We have been feeling that emotions as a core theme of our game hadn’t been utilised entirely well through gameplay. This has been emphasised with feedback from all kinds of playtesters, from game designers to hardcore players to casual players. The battle scene was unclear and there were too many separate elements.

So, with the battle scenes, we’ve decided to go in a very different direction. They are no longer battle scenes per say. Instead, it will be turn based, and the core gameplay will be dialogue based. You will want to draw the ‘enemy’ towards you with words that evoke certain emotions. So, with that said, here is a basic diagram of the idea…

In this case, your opponent is Peace. Randomised statements from each set of emotions will be on screen and you pick one of them. In this case, as the opposite of Peace is Fear on the board, you will want to use mostly Fear statements. It is up to you to figure out what statements evoke Fear, however.

So, for example, there would be… say, 6 statements to choose from. They could be Peace, Joy, Wonder, Despair, Fear, and Rage.. BUT! There are also statements that are combinations of 2 emotions. Eg, Fear + Joy (Anticipation). Examples of a statement would be something like “I know it’s scary, but you can do it!” And those statements will nudge you towards both emotions. In total, there are 21 emotions to choose from.

After your turn, the enemy will drain your Will by a small amount. If you run out of Will before you pull the enemy towards yourself, then you lose. If you pull the enemy towards yourself before you run out of Will, then you win.

It’s complicated to write out but we guarantee it will be a simple mechanic. Just with a ton of writing behind it. We will be doing dialogue somewhat tailored to each enemy character, with 4 options for each emotion, so 84 lines per enemy character give or take as we can reuse lines for other characters.

Earlier on, when we started writing the characters for Buto, we weren’t sure which characters should be male or female¹. Does it even matter? They are bugs after all. We decided to hold off on it and just see what happens. Over time, it sort of just happened that Buto and Peace are both seen as boys, but again, what about the others?

Bug boy, bug girl or just a bug?

Something we wanted to be super wary of is associating genders with emotions. It’s just a little thing, but defaulting to all the generic stereotypes just didn’t really seem that original. You know, Rage being a boy, Joy being a girl and so on, it’s all so expected. On the other hand, the game is all about emotions. Emotions that everyone has, no matter who they are, so it’s really important to us to make it as easy as possible for people to see something of themselves in the characters.

In the end, we settled on purposely keeping the emotion-based characters’ genders as ambiguous as possible. Now, you might be asking yourself: “Who cares? It’s just a game” but coming to this decision reasonably early makes a pretty big impact on the game’s writing. For example, trying to not lock characters into genders is going to be a big challenge going forward writing the dialogue, since pronouns like “he” and “she” are not very useful to us anymore.

¹Or anything in between or outside but really, no need to overcomplicate here.