The Art of the UI and Cursors

When designing the levels, we knew we didn’t want to have to write the player’s instructions on the screen. Players should be able to intuit what steps they need to do themselves with only very simple prompting, which is why we have the paper tag at the top right-hand corner of the screen. The note is similar to ones you could find in a real doll hospital, the real ones would display the doll’s name, owner’s name, or other identifying details, whilst our in-game tag tells the player the steps of the level.

I made a basic paper texture, that I reused for the level 1 and 2 hidden lore notes, in the shape of a tag. It has two versions, the one you see at most times in the top right-hand corner, and the zoomed-in version that fills up the screen once it’s been clicked on. Some people would go entire playthroughs, while we were playtesting, without ever having clicked on the tag. These people would sometimes get confused and have no idea what to do, and on rare occasions, someone would just breeze through everything without any problem without ever being given any instruction.

After seeing that, we knew what had to change the way that the tag worked. When initially drawing it, I tried to make the tag brighter than the other elements of the scene, so it would be UI but clearly that didn’t always work. We were going to animate the tag swinging at the start of the level to draw the player’s attention to it, but found a simpler way by just having the tag be the first thing you see when the level begins. This seemed to fix the problem.

When it came to the cursors, we knew we wanted it to be the Doctor’s hand from the very beginning. Each tool you click on is, in the game world, being picked up by the Doctor. The player controls the Doctor’s hands and sees everything from his point of view. The idea was that the player moving their mouse would emulate the doctor using a tool. It also goes back to our influence from early flash games and girls go games, which had custom cursors.

Multiple cursors appear that depend on what the player is trying to do. When they want to investigate something, a little magnifying glass appears. When the player tries to grab something to open it, a fist and an open hand appear to make a grabby motion and then the fist closes when the player is holding down on it. By default, the cursor is a pointer finger.

Throughout the levels, the hands of the doctor go through some things (infested with bugs, ripping out your own intestines, the usual stuff), so there are different versions of them in various states of bloodiness.

Sam Bedson

Leave a Comment

Your email address will not be published. Required fields are marked *