Docs menu

Working on a Laptop and a Phone

The workspace is the same on every screen: the same panels, the same nodes, the same proposals. A phone arranges them differently, because a phone has no room for panels side by side. This guide shows what changes on a phone, a tablet and a laptop.

What a phone is for

A phone is for keeping an eye on a workspace and making small changes: look at the flow, read a node's settings and change a field, accept or reject a proposal, move a node, and wire two nodes together. Building a large flow is easier on a computer, and everything you do on the phone is the same workspace you open there.

Which screens get the phone layout

A phone is a touch screen with a shorter side up to 500 px. Turning the phone on its side keeps the phone layout, because the shorter side is what counts. Anything you use with a mouse is a desktop at any size, so a small laptop window keeps the desktop layout. The kind of screen is read when the workspace opens.

The canvas, the bottom bar and sheets

On a phone the canvas (Workflow) fills the screen. Along the bottom is a bar with one button for each of the other panels: Thinky, Inspector, Proposals and Live Stream. The bar only switches between panels; Deploy, Save and the other actions stay where they are on a computer. Proposals shows how many proposals are waiting. The bar holds up to five buttons; when more panels are open (a node's editor, for example), the first four stay and the rest sit behind More, with their counts added on it.

  1. Tap a button. Its panel slides up as a sheet that takes half the screen. The canvas above it keeps working: you can still pan, zoom and tap nodes.
  2. Tap another button. The first sheet closes and the new one opens: one sheet at a time.
  3. To make the sheet taller, tap the short bar at its top (Full height). Tap it again to go back to half (Half height).
  4. To close the sheet, tap the close button on its title bar, or use the phone's Back.

Closing a sheet keeps the panel's work: a draft you were typing is still there when you open it again. Tapping a node opens the Inspector as a small sheet that shows the node's name and health, so the canvas stays in view; tap the short bar at its top to see more.

After a reload the panels you opened are still open behind the canvas: tap a button and its panel shows at once, with what it held.

Pressing Manage Surface in a surface's Inspector shows the surface's canvas in place of the workspace's, with the surface's name and a Back to the workspace button on the canvas bar. Tap it, or use the phone's Back once, to return to the workspace's canvas. The Inspector sheet you pressed it from closes, so one Back is all it takes.

The Menu button

On a phone the menus along the top (Workspace, Environment, fAI, APIs, View and the rest) fold into one button labelled Menu. Tap it to see every menu. Tap a menu's name to open it, then tap the item you want. Every item a computer shows is there.

If a menu carries a count (waiting proposals, for example), the count shows on the Menu button itself, so it is never hidden. Tap outside the menu to close it.

Wire two nodes by tapping

You can connect two nodes without dragging, on a phone and on a computer:

  1. Tap the first node's connection dot. The dot keeps its small look, but the place you can tap is 24 px across, so it is easy to hit.
  2. The nodes it can connect to light up, and the rest dim.
  3. Tap the second node, anywhere on it. The line is drawn.

To give up, tap the first node again. While you are wiring, tapping a node finishes the wire; it does not open the Inspector. On a computer the same thing works with two clicks.

On a phone you can also wire from a list. Select a node: the Inspector's Connect to section lists the nodes it can connect to, each by the same name the canvas shows. Tap one to draw the line; the row then reads Connected. A node that is already connected reads Connected and can't be tapped, so a tap never takes a line away. The list only adds lines: a node whose line would replace one it already has (a surface that already has a parent, a connection that already has a simulator) isn't listed, so draw those by tapping the two nodes. If no node can be connected, it says "No other node can be connected to this one." On a computer the Inspector has no Connect to: drag a line, or click the two nodes.

Windows open full screen

On a phone every window, from a node's editor to Warm Query and the set-up windows, opens over the whole screen. When the on-screen keyboard opens, the window ends above it, so its buttons stay in reach; scroll inside the window to see the rest.

Page zoom is never blocked: pinch the page to make text larger. On the canvas, a pinch zooms the flow and pulling down does not reload the page.

Tablets and laptops

A tablet (a touch-first screen larger than a phone) uses the desktop layout, with larger dividers and resize handles so a finger can hit them. A tablet and a phone follow your desktop layout until you change them; see Layouts.

On a laptop at 1280 by 720 px nothing slips under the taskbar and every control stays in reach. A collapsed panel is never narrower than its own expand button.

If something does not work

  • A tap on a node does nothing while wiring. The node is dimmed: it cannot take a line from the first node. Pick a lit node, or on a phone select the first node and use Connect to, which lists the nodes it can connect to.
  • A lit node isn't in Connect to. Its line would replace a line it already has, and the list only adds lines. Tap the two nodes to draw it.
  • The phone shows the desktop layout. A mouse or trackpad makes the screen a desktop. If one is attached to the phone, disconnect it and open the workspace again.
  • A sheet covers what you need. Tap the short bar at its top to go back to half, or close the sheet; the canvas is underneath.
  • The page scrolls sideways. It never should, at any width. Tell us which window or panel was open.
On this page