The Character Creator
Once I finally finished setting up the Dynamic Pixel Mapping system, I came to a bit of an epiphany. With all of the systems in place, I was in the prime position to make an interactive character creator. It would streamline development of my own characters, it would be an excellent showcase of the technology in an easy to grasp way, and it also would encourage people to leave an imprint and get attached to the project. My only barrier was actually figuring out how to do it. Here’s a direct quote from my personal notes, debating the issue:
What I need to have a character customizer system
Option 1: Aseprite Export
Separate Aseprite window that exports directly to a unity instance
Pros: I wouldn’t have to make an art editor
Cons: Both windows can’t be active at once, clunky for user
Option 2: In Game editor + networking
In Game pixel art editor with color selector, erasing, undo, redo, maybe even bucket fill.
Maybe choice to draw on sprite or skin map
Specific options for areas of customization and behavior
Exporting created to an online database every instance in connected to
Mobile friendly???
Full HTML Support
Network because at the showcase users would want to make their own characters without obscuring the action
Once created that character is sent to every instance and spawned in a reasonable amount of time.
Pros: Most user friendly, more complete
Cons: I’D NEED TO MAKE ALL THAT IDK HOW TO DO THAT?!
Pros of character creation:
It’s cool
Adds another layer of interaction and personality, very engaging
Takes full advantage of and really shows the potential of dynamic pixel mapping
I eventually went with the second option when I came upon this tutorial: https://www.youtube.com/watch?v=_Y0GqcF5qqM
Here’s another excerpt of my notes from the time:
The tutorial I found for drawing used Unity’s UI Toolkit. It seems like an alternate, more user friendly way to create UI. It reminds me a lot of website builders with all the inline and flex box stuff. I like the usability and platform flexibility but I don’t like how locked off it is. I can’t access UI elements from the general hierarchy and I can't tweak many of the built-in assets. I feel like I’m playing their game. I’ll probably use it for this project. One, to learn a new tool, and two, because I’m too lazy to migrate all my work.
But onto the good stuff, what did I accomplish? I got a basic black 32x32 canvas that the player can draw on. The tutorial stopped short of a color picker but I snooped around some of the example code and other tutorials and made my own. I felt like a god! Taking and bending these unfamiliar systems to my whims. There were still a ton of bugs no doubt but I think I’m in a good place. The player can now draw, pick colors, and clear the canvas. It’s obvious what needs to come next.
The tutorial covered the basics and framework, but the large strokes (pun intended) were up to me. I followed various tutorials and sources to figure out pen tools. I reverse engineered Dynamic Pixel Mapping to create a preview version in the editor. Actually drawing on the assembled character was something I was very worried about, but the result was so exciting.
I don’t want any of this to come across as easy. This whole process of getting even a basic editor set up was a two-week endeavor, but the result was worth it. So much so that it kind of shifted the entire purpose of the project. What had once been mostly about the scene and atmosphere became a dedication to showcasing the tools that built it, which I’m not too torn up about in the end. I think the system is too cool for me not to give it the focus it deserves.
Importing and Exporting was a whole other headache that came later, really getting into the weeds of the file system. This was all a really great lesson in how to handle Render Textures and files, but not one I’d like to revisit soon.
Once most of the baseline was in place, I was pretty ready to move on. The last thing I added was name encoding. Early on, I had the idea to store all the character information on the png itself, like how PICO-8 works. Various behaviors would be informed by the colors of certain pixels. The name could be encoded in colors even, the red, green, and blue values mapping to letters. The first bit didn’t make it in but the name encoding worked and was super cool.
Near the end of the project, I came back and refined the editor, adding the paint bucket, undo and redo, multiple poses, proper layer support and more. This was all because I came up with the online Character Catalog. My goal with the catalog was to showcase user generated content and that meant going beyond just posting the skin maps. I needed to generate what they would look like in-game. Thus, I made a dev build specifically for exporting high-resolution versions of each frame to be posted on the website.
With that complete. The Character Creation system was complete. Overall, I’m super happy with the result and proud of myself for really diving into unfamiliar territory and navigating my own way through!
