Pixel Art Avatar Creator

As a solo game developer, I make a lot of pixel art. Often times I find myself needing to create new and unique characters to put in the games I make. Because of this, I came up with the idea to create a pixel art avatar creator.

The Idea

What I wanted to accomplish was to make a tool that would make it easy to generate new ideas for characters and give me a base to work off of if I wanted to do more editing. This would save me time and hopefully generate some already good looking pixel art right off the bat.

Creating the Tool

I decided that the easiest way for me to go about this would be to make a website and code this tool in TypeScript. I used NextJS and React to create the app and HTML canvases to render the elements.

The version you are seeing is actually my second iteration of this tool. The first one created sprites like the following you see here.

However, I ended up starting again from scratch as, when I first made the original tool, I was very new to NextJS and React. I am still quite new to these tools, but I am much better at them now than I was back then.

Since this was the case, I was able to script things in a way that would easily allow me to add more options in the future. I plan on using this tool, so I wanted to make sure that I could easily continue to improve it as needed.

Final Product

The completed tool came out much better than I had hoped for, and I am proud of the customizability that is possible. The following image shows some characters that were made using the tool.

One thing that did occur though is that I feel like all of the creations I am able to make with this tool appear quite feminine. I'm honestly not sure what is causing the characters to look this way. Since this is the case, the tool seems much more suited towards creating females or feminine characters. I was experimenting outside of the tool with creating a more masculine looking character and will experiment in the future to add more options to accomodate for this.

As mentioned previously, one of my goals was to be able to use the sprites generated from this tool as a base. After working some ✨ pixel art magic ✨, I was able to create the following sprites that I am quite proud of.

If you would like to try out the tool yourself, you can do so here: https://pixel-art-avatar-creator.vercel.app/.