Development covered 29 Aug 2026 to 2 Sep 2026 (commit dates).
Myriad Immortal Sect runs in a browser, and browsers are not one shape. It runs full screen on a laptop, portrait on a phone, landscape on a tablet, and embedded in a small frame on portals that host browser games. That last one is where my layout rules turned out to be built on an assumption I had never said out loud.
The assumption
Every breakpoint I had written asked one question: how wide is this?
That works for the usual cases, because on real devices width and height travel together. A narrow viewport is a phone and a phone is also short. So width alone is a decent proxy for the whole shape, right up until it is not.
The frame on a game portal is around eight hundred pixels wide and not very tall. Width says desktop, comfortably. Height says something closer to a phone. My code believed the width, so the embedded build got the full desktop treatment: a minimap at its full size covering a sizeable share of the visible area, and, on the first screen, a start button that sat below the fold. The first thing a visitor saw was a game they could not begin.
Both directions, every time
The rule now is that layered elements are decided against both dimensions. Not a second set of breakpoints, just an honest question: is there room for this, given how much space there actually is, rather than how wide it is.
The practical version, if you want one line to take away: write down the real frames your thing runs in, including the embedded ones, and test the smallest total area rather than the smallest width. I had a phone in my test list and no small landscape frame, so a whole class of layout went unchecked in a place where real people arrive.
The other half of a viewport nobody reads
A related one on phones with a notch or a home indicator. The document declares that it wants to draw into the full screen, edge to edge, which is the modern default and looks better.
Declaring that is half the job. The other half is reading the safe area the device reports and keeping interactive controls out of it. I had done the first half only, so on those phones the bottom row of controls sat exactly in the strip the system reserves for its own gestures. Pressing them was a coin flip between the game and the operating system.
The lesson generalises past this specific property. Anything that opts you into more space is also opting you into responsibility for the parts of that space that are not yours. The places that fill that frame, from cities to sect grounds, are named in the glossary of world terms.
Small thing, disproportionate effect
The change I did not expect to matter: the minimap now folds itself away after ten seconds of no input, on a desktop or in landscape. A portrait phone keeps it, since the space it takes there is not contested.
It is a small animation on a timer. It made the map feel meaningfully less cluttered, because the clutter was mostly a thing you needed for four seconds and then stopped looking at. A surprising amount of interface design is working out which elements are answers to a question rather than permanent furniture, and letting the answers leave once they have been read.
Also this week
A pass over the English text as a native reader would meet it, which meant removing transliterations that had survived in dialogue, replacing Chinese units of distance and weight, and fixing one quest line where all four names were wrong at once. Item names went through the same pass, and the glossary of item terms collects their English forms. Our English text is authored rather than translated, so no reader should be able to tell which language a given sentence began life in.
Everything here ships in Xianxia idle incremental game, and you can check the layout on any screen you own.
Top comments (0)