top of page
  • Writer's pictureCharlotte Wilkinson

UI & UX Design for #LDJam 55

For this 72 hour jam, I worked with a lovely team from all over and it was an excellent time! Our producer Clover set up a wee intro call prior to the jam starting, to let us all meet and get introductions out of the way before the jam.


For me, the jam theme was announced at 02:00am on Saturday 13th. I chose to stay up, allowing me to sync with the team and contribute to the brainstorming and early design stages.



a rough user flow map, leading from the main menu and specifying the contents of all possible paths, from Start game, settings, credits and quit.
Early User Flow based on orignal game concept, the core game loop was later adjusted to avoid having any reaction pop-up's between rounds. Instead the screen was split with 1/3 showng the characters reactions!


Once we settled on a game concept, I created a quick user flow and shared it with the team, to see what would be needed from the UI side for the different scenes/screens we'd like to include in the project, to avoid working on anything we didn't need.



Above are the final UI scenes, I created a small and cohesive suite of assets including in-game HUD elements, a title-logo, a custom cursor, settings slider bar & handle, button with three states and three easily re-scaleable containers for pop-ups and menus. While on call with the team once we settled on a game concept, I created some super sketchy wireframes, to explore different approaches to user interaction and layout of elements.


The next day was focused on syncing up with the team and with the character artist Micro, before developing a UI fitting the fantasy feel of their character work. I also created a background for the in-game scene, exported Micro's character expressions in-scale for the game, and used the character they created for the itch game page assets and in-game menu splash page. Later also moving on to create a chibi of the main characters' familiar to follow the players cursor, an illustrated hand asset (based on the character design) and five colour coded spell orbs each with a unique symbol to make the game more accessible for colour-blind individuals.


Through the jam, I utilised the web colour contrast checker on the UI colour pallet I developed, ensuring that it met Level AAA for our container and text elements to ensure better accessibility.

WCAG Compliance Test Result is shown, direct snippet from the web colour contrast checker.
WCAG Compliance Test Result
Level AAA - Text. This image shows is a brief overview of criterion to meet this standard.
Our in-game text would be classed as Large sample text as the smallest text is larger than 24px.

I also created the cover, banner and page background assets used for the itch and Ludum Dare game pages, ensuring they showcased the character work from Micro well, and incorporating the spell orbs and some sketched scroll outlines, alongside the smoky effect from in-game onto the itch page background to tie it all together.



In the end, we created a simple arcade style game, where you control Myoji's summoned goblin familiar inside their demi-plane. Rushing around to move spell orbs into and out of Myoji's path to help her pass her exam! We had a lot of fun working together on call via discord, so this was a really fun jam experience, and I'm excited to work on more jams with the team in the future! You can play Eyes on Myoji here or over on the Ludum Dare game page.

bottom of page