• Register
Post news Report RSS UI design

The last week I was working on UI design for my current project The Cursed Iron Cavern.

Posted by on

As soon as I put the main character in my game The Cursed Iron Cavern, I knew I somehow had to display its health.

All in all I wanted the design to be really clear do that the focus is on the game itself and not so much on the UI parts like buttons and so on. Also I don't want big UI parts to cover some important areas of the levels while playing.

At first I checked some games with no or pretty less UI parts. I found some games where you can indicate the players health by its design. Like blood or injuries or so. But I found it difficult to add it in the game because I use sprite sheets for animation and I want to keep them small. So when I add more states of injuries I have to animate all the movements again and that is not what I wanted.

So I looked for small UI designs that look clear and clean. My idea was to create a healt bar on the left side of the display that matches the whole design and fits to the player. The first attempts were bubbles that are overlayed with a bar indicating the value by level. But bubbles were not quite fitting to the slime you are controling and the simple overlay looked not that nice. I felt that the goo should be inside a jar ore some thing. While browsing I thought of some jars from a lab and I looked for a test tube and a test tube is what the goo is kept in.

Next step was how the test tube held on the display. My first thoughts of tentacles were not that great because you can't find tentacles any elsewhere in the game and those don't belong to the main character. But because the slime consists of a green sticky mass I thought of glueing the test tube on the side of the display and that is my final concept.

Currently I'm drawing the test tube and making designs for the glue to stick the tube on the side. Pictures coming soon, so stay tuned.

Update 31 march 2016:

some footage

screenshot 2 screenshot 3

So what do you guys think of it?

Post comment Comments
kabeltelevizio
kabeltelevizio

Why is there no image of this UI bar then?

Reply Good karma Bad karma+1 vote
AlexPetrus Author
AlexPetrus

Because I am currently drawing it in pixel design, but as soon as I'm done with it you will get an update.

Reply Good karma+1 vote
kabeltelevizio
kabeltelevizio

Why not make the article after the bar is already finished?

Reply Good karma Bad karma+1 vote
Post a comment

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