Step Guides

Turn any picture into an instruction. Every mark is pinned to a place in the image, so arrows still point at the right thing after the callout has been dragged somewhere else.
Extension

Mark up a picture, and every mark stays editable.

Screenshots and photos become instructions the moment somebody adds an arrow to them. The trouble starts on the second pass: the arrow was drawn at a position, not at a thing, so the moment anything moves it points at nothing, and a flattened export means starting over.

Step Guides pins every mark to a place in the picture. Drag a callout across the frame and its leader still finds its target. Push a step into the middle of a sequence and the numbers renumber themselves. Move a station on a route and the path still runs through it. The marks know what they are attached to, which is the difference between annotating once and annotating every time the image changes.

There is a mark for each job. Numbered pins, arrows that curve or turn at right angles, labelled callouts, sticky notes, frames and highlighter strokes. A spotlight that darkens everything but one shape. Blur, pixelate and a solid redaction bar for what should not be readable. A magnifier that lifts a detail out, enlarges it beside the picture and draws the lines back to where it came from. Measurements with end ticks and a label that turns with the line. Icon stamps from the editor’s Tabler set. And routes, which turn the same tool into a directions sketch over a map or a walkthrough of a floor plan.

Everything lands as real shape and text layers, grouped and reopenable, so you can restyle any of it with the rest of the editor afterwards. One switch adds a numbered step list beside the picture that stays in step with the marks. Nothing is uploaded anywhere; it is all computed in your browser.

Features

Marks that stay pointed

Every annotation is anchored to a place in the picture, so leaders and routes survive being moved.

Features

Thirteen kinds of mark

Pins, arrows, callouts, notes, frames, highlighter, spotlight, blur, pixelate, redaction, magnifier, measurements, icons and routes.

Features

Numbering that keeps up

Insert a step in the middle and everything after it renumbers itself, step list included.

Features

Real layers, not a flat export

The result is shape and text layers you can restyle, grouped and reopenable via Edit Step Guides.

What is included

  • Thirteen mark types, all anchored
  • Routes with station dots and finish arrow
  • Spotlight, blur, pixelate and redaction
  • Magnifier with callout lines
  • Optional numbered step list beside the picture
  • Ten paired color presets or your own accent
  • Background from the document, one layer, the media library or an upload

Requirements

Works on top of the free WunderPaint.
Play Video

Frequently asked questions

They keep pointing at the right thing. Every mark is pinned to a place in the picture, so a leader still finds its target after the callout has been dragged across the frame, and a route still runs through its stations after one has been moved.
No, it lands as real shape and text layers, grouped and reopenable with Edit Step Guides, so you can restyle any of it with the rest of the editor afterwards.
Yes. Blur and pixelate make a region unreadable, and a solid redaction bar covers what should not be there at all. It is all computed in your browser.

Add Step Guides to your editor.

It comes with the Pro plan, updates included, and supports the continued development of the free open-source editor.

Free

Chaos Art

Autonomous painters make one-of-a-kind abstract art in 3D space - gestures, art movements, painterly media, and embeds that paint a new original for every visitor.

Pro

Particle Strokes

Paint with swarms of light: twenty-two movements, a stamp you draw yourself, and curves that give a stroke a shape - the swarm keeps painting for a few seconds after you let go.

Pro

City Diorama

Any place on earth as a miniature you could hold: real streets, water and building footprints raised into a 3D diorama - or wrapped around a sphere as your own tiny planet.

Free

Papercut Art

Layered paper pictures with real depth - a photo sliced along its actual depth into up to twenty layers, parametric landscapes, animals and clouds you can shape, letters with real counters, and a look that runs on three dials.

Pro

3D Earth Studio

A hyperrealistic globe - day and night with city lights, live clouds, atmosphere halo, country borders and highlights, click-to-place markers with flight-route arcs, satellite orbits, seamless rotation video and a live website embed.

Free

Mystic Studio

Turn a birth date into wall art - a real natal chart with houses and aspects, the moon of that night, zodiac and Chinese zodiac posters, numerology cards and a synastry wheel for two, in eight artful themes.

Free

Marble Bath

Marble paper on a virtual water bath - drop, rake and comb real Ebru patterns with gestures, flowers and classic recipes, razor-sharp at any size and re-editable as a layer.

Free

Day Ring

Turn a day into a beautiful circular schedule - colour-coded time blocks as arcs around a 24-hour clock, with concentric rings for overlaps, emoji, templates and a legend.

Free

Code Shot

Turn code into a gorgeous, share-ready image - syntax highlighting, editor themes, window frames and diff highlighting - then drop it into your design as a re-editable layer.

Pro

3D Solar System Studio

Build a date-accurate 3D solar system - real planet positions for any date, photoreal textures and one slider from artistic to true scale - then drop it into your design as an editable layer.

Pro

3D Molecule Studio

Build a real 3D molecule - from a curated library, the periodic table or a SMILES string - then style it, measure it and drop it into your design as an editable layer.

Pro

3D Textile Studio

Drop your design onto cloth that behaves like the material you pick: silk falls soft, felt holds its shape, flag fabric snaps in the wind. Hang it, blow it and drape it, then lay the finished drape back into your document as a picture.

Pro

3D Particle Studio

Point the engine at any layer and it becomes a cloud of particles that keeps its colours, flowing through a sphere, a galaxy or your own outline. Keep the frame you like as a still, or embed the running engine so it keeps moving on your page.

Free

Origami

Put your own picture on the paper and watch that very sheet fold itself into a crane or a box. Every step is a station you can stop at and turn around in 3D, which is exactly where printed diagrams leave you alone.

Pro

3D Flip Studio

A hardcover you can leaf through, a limp magazine, a strewn pile of sheets, a sticker peeling off its backing. The curl is real geometry, so the print never slides across the paper.

Free

Handwriting Fonts

Draw the alphabet here or fill in a printed sheet and photograph it. What comes out is a genuine font family, installed into your site and available in every picker.

Pro

Step Guides

Turn any picture into an instruction. Every mark is pinned to a place in the image, so arrows still point at the right thing after the callout has been dragged somewhere else.

Free

Text Art

One studio, sixteen art types: ASCII and emoji art, brick, dice, cube, sticky-note, LED, ceramic and keycap mosaics, word portraits, text flows, silhouettes, element tiles and more.

Free

Photo Mosaic

The classic photomosaic, computed in your browser: your main image emerges from many media-library photos via true structure matching - never a cheap overlay.

Free

Puzzle Sheets

Generate printable puzzle sheets: word search, mazes in eight shapes, sudoku with unique solutions, criss-cross, cryptograms and number pyramids.