Mobile UI improvements

Written by ♫Dex, published 2024-07-23

Note: This article was written on 2025-01-04, as a summary of the events happening on Discord back during this development log

I never really talked about it, but Project Mirabelle can be played directly on a smartphone (and is somewhat optimized for it)! This is a short summary of the mobile UI and the new tweaks.

On July 23rd, I reworked the mobile UI to allow "custom prompts" on the button when in a situation where the possible action changes.

(Please forgive the very poor gameplay showcase, I'm using a mouse to simulate touch on this video capture)

The mobile UI is implemented as a HTML div node that appears on top of all of the other nodes (including the canvas). The different buttons (directional cross, UI controls, pause buttons) actually set up the relevant action, just like a key mapping would. This allows for easy support of both keyboard-based controls and touch-based controls!

Down the line, I'd like to rework the directional keys to replace it with a "direction pad" like mobile games do. This isn't a topic for right now, however.