livediagram works on a phone right in your browser, with no app to install. The editor automatically switches to a touch-friendly layout on a phone-sized screen (narrower than 640 pixels, or a touch screen shorter than 500 pixels, so a phone held sideways counts too) so the canvas stays the star and everything is reachable with a thumb. It is great for viewing a diagram, making quick edits, and joining a live session on the go.
A layout built for touch
On a phone the editor keeps the same layout as on a computer, fitted to the width. Along the top, a small card holds the menu button (for the Explorer; a phone has no mode switch, see Editor Modes), and beside it the palette's strip: the selection mode, the categories as icons (swipe them sideways for the rest), and Search at the end. Tap a category to open its elements across the width of the screen. Layers (and Collaborate, once the tab has a comment or an action) open as pop-overs above their buttons in the bottom-right corner, and the tabs and quick controls run along the bottom.
A few panels are simplified to fit: they stay where they are rather than being dragged around (they start collapsed; tap a panel's header to expand or collapse it), the Map is hidden, and the zoom controls' − and + buttons give way to a single Fit button, since you pinch to zoom.
Held upright, an empty tab opens zoomed out a little (to 60%) and a tab with content opens fitted to it, so you land on a useful overview of the canvas, and when you add a new element it slides into view automatically.
Touch gestures
Your fingers do the work a mouse would on a computer:
- Pinch with two fingers to zoom in and out.
- Drag empty canvas to move around: a phone starts on the Hand tool.
- Tap to select, and drag an element to move it.
- Press and hold an element for half a second (a long press) to open its menu, the touch version of a right-click. On a phone menus open as a sheet from the bottom of the screen; drag it down to close it.
- Press and hold a button that shows only an icon to see its name. Letting go does not press it.
To select several elements, switch the selection mode to Select: then dragging across empty canvas draws a selection box.
Drag handles (an arrow's ends, for instance) have a little extra invisible padding on touch, so they are easier to hit accurately with a fingertip.
What works differently on a phone
A phone has a small screen, no mouse pointer and usually no keyboard, so a few things are not available or work differently:
- Spotlight and the Slide Deck (the presenting tools) are reserved for larger screens.
- The Map and UI Scale are desktop only.
- Quick Style (the small style panel beside a selection) does not show on a phone; every style is still in the element's menu.
- Keyboard shortcuts need a keyboard: with none, use the palette and the on-screen controls, which do everything the shortcuts do. Pair a keyboard and they work as on a computer, as do held-key moves like Shift to keep proportions.
- Hover previews (styles previewing as you rest on them) need a hovering pointer, so on touch a tap simply applies the change.
Was this article helpful?