@rose and I just released a post-jam version of Interstellar Connection, our narrative puzzle game about helping a lonely spaceship pilot make a connection. We added a couple of enhancements, like endless puzzle mode, but the most interesting one was adapting the game for smaller screens so it can be played on mobile devices.

Interstellar Connection was built directly in HTML, so most changes were CSS. I redesigned the layout from two side-by-side panels into tabs, and added an automatic tab switch in the JS code to transition from puzzle to story and back.

The game is not strictly responsive - changing the browser width doesn't change the style. Instead, I do a one-time check of the window width when the game loads. If the width is below 960 px, I enable the stylesheet for the narrow view, and that width is also factored into game logic, like whether the relay network is generated as 6x4 or 4x6.

You can see it in action by adjusting your browser width, then refreshing. (Or by opening the game on your phone!)

I was really excited to tackle this. Since Interstellar Connection is a short, casual browser game, having it be accessible to people browsing on mobile seemed like a great way to expand our audience. And it was interesting to work on - @rose is normally the UI expert of the team, so for me to take this on was a great challenge!

I'd love any feedback on the mobile version as well as general feedback on the game! Please play and rate if you haven't!