Tracer: Pen-First Image Tracing

Study

Tracer came after Ductus.

Ductus was about handwriting movement: pen input, pressure, smoothing, and the odd gap between what the hand does and what software records. Tracer uses the same attention, but points it at images.

I had seen continuous one-line drawings based on real photos. Minimal lines. Still recognizable. Annoying in a good way.

I wanted to try that myself. I also already had a small pile of pen-enabled devices. They were not bought for Tracer or Ductus. They were just here, waiting to justify themselves. The apps I tried felt sluggish, wanted cloud accounts, or were paid tools with more machinery than I wanted.

So Tracer is a small local browser tool for the translation step. Load a reference image. Fade it back. Draw over it by hand. Keep the pressure and stroke data. Export SVG when a visual handoff is enough.

The goal is recognizability with as few lines as I can get away with. One continuous line is a nice constraint, but it is not the rule for this study. Sparse hand-led tracing matters more than purity.

What it is

Tracer is a browser-based tracing surface for stylus work. It has no backend, account, analytics, or build step. The app is one static page with PWA files around it.

The basic workflow is plain:

  1. load a reference image
  2. lower the image opacity
  3. trace on layers with a pen or mouse
  4. save the project as JSON
  5. export SVG when the drawing should move into another tool

JSON is the working format. It keeps the artboard, layers, raw points, pressure, timing, settings, and optional embedded reference image. SVG is the visual handoff format, the same kind of material that moves through From Pixel to Pen. It carries the visible drawing layers, not the source photo.

That distinction matters. SVG can show the traced result. The full capture data is more useful for future plotting work because it still knows how the line was made.

Pressure and plotting

Tracer already records pressure when the device and browser expose it. That part came from the same browser-input lessons as Ductus.

The plotter path is different from the SVG path. My plotter has a true Z axis and wants G-code. Gantry is the right place for that part. Pressure-aware plotting will need configuration: drawing size, paper size, origin, pen-up height, pen-down height, Z range, feed rate, and a pressure curve for the actual tool.

A fountain pen, a brush, and a technical pen will not want the same treatment. A brush especially sounds like trouble. Useful trouble, maybe.

So Tracer should probably stay the capture tool. It should save enough data: position, pressure, time, layers, and scale context. Gantry can then import that capture data, apply a plotter and tool profile, and decide how pressure becomes Z movement.

Most plots have very even lines. That is sometimes the point. It also misses the thing ink tools do when pressure changes. If the Z axis can carry some of the original hand pressure back onto paper, Tracer becomes more than a way to make SVGs.

It becomes a way to ask whether a traced line can survive as a physical mark.

Current state

The app can load reference images, capture strokes, handle layers, save JSON, and export SVG. It records pressure values when the hardware gives them. It can also run as an installable offline PWA, like Ductus.

The tablet workflow has the basics: pen draws, one finger pans, two fingers pinch-zoom, and the controls fit better on a small screen. The diagnostics panel reports pointer support, pressure samples, folder-save support, service-worker state, and SVG export mode.

Tracer on Android with a faded portrait reference and sparse black ink strokes

This screenshot is from an actual portrait tracing session on the mobile layout. The reference image is faded back, the ink is on a separate layer, and the drawing is still rough enough to show the working process. Good. It is not a finished drawing. It is proof that the small controls and the canvas can coexist on a phone while the hand is doing real lines.

The repo keeps the matching test note here: Android portrait tracing screenshot — 2026-08-05.

The repo has tests for the save format, sanitization, pointer handling, PWA files, documentation links, and SVG export modes. Good. Boring protection for a tool that should not eat drawings.

The next real test is physical. Exported SVGs need to be plotted, probably after a PPCT sanity check. After that, Tracer JSON needs to become input for Gantry, so pressure can be mapped to Z-axis movement and G-code.

That is where the study becomes less about tracing on screen and more about whether a plotter can draw with some of the hand still inside the line.

Launch: simiono.com/tracer · Mirror: utrost.github.io/Tracer · Source: github.com/utrost/Tracer · Roadmap: ROADMAP.md

See also: Ductus, VHS, Gantry, From Pixel to Pen, PPCT, Generative Art, CityPlot