Studio Notan LEARNING HUB
Launch Studio
Paper and file

Zoom

Look closer, or step back to see the whole sheet.

Zoom lets you look closer, to place a point exactly, or step back to see the whole composition at once. It changes how you see the design and nothing about the design itself. Until you touch it, the view frames the design for you.

What it does

The zoom control floats on the canvas: ‘Zoom out’, the zoom level as a percentage, and ‘Zoom in’. Each press zooms by a factor of 1.25, about the middle of the view. A phone has no room for it and does without: pinch instead. There are other ways to zoom and to move:

  • Scroll with a mouse wheel or trackpad to zoom about the pointer, so that whatever is under it stays under it.
  • On a touch screen, pinch to zoom and drag with two fingers to move.
  • Hold Z: click to zoom in on a point, Alt-click to zoom out, or drag sideways to zoom smoothly about where you started.
  • Hold the space bar and drag to move the view, like sliding a sheet across a table.

The level runs from 25% to 4000%. At 100%, one unit of the design, a ninety-sixth of an inch, takes one CSS pixel on the screen, so the default sheet is 384 pixels wide. How many real inches those cover depends on your screen; on most modern displays 100% is not actual size.

Until you zoom or pan, the view frames the design by itself. When the app opens, the sheet and everything folded out from it fill the canvas inside a margin. When a cut sends a piece beyond the view, the view first glides out until the piece’s landing place is in frame, and only then does the paper turn over. When an undo makes the design smaller, the view glides back in once the paper has landed. The moment you zoom or pan, all this stops: the view is yours, and stays where you put it. It starts framing again when you reset the design, open a shared design, or reload the page.

Zoom changes nothing but the view. It is not an undo step, is not saved with the design, and has no effect on any export. Handles and outlines stay the same thickness on screen at every zoom. Beside the control is the ▶ button, Replay, another way of looking.

Why it works this way

The view frames the design by itself because a notan grows outwards. Every cut sends a piece beyond the edge of the sheet, and a fixed view would soon be cropping the most interesting part of the design. It makes room before the fold plays so that you see the design whole and still, and then watch the paper go over.

It stops the moment you take over because a view that moves under your hand is worse than one that does not move at all. For the same reason it does not re-fit when the window changes size: that would yank the design out from under you mid-drawing whenever a panel opened or a tablet turned.

Zooming in makes your work more precise, not just bigger. The smoothing of a hand-drawn line and the distance at which the pen snaps to an edge or a point are both measured in pixels on the screen, not on the paper. The closer you zoom, the more detail a drawn line keeps, and the closer you have to be before the pen snaps. Zooming in is how you tell the app that a detail matters.

The wheel, the pinch and held Z zoom about the pointer or the fingers, keeping what you are looking at where it is; the buttons zoom about the middle, because they have no pointer to follow.

The metaphor

The metaphor is the magnifying glass and the loupe, and, in the other direction, the painter stepping back from the easel. Ivan Sutherland, describing the zoom of his Sketchpad program in 1963, compared it to looking at the drawing through a magnifying glass.

Where it holds: a lens changes nothing about what it looks at. Where it breaks: a lens magnifies the grain of the paper and the spread of the ink, and here there is no grain. Curves stay exact at 4000%, and the lines of the interface stay hair-thin. A glass has one power; this one has every power between a quarter and forty. And stepping back has no everyday equivalent except walking backwards, or a reducing glass.

A history

In art

Painters have always needed to see the whole as well as the detail. They step back from the easel, look at the work in a mirror, or half-close their eyes to see only masses of light and dark, which is to say, to see its notan. In the eighteenth century, artists and tourists carried the Claude glass, a small, slightly convex mirror with a darkened surface. Turning their backs on a view, they looked at it reduced in the mirror, its color and tonal range simplified. The poet Thomas Gray’s journal of the Lake District helped make it fashionable, and it is named after the painter Claude Lorrain, though there is no evidence he used one. A Claude glass is a zoom out and a notan machine at once.

Scaling a drawing up or down has its own instrument. Christoph Scheiner used a pantograph, a linked parallelogram of rods with a pointer on one arm and a pen on another, to copy and scale drawings in 1603, and published a book on it in 1631.

In printing

The printer’s zoom is the loupe. A small folding magnifier, the linen tester, first made for counting the threads in cloth, became the tool for checking the dots of a halftone and the register of colors on a proof. At the other end of the scale, a process camera enlarged or reduced artwork to the size it would be printed, and engravers and letter cutters used pantographs to reproduce a design at another size.

In technology

Lenses are old. Ibn al-Haytham’s Book of Optics, from the early eleventh century, shaped European thinking about light and lenses once it was translated; Roger Bacon wrote about magnifying lenses in the thirteenth century; and spectacles appeared in Italy around 1286. The computer’s zoom arrived with its first drawing program. Sketchpad kept its drawing in page coordinates of its own, separate from the display, and showed any part of the page at any magnification in a range of 2000 to one; Sutherland reckoned that let one work on a 7-inch square of a drawing about a quarter of a mile on a side. Studio Notan works the same way: the design has its own units, and the screen is a window onto it.

MacPaint, in 1984, had FatBits, a zoom that showed every pixel as a square you could click. In 1977 Charles and Ray Eames made Powers of Ten, a film that travels from a picnic in Chicago out to the edge of the known universe and back into an atom by factors of ten, after Kees Boeke’s 1957 book Cosmic View. And the pinch came out of multi-touch research that ran through the 1980s and 1990s, from work at the University of Toronto in 1982 to Wayne Westerman’s FingerWorks, before the iPhone made it an everyday gesture in 2007.

In professional software

Zoom and pan work much the same in every drawing program, and many of the keys are shared. Three moves do most of the work: fit everything in the window, show 100%, and zoom about a point. Holding Z and Space-dragging work here as they do in Adobe’s programs.

  • Adobe Illustrator. The Zoom tool is Z: click to zoom in, Option-click (Alt-click) to zoom out. ⌘+ and ⌘− (Ctrl+plus and Ctrl+minus) step the zoom, ⌘0 fits the artboard in the window and ⌘1 shows 100%. Hold Space for the Hand tool (H) and drag to pan.
  • Adobe Photoshop. The same keys work, with ⌘0 fitting the image to the screen. With Scrubby Zoom ticked in the options bar, dragging sideways with the Zoom tool zooms smoothly, as holding Z does here. At 100% one pixel of the image fills one pixel of the screen, which is not the printed size; ‘View › Print Size’ comes closer.
  • Autodesk AutoCAD. Roll the mouse wheel to zoom about the cursor, drag with the wheel held down to pan, and double-click the wheel to zoom to the extents of the drawing. The ZOOM command adds options such as Extents and Window, which fills the screen with a rectangle you pick.
  • Autodesk Fusion (formerly Fusion 360). The wheel zooms and a wheel-drag pans, as in AutoCAD, and ‘Fit’ on the navigation bar at the bottom of the window frames the whole model. Fusion adds a third move, orbit, because its view looks at a solid from any side.
  • Figma. Shift-1 zooms to fit everything, Shift-2 zooms to the selection and Shift-0 returns to 100%. Space-drag pans, as it does almost everywhere.

What carries over. In each new program, learn fit, 100% and zoom about a point before anything else, and keep a thumb near the space bar. Zoom in to place points precisely, as here, and remember that no program’s 100% is a ruler: measure the print, not the screen.

Try this

  • Zoom to 4000% on a curve, then drag one of its points: see how finely it moves.
  • Hold Z and drag sideways over the sheet to scrub the zoom in and out.
  • Zoom in, then make a cut near an edge: the view stays put. Reload the page and it frames the design again (the design comes back from the autosave; the undo history does not).

Going further

Read on with Replay, Inches and centimeters and Points.

  • Ivan Sutherland, Sketchpad: A Man-Machine Graphical Communication System
  • Kees Boeke, Cosmic View
  • Philip and Phylis Morrison, Powers of Ten

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

Try it in the studio