The File menu is where a design leaves the app and where things come back in. It makes three kinds of file: pictures of the design for other programs, a cutting file for a machine, and the design itself, to open again later. This chapter is about what each file holds, and why.
What it does
The ‘File’ button in the title bar opens a menu in three groups. Each row notes what it will make, worked out from the design as the menu opens, and ends with a tag for the kind of file.
The exports.
- Artwork, SVG, saves notan-design.svg: the design as vector artwork on a canvas three sheets wide and four sheets tall, with the sheet in the middle. It holds the ground, the pieces lying on their backs, and the paper with its holes, each as an exact outline. For the default 4 × 5.5-inch sheet that canvas is 12 × 22 inches, and the file says so in inches, so other programs open it at that size.
- Artwork, PNG, saves notan-design-300dpi.png: the same picture, drawn at 300 pixels to the inch and marked inside the file as 300 dpi. A phone or tablet browser can only draw about 16.8 million pixels at once, so where the whole frame at 300 dpi would be more, the PNG is drawn as finely as fits, marked with that resolution, and named for it: for the default sheet, notan-design-252dpi.png, 3,024 × 5,544 pixels, still 12 × 22 inches when printed. The note beside it in the menu gives the resolution and size before you export.
- Cut lines, SVG, saves notan-cut-lines.svg, for a laser cutter or a cutting plotter: only the lines to cut, on a canvas exactly the size of the sheet, its size written in inches so the cutter lays it out at the sheet’s real size. Its note counts the lines.
The project. ‘Save project’ (⌘S) saves the design itself as a .notan file, every shape still editable. ‘Save project with photo’ appears only while you are tracing a photo, and keeps the photo with the design. ‘Open project…’ (⌘O) opens a .notan file and replaces the design on screen. The file is checked before anything changes, so a damaged or foreign file leaves your design as it was; but a successful open starts a new undo history and cannot itself be undone. On an iPad or iPhone, saving a project opens the share sheet, where Save to Files keeps it; the exports download.
Bringing things in. ‘Import SVG…’ places a shape from an SVG file on the sheet: it arrives fitted within the middle nine-tenths of the sheet, follows the pointer until you click to put it down, and then asks which edge to fold over, like any cut. ‘Trace a photo…’ lays a photo over the sheet to trace, by hand or automatically, and has chapters of its own. The photo never appears in any export.
Why it works this way
The two artwork files are one file. The PNG is made by drawing the SVG, not by capturing the screen, so the picture and the vector artwork cannot drift apart, and neither contains anything that belongs to editing: no selection handles, no guides, no photo.
300 dpi is a measurement, not a label. The app’s unit is one ninety-sixth of an inch, so the PNG is rendered at 300 ÷ 96 pixels for every unit, and the resolution is written into the file. A PNG made in a web page normally carries no resolution at all, and whatever opens it guesses 72 or 96 dpi and prints it the wrong size.
The SVG files carry their size the same way. Their drawing is measured in the app’s unit, a ninety-sixth of an inch, and their width and height are written in inches. A bare number would be read two ways: as a ninety-sixth of an inch by browsers and most cutting software, and as a point, a seventy-second, by Adobe Illustrator, which would open the default sheet a third too large. An inch is an inch to all of them.
The frame is three sheets by four because pieces fold out beyond the sheet, and the frame has to hold wherever they land. Because the frame depends only on the sheet, it does not move when the design changes, so exports of two versions of a design line up exactly.
The cut lines are the outline of the missing paper, not the outlines of your shapes. That removes every redundant line. Two overlapping cuts become one outline, instead of two sets of lines crossing through paper that should stay whole; a cut inside another cut adds nothing; and paper put back inside a hole comes out as an island with a line of its own. Stretches that lie along the sheet’s own edge are left out, because the edge of the stock is already a boundary, so a notch is cut as an open line that ends at the edge. The lines are thin black strokes, never filled, the form cutting software usually expects.
The project file is the design itself, in the same description undo and the autosave use, so an opened project is exactly the design you saved. An export is a picture for something else to use; the project is the only one of these files the app can open again.
The metaphor
The metaphor is the printer’s block and the prints pulled from it. The .notan project is the block you keep in the drawer. The SVG and PNG are impressions: fit to show, print or send, but not something you can carve again. The cut-lines file is the stencil, or the steel die a box factory presses through card.
It holds in one important way: a print cannot be turned back into a block. Importing your own artwork SVG brings it in as a shape to place, not as the design it came from. It breaks in others. A block wears as it prints, and every impression differs a little; here every export is perfect and identical. And a proof is traditionally a trial before the real edition, while these exports are the edition.
A history
In art
Henri Matisse’s late cut-outs, shapes cut with scissors from paper he had painted with gouache, raised the question this menu answers: how does a thing made of cut paper become a picture other people can own? For Jazz, published by Tériade in 1947, the answer was pochoir, stencil printing: twenty plates reproduced by laying color through hand-cut stencils, so that the prints were themselves made by cutting.
Japanese dyers had worked the same way for centuries with katagami, stencils cut by hand from sheets of washi toughened with persimmon tannin, through which a resist paste of rice was laid on cloth before dyeing. Where the paste lay, the dye could not reach. A katagami is a cut-lines file made of paper: everything the knife follows is a line, and everything it leaves has to hold together.
In printing
Printing has always had two kinds of original: the thing you print from and the thing you print. PostScript, the page-description language John Warnock and Charles Geschke brought to market from their new company, Adobe, in 1984, made that split digital. A PostScript file describes shapes and letters without reference to any printer’s resolution, and the printer turns the description into dots. In January 1985 Apple announced the LaserWriter, with PostScript inside and a 300 dpi Canon engine, and with Aldus PageMaker it started what came to be called desktop publishing. Three hundred dots per inch is still the figure print shops ask for.
In technology
The two kinds of file here are the two great traditions of computer graphics. Vector graphics describe lines and shapes; Ivan Sutherland’s Sketchpad drew them on a display with a light pen in 1963. Raster graphics describe a grid of pixels, and spread as memory became cheap enough to hold a whole picture. SVG, Scalable Vector Graphics, became a W3C Recommendation on 4 September 2001, after the consortium set aside six competing proposals, among them Adobe’s PGML and Microsoft’s VML, and wrote a new language informed by them. PNG was born of a patent dispute: in December 1994 Unisys announced that it would require royalties for the compression inside GIF, and a group that gathered on Usenet designed a free replacement, which became a W3C Recommendation on 1 October 1996. Its pHYs chunk, the part that carries the resolution, counts pixels per meter: 11,811 of them for 300 dpi.
Laser cutting followed the laser quickly. Theodore Maiman made the first working laser in 1960; the carbon-dioxide laser, still the usual tool for cutting paper and card, was invented at Bell Labs in 1964. The first production laser cutting machine, built by Western Electric in 1965, drilled holes in diamond dies, and in 1967 British engineers were cutting metal with an oxygen-assisted laser. A modern cutter reads each path in a file like this one as a line for the beam to follow, and burns away a kerf, a sliver that can be as narrow as a tenth of a millimeter, along it.
In professional software
Every professional program draws the line this menu draws, between the native file you go on editing and the exports you send out. Vector formats such as SVG, PDF and DXF describe outlines at any size; raster formats such as PNG and JPEG describe a grid of pixels at a stated resolution. Keep the native file, and export for each destination.
- Adobe Illustrator. The native file is .ai. ‘File › Export › Export As’ writes SVG, PNG at a resolution you choose, and DXF or DWG for CAD and laser work; ‘File › Save As’ writes PDF and SVG. Illustrator opens Studio Notan’s SVG files at their true size.
- Adobe Photoshop. The native .psd keeps layers editable; a PNG or JPEG is a flattened copy. Photoshop works mainly in pixels, so its exports are pictures whose printed size depends on their resolution.
- Autodesk AutoCAD. The native file is DWG, and DXF is the exchange format most laser and CNC software reads. A DXF often carries no dependable unit, so check the size of a cut file when it arrives.
- Autodesk Fusion (formerly Fusion 360). Designs are kept in the cloud rather than as files on your disk, and can be exported as .f3d. A Fusion sketch can insert an SVG or DXF, so the cut lines from here can become the outline of a part.
- Cricut Design Space. It uploads SVG and DXF as vector files, cut as drawn, and PNG, JPEG, GIF and BMP as images you clean up as they upload. Every path in an SVG arrives as a cut line, which is why the cut-lines file holds only the lines to cut.
- LightBurn. It imports SVG, DXF, AI and PDF as vectors and puts each color on its own layer, with its own speed and power. The cut lines here are all black, so they land on one layer, ready to be set to cut.
What carries over. Keep one master file you can edit, and treat every export as a copy made for one purpose. Send vectors to anything that cuts and rasters only where a picture is wanted, and check the size of every file in the program that receives it.
Try this
- Export the cut lines and open the file in a web browser. Where did overlapping cuts become one line?
- Open the File menu and read the pixel size in the PNG row; then halve the sheet and read it again.
- Save the project, make a change, save that too under another name, then open the first file to see the earlier version come back.
Going further
Read on with Inches and centimeters, Share and Keeping the photo with a project.
- Richard Benson, The Printed Picture
- William M. Ivins Jr., Prints and Visual Communication
- Alvy Ray Smith, A Biography of the Pixel