plotterLens

Point your phone camera at something and turn it into pen-plotter line art in real time, then save an SVG ready for the terraPen (or any plotter).

Live page: https://warderoid-ctrl.github.io/terrapen-camera-plot/

Use it

1. Open the live page on your phone and tap the shutter button to start the camera. Allow camera access when asked.
2. Swipe the style carousel above the shutter. Each thumbnail previews that style on your picture, and the one in the centre is active (or just tap one). The plot updates as you move the phone.
3. Tap the shutter to freeze the frame, and again to resume.
4. Tap the save button to keep the plot in the gallery. Open the gallery with the thumbnail beside it, then download the SVG from there. It's sized in millimetres for the paper you chose.

Gallery

Saved plots stay on your device, in the app's own storage, so nothing is downloaded until you ask. Each one keeps its SVG, the photo it came from and all its settings.

• Tap a plot to view it full size. Swipe sideways for the next one, and double-tap to zoom in.
• Download, Send (share sheet) or Copy the SVG. Save each pen as its own file applies here too.
• Edit reopens the photo with the same settings, so you can change the style or the sliders. Saving again adds a new plot and leaves the original as it was.
• Long-press (or tap Select) to pick several plots, then download, send or delete them together.

The gallery lives on this one device and browser. Clearing site data removes it. On iPhone, Safari may clear it if the site isn't opened for a while, unless terraLens is added to the Home Screen. Download anything you want to keep.

No camera permission? The camera button beside the shutter opens your camera app instead, and the picture button loads an image from your gallery.

Install as an app

It's a Progressive Web App, so it installs from the browser with no app store:

• Android (Chrome): open the page, then tap Install when prompted, or open the settings sheet and tap Install terraLens.
• iPhone / iPad (Safari): tap Share, then Add to Home Screen.
• Desktop (Chrome / Edge): click the install icon in the address bar.

Once installed it opens full screen, has its own icon, works offline and keeps your settings. Updates arrive automatically the next time it opens with a connection.

Gestures

On the picture	Does
Drag right / left	More / fewer lines (spacing; levels for Contour)
Drag up / down	Contrast
Pinch	Zoom in to check the lines
Double-tap	Zoom in 3×, or back out
Tap	Hide or show all controls
Long-press	Place a focal point; keep holding and drag to move it

Show the camera under the lines (Settings) fades the camera picture in behind the plot so you can line up the shot, with a Camera opacity slider (20% to start). It only shows on screen and is never saved in the SVG.

On a phone, the first tap takes the app full screen (turn off Go full screen on first tap in Settings to stop this). The installed Android app opens full screen straight away. iPhone Safari doesn't allow web pages to go full screen, but adding terraLens to the Home Screen gives a similar edge-to-edge view.

Swipe up on the bottom bar, tap its handle, or tap the style that's already picked in the carousel for every setting. When the controls are hidden, the handle stays above the carousel; tap it to bring them back. On a phone the open menu takes the lower part of the screen and the paper sits above it, so you can see every change as you make it. While you drag a slider, the rest of the menu fades away, the slider drops to the bottom and the paper grows to fill the screen above it.

Colours

The Colours section chooses how the four pens are used:

Choice	Does
None	Everything is drawn and saved in black (the style's layers stay separate in the SVG). Duotone always keeps its two inks
Layers	Each of the style's own layers in its pen's ink (Hatch directions, Blobs outline/fill, Technical lineweights)
Linear	Bands of a straight gradient across the sheet, one pen per band
Radial	Rings around the centre or focal point, one pen per ring
Multi	The picture is split into areas of similar tone (subject, shadow, background …) and each area gets a pen, with touching areas always different. Shapes inside one area keep one colour; lines that cross areas change pen at the edge. Detail sets how many areas; Shuffle swaps which pen goes where

The four swatches below set the inks for pens 1–4. Each pen is its own layer in the SVG, with a matching stroke colour, so plotter software can pause for a pen change between layers. Styles with a single layer (Waves, Spiral, Contour …) use pen 1 under Layers; Multi colours them too.

Focal point

Long-press the picture to drop a point that the current style reacts to. A target marker shows while you place or drag it, then fades; turn on Show target to keep it visible (it is never in the SVG). The settings sheet has Attract / Repel, a Pull strength slider and Remove point. With no point placed, every style behaves as normal.

Style	Attract	Repel
Waves	Lines pinch in towards the point	Lines bulge away (lens)
Spiral	Spiral starts at the point	same
Contour	A hill rises at the point	A pit sinks
Flow	Whirlpool draining into the point	Whirl spiralling outward
Blobs	Hatch radiates, cross adds rings, spiral fill centres on the point	same
Hatch	Lines converge on the point (vanishing point); extra layers add rings	same
Engrave	Hatch converges on the point	Hatch rings round the point
Etch	Strokes converge, vignette centres on the point	Strokes ring round the point
Loop	The line packs tighter round the point	The line opens out round the point
Snowflake	The flake grows from the point
Dots	Dots sit on rings around the point	same
Hairs	Combed towards the point, like iron filings	Combed into circles around it
Arrows	Aim at the point	Aim away
Suns	Rays stretch towards the point	Rays stretch away
Swirls	Orbit the point, tighter close to it	Orbit the other way
ASCII	Characters sit on rings around the point	same
Growth	Grows only around the point; Pull sets how far	same
Voronoi	Cells shrink towards the point (attract) or grow (repel)	same
Subdiv	Mesh is pulled towards the point	same
Truchet	Tiles get smaller around the point	Tiles get bigger around the point
Ridges	Raises (attract) or sinks (repel) a bump at the point	same

Top bar

• Readout: paper, total line length, number of lines
• Flip camera: front or back (shown while the camera is on)
• Paper shape: cycles portrait → landscape → square
• Source preview: small thumbnail of what the camera sees, for aiming
• Full screen: on browsers that support it

Styles

Style	What it draws
Waves	Horizontal lines whose wave height and frequency follow darkness
Spiral	One continuous spiral from the centre, wobbling with darkness
Contour	Lines of equal tone, like a map's height lines
Flow	Streamlines that follow the edges in the picture
Blobs	Smooth shapes from the dark areas, filled with hatch, cross-hatch, contours or a spiral
Hatch	1–4 layers of cross-hatching; darker areas get more layers
Technical	Technical drawing: heavy outlines (pen 1), tone lines (pen 2) and section hatching in tonal bands (pen 3), with an optional border frame
Duotone	Two-ink print: angled line screens, dark ink (pen 1) for shadows and light ink (pen 2) for highlights and midtones
Engrave	Etching hybrid: blob outlines (or form contours), evenly spaced hatch lines that end and split as the tone lightens, cross-hatch building up in the shadows, dots in the light tones. Hatch: Flow (wraps round forms), Rigid (straight diagonal) or Facets (shards). Pen 1 outlines, pen 2 hatch and dots, pen 3 cross-hatch
Etch	Loose needle etching (after Rembrandt): tone from small groups of parallel strokes at shifting angles round the form, stacking in the shadows; broken, restated outlines; curls where the picture is busy; fades to the edges. Pen 1 outlines, pen 2 light hatching, pen 3 shadows
Loop	One continuous closed line grown by differential growth: it packs into a tight maze where the picture is dark and opens into wide meanders where it is light. Keeps growing across frames, so it settles on a still and morphs with the live camera. Tone range sets the contrast between the two
Snowflake	A six-armed crystal grown from rules; nothing is traced. The picture tunes the rules: overall tone (plates vs feathery dendrites), contrast (how many branches), edge detail (sub-branches), centre vs surround (ferns vs fans), top vs bottom (gaps along the arms) and the main direction (rotation). Eased over time so the live camera morphs it. Flurry drops up to Most flakes crystals on the picture's strongest edges (strongest first, never overlapping), sized by edge strength and darkness, each grown from its own patch, so together they trace the subject's outline. Profile (default) merges every arm, branch and plate into one clean outline, like a boolean union, with rounded tips; Lines draws the crystal as single strokes, made plotter-friendly: no doubled spines, pieces joined into long tip-to-tip strokes, ordered nearest-first (about half the pen lifts). Branching scales everything; pen 1 the ice, pen 2 the growth rings in the core

Contour, Flow, Hairs, Arrows, Suns, Swirls, ASCII and Growth are ported from hauntedPoints, where they were driven by point-cloud displacement. Here darkness takes the place of the data value and the image's gradient takes the place of the displacement direction.

Blobs puts the outlines on pen 1 and the fill on pen 2, so they can be plotted in two colours.

Controls

• Reset sliders (top of the settings) puts every slider back to its default. Double-tap a slider's name to reset just that one

• The settings are grouped into folding sections (Background, Colours, Focal point, Paper, Export). With the menu open the style carousel steps aside and a Style bar shows the current style. Tap the picture to hide the menu and keep just the carousel, so you can swipe through styles while pointing at a subject

• Paper colour (in Paper): putty (the default), white, cream, kraft, grey, shell green, black or any colour, as a preview of the sheet you plot on. Strokes that would vanish on dark paper are drawn light. Optionally adds a hidden-able Paper layer to the SVG

• Cell fill also offers Zigzag, one continuous back-and-forth line; Blobs has a Zigzag fill too

• Line wobble and Hatch wobble: hand-drawn wobble, set separately for the main lines and for hatching or fills (Hatch wobble shows for Hatch, Blobs, Technical and filled Voronoi or Subdiv cells). Each stroke wobbles differently and the wobble is saved in the SVG

• The menu is an accordion: Settings, Background, Colours, Focal point, Paper and Export. Opening one folds the others

• Thin zone and Lines reaching point (Focal point): stops lines piling up and saturating the paper where they converge. Each stroke stops at its own random distance from the point, so only the chosen share (10% by default) run right in and the line density stays level. Set Thin zone to 0 to turn it off

• Colours: None, Layers, Linear or Radial (see Colours), and an ink for each pen. Picking an ink while on None switches to Layers. Reset colours returns the pens and paper to the defaults and colours to None

• Spacing: distance between lines, rings, dots or grid cells (mm); the label changes with the style

• Second slider (wave height, dot size, line length, blob amount…): how strongly darkness drives the style

• Hatch layers (Hatch) and Contour levels (Contour, 2–200; drag sideways on the picture to double or halve)

• Spacing goes down to 0.5 mm for very dense plots; the live preview slows down to keep up

SVG output

• Units are millimetres (width="210mm" etc.), so it imports at true size.
• Every stroke is a plain path with no fill, ordered back-and-forth to cut pen-up travel.
• Each pen is its own Inkscape layer with its colour as the stroke, labelled with a leading number, a plain colour name and the exact hex (1 pen 1 dark green (#17321b), 2 pen 2 pink (#e83b68) …) so AxiDraw-style software can plot one layer at a time and you can tell which pen to load.
• Save each pen as its own file (Export section) makes downloads one SVG per colour instead (named like …-pen1-dark-green.svg), for software that ignores layers. Send shares them all together.

Run locally

It's plain HTML, CSS and JavaScript with no build step or dependencies: index.html, plus manifest.webmanifest, sw.js (offline support) and icons/. Browsers only allow camera access over HTTPS or localhost, so serve it rather than double-clicking:

python -m http.server 8000
# then open http://localhost:8000

Publish with GitHub Pages

Settings → Pages → Source: Deploy from a branch → Branch: main, folder / (root).

Credits

Inspired by mitxela/plotterfun. Built for terraPen.

License

MIT. See LICENSE.

Video clips as the live source

Tap the gallery button and pick a short video instead of a picture: it loops as the "live" feed, so every filter, gesture and slider works on it. Handy for demos and for working without a camera.

Demo mode

Open index.html?demo to get a scripted tour of every feature with on-screen captions and a simulated finger. Options: &speed=2 (faster), &notitle (skip the title card). Pick one or two clips in the panel, then press Play tour. record.js (Playwright) records it headlessly to video.

Hidden styles

Ridges, Subdiv, Technical, Arrows, Suns, Swirls and Growth are still in the code but left out of the carousel. Remove a name from HIDDEN_MODES in index.html to bring it back.