So the first step to mobile support is making the all of the quarks in all of the chambers actually fit on a phone screen. Right now they just overlap a bunch and you can’t tell which quarks belong to who. I have some ideas for an algorithm that can automatically adjust layout variables until everything fits, but first I need to give the algorithm things that it can adjust.

The crux of the problem is that there’s simply no way to fit 6 chambers in a circular ring around the center of the screen on mobile. There’s just not enough screen space. So I made a new layout that places chambers in a grid instead of a ring. It works on desktop in addition to mobile. I don’t think it looks quite as nice, but it’s much more space efficient.

I attached some side-by-side comparison screenshots. As you can see, the quarks still don’t quite fit on mobile even with the grid layout, but it’s much closer.

Next step is either writing the automatic layout algorithm, or making input work on mobile.