• Register
Post news Report RSS Xisto Devlog #02 – Mask Customization

Making the player’s mask feel unique and personal.

Posted by on

This week in Xisto, we’re finally talking about masks.

Hello all, and welcome to our second attempt at bringing you weekly Xisto updates. Now, you may or may not have noticed that these updates aren’t being posted exactly every week, and that’s because we've never really set deadlines for doing so.

However, let’s take advantage of this self-deprecating moment to introduce you to our Xisto '22 Roadmap. It should help you visualize the team’s development plan, creating some transparency in-between us (besties), and consequently making us commit to delivering on time.

As you can see, we’ve just driven past and completed the Masks Update, which focused on reworking the way masks were edited and saved. Coincidentally, it’s also what we’ll be covering today, so let’s get to it.


Mask Editor 2.0

Accessing the mask editor remains the same as was originally planned, by speaking with this charming (placeholder) fellow located at the village entrance, the artisan. He’s the one responsible for making everyone’s custom cork masks. His only requirement is that the player has at least one ornament to place on the mask, as to make it more unique on its first version. These ornaments are random objects that can be found all around the village: lost, given away, or hung up on trees by other participants.

Mask Shape

The player is now ready to start crafting his mask, and the first thing to edit on a new/empty mask is its shape. Let’s start by looking at what has changed since our previous mask shape editor iteration.

As can be seen in this first step of the mask editor, our goal with this entire revamp was to remove the User Interface of the player’s face and turn it into something more diegetic, that belonged to Xisto and the artisan. In this case, it’s a “Shape your mask” sheet that he hands over to the player. The scene still needs some polish to get all prettied up, but this is the general idea of what we’re going for.

For those that are curious as to how the mask model is being controlled, I won’t get into much detail (since it’s not my area of expertise), but basically, its 3D model contains blend-shapes in targeted areas, which are then manipulated using the sliders.

Future updates might bring to light some more cartoonish options out of these sliders, but we think this is a solid set to start with.

Mask Decorations

Now that the shape is set, we move on to the next stage, decorating! And what could be more fun than dumping all the random stuff you’ve been collecting onto the table and start placing them on your mask at will? This mindset was already halfway implemented in our previous mask editor iteration, but it didn’t look the way we wanted it to. Let’s see what changed.

That basic inventory system look-a-like had to go. Not only did it look wrong, but it also brought problems that we shouldn’t have to worry about. It became evident that it would be easier to implement, more visually appealing, and fun to simply spawn all the player’s items onto the table and let him mess with them freely, placing or dropping them wherever they want.

Our one limitation as of right now is the item’s rotations. They are working ok, and the player can place rotated items on the mask, but it’s not practical. Basically, every time they rotate an object and then move it, or try to move an object while rotating, its rotation will reset. And that’s not a bug, it’s a compromise that I (this one is on me) had to make since I couldn’t find a way to stitch together the 2 different item rotations that need to happen:

1. The automatic one that ensures the item is placed correctly on a curved mask:

2. And the manual, player controller one:

It’s a problem that will surely be fixed eventually when the lightbulb in my head turns on, but until then it will remain a low priority bug, compared with all the other ones already haunting my dreams...

Final Details

We’re treating this as a third step since it used to be in our old iteration of this editor. Now, however, it’s mixed with the decoration step and there is no wrong order to execute them. It allows for the player to control the bump of the cork material, thus playing a little with its detail. Here’s how it used to look before and how it looks now.

MaskMatV2

In this new iteration, we ended up deciding that there was no reason for this to be its own step, so we turned it into that yellow post-it note, almost like a “before you buy” type of reminder. There is also an extra slider now, I took the liberty of separating the mask and props cork materials, just so that they can be controlled individually, this way the player can play a little with the contrasts between them. Ideally, we’re looking to expand on that idea and maybe add some sort of coloration or brightness to it, without taking away the cork aesthetic.

Reshaping

Let’s say the player starts decorating his mask and realizes that the shape he chose before isn’t working out for the decorations he has available, he has the option to clear all that junk off the table and reshape.

Here’s the catch, since reshaping messes with the mask’s curvature and limits, updating any placed props would be an extra layer of work that we simply didn’t find justifiable for what it is. Instead, we decided to clear all mask decorations and return them to the player inventory. This is obviously prompted with a dialogue line from the artisan so that the player doesn’t realize that his mask was cleared the unfriendly way.

Crafting

Just by the name itself, it should be self-explanatory (but allow me to explain it either way). When the player is satisfied with his mask, he can choose to craft it and return to the game scene with it equipped.

CraftMask

Forgive me for the super short GIF, but this one specifically was way heavier than all the rest and this ended up being the only way to make it fit here.


Cool, cool… Now make it mobile

For a game so dependable on mask customization, returning to the artisan every time the player wants to customize their mask would be downright tedious and demoralize customization. That's why our artisan has adapted his business model to go fully mobile.

With this ground-breaking Xisto tech, the artisan’s workshop will go to the player instead, when called. This was briefly looked at in our previous devlog, where we covered the whistle tool, but it wasn’t implemented yet so we couldn’t show it in action. Here’s the little audio cutscene we got set up for our very own “uber-masks”.

You're just going to have to imagine the sound of the artisan running towards you, with his table-cartwheel squeaking and drifting in the end. Ideally, this will eventually have some animation incorporated, if we find the time during the polishing phase.


Before we go… photo mode?

Since I haven’t lost you yet, I’ll use this space to bring up an idea that was only seriously discussed this past week, photo mode.

Customizing the mask is fun (and crucial to progress) but as of right now there is one core aspect missing from it, which is being able to inspect it in-game, from up-close. We feel like everyone should be able to appreciate their work of art after it’s complete. And what better way to do it, than a photo mode? A close-up of the player’s mask and some background, whatever they find worthy of placing in frame with them.

Here's a little reference image my friends and I got from Destiny 2 the other day:

The camera would work like all the other tools and the photos could turn out to be little polaroids, maybe with a short description even, that would be stored somewhere in-game just for you, but that we’d obviously incentivize to also share online. You get bragging rights; we get free publicity.

Let us know if you think a photo mode would be a worthy addition. We’re heavily leaning towards it, but we’d place it in the final polishing update, as we have more important issues to get to first.

And that’s a wrap from us this week! I hope this lengthier devlog was at the very least entertaining and worthy of your time. Thank you for reading and stay tuned for more updates!

IniciadosLogo45 OnCircle 01

Until next time,

André Santos @Iniciados


Post a comment

Your comment will be anonymous unless you join the community. Or sign in with your social account: