• Register

A story focused hack 'n slash ARPG, more about loot and hordes of enemies than endless skill trees.

Post news Report RSS Making a live paper doll display for the inventory

I was working on the character, adding some items and cloth, which changed the appearance of the character. I had added a stand in render for the Inventory, which I used to place the Item slots around. Of course that was immediately outdated and the connection to the character was jarring. So I wanted to make the paper doll in the Inventory display the items you have equipped and I didn’t want to need to handle two sets of characters wearing stuff.

Posted by on

I was working on the character, adding some items and cloth, which changed the appearance of the character. I had added a stand in render for the Inventory, which I used to place the Item slots around. Of course that was immediately outdated and the connection to the character was jarring.

So I wanted to make the paper doll in the Inventory display the items you have equipped and I didn’t want to need to handle two sets of characters wearing stuff.

The easiest way to accomplish this is to simply display the in-game model, which will be showing what is equipped anyway.

This was super fast to do. I just made a ‘Camera’ object that was a child of the character, changed the ‘Culling Mask’ to only render the character meshes, which I have in a separate layer named ‘Player’.
Then I created an empty ‘Material’ and a ‘Render To Texture’ asset (Right Click in the Hierarchy to quickly create them).

User Posted Image

Finally I assigned the ‘Render to Texture’ to the ‘PaperDoll’ material and then I dropped the ‘PaperDoll’ material in the ‘PaperDoll’ Image material slot.

User Posted Image

I also made the enemies have a Health bar display that follows them and changes how filled it is depending on the actual enemy health stats. In order to achieve this I updated the Label prefab to also include two image components, one with a normal image for the empty bar and one with an image set to fill type to ‘Filled’. I then just calculate the fill amount by doing this:

HealthDisplay.fillAmount = Health / HealthMax;

User Posted Image


And that’s it, in just a few minutes I had two features up and running thanks to Unity. Now I added a couple of small button under the paper doll which will allow you to turn around the paper doll and I will eventually make it possible to do this with the mouse directly by clicking on the paper doll itself.

Post a comment

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