The layout
On a screen narrower than 700 pixels, or a phone turned on its side (a touch screen less than 500 pixels tall), the editor rearranges itself rather than shrinking.
- The header keeps the wordmark, Save with its menu, Run, a share button and your account. The share button opens a menu with Share, Export, Send to board, the project's title, the theme and the docs.
- The canvas takes the window. A floating palette at its foot holds Undo, Redo, Add (the filled one), Draw and More. Layers and everything else the canvas can do are under More.
- The bottom sheet holds the code, the Serial Monitor and the other panels, with Code and Serial segments and a More segment for Plot, Scope, Logic and the rest. Drag its bar to peek, half or full height, tap the handle to step through them, or use the chevron to open and shut it.
- The part panel comes up from the bottom of the screen instead of docking to the left.
Every target is at least 44 pixels, and no page on the site scrolls sideways.
Two fingers
Put two fingers on the canvas and it pinches. The point of the circuit under the midpoint between your fingers stays under it while you move: spreading zooms in, pinching zooms out, and moving both fingers pans.
Whatever the first finger had started is put back before the pinch begins. A half-dragged part goes home and a wire being drawn is dropped. That is deliberate: the second finger means you wanted to look at something, not that you wanted to finish the drag.
One exception while the circuit runs: with a finger holding a button, a second finger on another button presses that one too, so you can hold two buttons at once, as on a game controller.
Lifting one finger ends the gesture and leaves the view where it is. The finger still on the glass does nothing until it presses again.
One finger
One finger drags a part, draws a wire from a pin, or pans the empty canvas, exactly as a mouse does. Everything in the editor is built on pointer events, so there is nothing that needs hover to be discovered and nothing a finger cannot reach.
Hold a tile in the part panel for a moment and its description appears.
Typing
The code editor works with the on-screen keyboard. Each file opens at the size that fits its longest line across the screen, between 12 and 14 pixels; lines longer than that pan sideways rather than shrinking the code further. That size reads as 100%. Pinch with two fingers to zoom from there, or open the sheet's More segment and use Code size, with minus, the percentage and plus. Tap the percentage to go back to the fit. Tapping into the code does not enlarge or move the whole page.
Turned on its side
A phone held sideways gets the same phone editor, not a squeezed desktop. The sheet opens at its bar alone there, so the canvas has the whole short screen. Drag the bar up when you want the code.
The rest of the site
Every page works at phone width. On the home page, the editor window's Build and Code tabs show the editor's own phone layout, and Open in the editor sits at the window's foot.
Is a phone enough?
For reading a circuit, changing a value and pressing Run, yes. For laying out a board of forty parts, a larger screen is easier, and the same project opens on both: the account carries it between them. See saving and autosave.
On Android, Mokxi is also an app on Google Play. On any phone you can add Mokxi to the home screen so it opens like an app. Both are in install it as an app.