Studio Notan LEARNING HUB
Launch Studio
Trace a photo

Adjusting the photo on the canvas

The pill at the top of the canvas while you move, crop, skew or pick.

Move photo, Crop, Skew and the color pipette each borrow the canvas for one job. While one is in hand, a pill at the top of the canvas says what to do and how to finish. When the job is done, the canvas goes back to the tool you had before.

What it does

  • Move: “Drag to move · corners resize”. The pill shows Done only. Done, Enter or Escape finish, and the move stays: it happened as you dragged.
  • Crop: “Drag the handles to crop”. The pill shows Whole photo, Cancel and Done. Done or Enter applies the crop; Cancel or Escape discards it; Whole photo removes any crop entirely.
  • Skew: “Drag the corners into place”. The pill shows Cancel and Done, and Unskew once the photo is skewed. Done or Enter keeps the skew; Cancel or Escape puts the photo back as it lay before you started; Unskew makes it rectangular again and finishes.
  • Pick: “Tap the photo to pick a color”. The pill shows Cancel only, because the tap itself finishes. A tap off the photo ends it without a color.

On a phone the hints are shorter (“Drag to move”, “Drag the handles”, “Drag the corners”, “Tap the photo”).

Starting any of them closes the phone's settings sheet, and for Move, Crop and Skew the view zooms out, if it must, so the whole photo shows clear of the pill. Pressing the same tile in the panel again is the same as Done. Choosing another tool ends the job; a crop in progress is then canceled, not applied. Starting another photo job in the middle of one also ends the first without applying it.

None of these changes are in Undo, because the photo never is. Cancel and Escape are the undo, which is why they are always there for the jobs that can be taken back.

Why it works this way

These are modes, not tools on the rail, so that they cannot be left on by accident. A tool stays in your hand until you put it down; a mode ends by itself when its job is done, or with Escape, Enter or any other tool. You never find, twenty minutes later, that dragging on the canvas moves the photo instead of drawing.

The pill lives on the canvas, where the work is, because on a phone the panel is a sheet that has to close for the canvas to be seen. Before the pill, pressing Crop there left nothing on screen to say what came next or how to finish.

The four jobs finish differently because they are different kinds of change. A move is continuous and instant; moving back is just another drag, so there is nothing to cancel. A crop or a skew is a set of choices made together, eight handles or four corners, and is kept or thrown away as a whole. A pick is a single act.

Enter and Escape follow long habit: Enter says yes, Escape says take me out. Escape on a move stays because there is nothing pending to throw away.

The metaphor

The printer's proof. A proof is a question put to you: is this right? You either approve it or mark it back. In printmaking, the proof an artist signs off is the bon à tirer, “good to print”; Done is that signature. Cancel is the proofreader's stet, Latin for “let it stand”, written beside a correction to say: ignore that change, keep what was there.

The metaphor holds for the moment of decision: a change held open, then committed or dropped. It breaks on scope. A proofreader's stet undoes one mark; Cancel here drops the whole pending job at once. And the move has no proof at all, because what you see as you drag is already the result.

A history

In art

Some art forms have no Cancel. In true fresco, the painter plastered only as much wall as could be painted before it dried, a giornata, a day's work; the joins between days can still be traced on old walls. Once the plaster set, the color was locked in, and a mistake had to be chipped out and replastered. Oil painting, by contrast, is full of second thoughts: an artist's changes, painted over but sometimes showing through with age, are called pentimenti, from the Italian for repentance. A mode with Cancel is the oil painter's freedom, with the fresco painter's discipline of finishing one thing before starting the next.

In printing

Proofing is printing's way of holding a change open. Galley proofs, page proofs and color proofs each paused the work for a decision before it became expensive to undo, and the marks used to decide, stet among them, are still taught. The pill is a small proof stage for each photo job: nothing is committed until you say so.

In technology

Modes were once everywhere in computing. Many early text editors had one mode for typing and another for commands, and pressing a key did different things depending on a state you could not see. At Xerox PARC in 1975, Larry Tesler and Tim Mott built Gypsy, an editor designed to do away with such modes, and Tesler campaigned against them for the rest of his career; his car's license plate read NO MODES. Jef Raskin, in The Humane Interface (2000), argued for “quasimodes”, modes that last only while you hold a key, so they cannot be forgotten.

The app's photo modes take the middle road: a mode, but short, labeled on screen, and ended by finishing the one thing it is for. The Escape key that ends them goes back to Bob Bemer, who around 1960 proposed an escape character for the code that became ASCII, a way to switch out of one set of meanings into another. On keyboards it became the universal way out.

In professional software

A tool that holds a change open until you accept or reject it is called modal, and the two ways out are commit and cancel. In most professional programs, as here, Enter commits and Escape cancels.

  • Adobe Photoshop. Free Transform, ⌘T (Ctrl+T), and the Crop tool (C) hold their changes pending, with a tick to commit and a cancel button at the right of the Options bar. Enter or Return commits and Escape cancels; until you do, many menu commands are grayed out.
  • Adobe Illustrator. Most actions apply at once, and ⌘Z (Ctrl+Z) takes them back. ‘Crop Image’ is one of the exceptions: it shows ‘Apply’ and ‘Cancel’, and Enter or Escape does the same.
  • Autodesk AutoCAD. Every command is a mode that prompts you at the command line. Enter, or the Space bar, ends it, and Escape cancels it; press Enter at an empty prompt and the last command starts again.
  • Autodesk Fusion (formerly Fusion 360). Commands open a dialog that waits for ‘OK’ or ‘Cancel’, and Escape leaves the command. A sketch is a longer mode: Escape does not end it, and you leave with ‘Finish Sketch’.
  • Blender. Press G to move, R to rotate or S to scale, and the change follows the pointer until you click or press Enter to keep it, or right-click or press Escape to put it back.

What carries over. When a program seems to ignore you, look for a mode still open: a commit bar, a prompt, a pending box. Then press Enter or Escape, whichever you mean. One difference: in Photoshop and Blender, Escape throws the pending change away, while Studio Notan’s Move photo keeps a move on Escape, because it was never pending.

Try this

  • Start Crop, drag a handle, then press Escape: the photo is whole again. Start Crop again, drag, and press Enter.
  • Start Move photo, drag the photo off to one side, then press Escape. The move stays.
  • Press a pipette, then tap the empty canvas beside the photo: the pick ends, and the color is unchanged.

Going further

See Placement, Skew and Unskew and Front and back colors. Jef Raskin, The Humane Interface. Donald A. Norman, The Design of Everyday Things.

Every chapter is about something you can do in the studio, free, in the browser.

Try it in the studio