I have this idea for creating a character customization system. The system would be implemented as follows.
1) Organize a base template sprite sheet with character components arranged in a composition for future compositing. Example:
Lets assume a full body template for a characters design is 125 by 125 consisting of head, body, and leg components. The head component of the character would use 25 pixels and would be isolated on separate parts of the sprite sheet that occupies the respective pixels while the rest of the 100/125 pixels are blank. The same would be done for the body and leg components.
2) Bind the components together via some sort of linked list or maybe even graph based implementation.
I'm still learning about graphs and am thinking they're best for this system given compositing more complex sprite sheets will involve layers. Any advised implementations or any kind of information on graphs associated with player creation systems is highly appreciated. I think this is a great opportunity to practice graphs.
3) Next there will be an interface that allows the player to choose the color and textures of each of these components. The player will confirm and submit their design when finished.
Now that the player has submitted their design, I'm a bit puzzled about the next step and have a few ideas on composing the data.
4a) Use Phaser api to turn the data into bitmaps? I don't know much about this implementation yet since I'm still learning how to utilize bitmaps and how Phaser handles bitmaps
4b) Composite the items on a canvas and store it in a uri using the canvas to url method. I also lack experience with api but I definitely can see how it would work.
5) Ideally I'll save the data to a database and retrieve them via player credentials.
I'm not sure if I'm over complicating things or not so any feedback would be appreciated. I use Phaser but any html5 based idea or solution should be fine.