|
Since i’ve been incredibly bussy with BGP, GGC (Gotland Game Conference) and moving i haven’t been able to upload my posts on schedule. I’ve been living without internet lately but finally made it to the mainland/Stockholm back to my home town Norrtälje where i have internet.
This post will mainly be about the UI(User interface), the decisions i had to make and why.
The Project A Rat Betwixt is a game that takes place on a main screen, a tv for example where everything plays out, and a secondary screen on a tablet and or phone which you use as a input device, instead of a controller or keyboard and mouse etc.
The UI should always be simple, straight forward and user friendly, however this is not always the case. In our case the game itself is a turnbased game with alot of different elements, making it hard to create a userfriendly UI.
The first mockup wasn’t great. I created something inspired by old military equipment, ammo boxes, containers and so on. This was not great, it did not fit the style at all, and the quality wasn’t good enough. It was a bit surprising that it clashed with the style concidering the fact that the game is set in bunkers. In the end I scrapped everything and started over.
Since the game was heavily inspired by boardgames i decided to focus more on that, i focused on a weathered paper look instead with hard cole and ink drawings.
The game also featured a initiative system where each player gets a hand of initiative cards, once more i was inspired by the boardgames and decided that making them look like playing cards would be great. Each character has their own symbol, and the playing cards have a corresponding symbol on them. All cards are blank except for the symbol so we can randomly generate any number on the actual cards in their corners, just like playing cards. A fellow student on the team created the small initiative box that you can click to see your entire hand.
Klicka här för bildspel
As for the general layout i have two early screen shots that should give a basic understanding of how it works.
 
(Note that there are still some placeholders in these pictures)
About Sebastian Engstrand
2015 Graphics
|
