draw-your-font

1---2name: draw-your-font3description: "Turn a handwriting photo into an installable TTF font."4version: 0.1.05author: Danilo Znamerovszkij (https://github.com/danilo-znamerovszkij/draw-your-font), ported by Hermes Agent6license: MIT7platforms: [linux, macos, windows]8required_commands: [node, npx]9metadata:10  hermes:11    tags: [font, handwriting, typography, ttf, woff, vision, creative]12    category: creative13    homepage: https://github.com/danilo-znamerovszkij/draw-your-font14    related_skills: [pixel-art]15---16 17# draw-your-font18 19Photo of handwritten letters in → installable font out. You do the seeing20(find and label letters, judge quality); the CLI does all geometry (trace,21metrics, font assembly). Never edit SVG paths or coordinates yourself.22 23## Setup in Hermes (once per session)24 25The CLI is the pinned npm package `draw-your-font@0.1.0` — run it via npx (Node ≥ 18 required, no global install needed):26 27```bash28npx -y draw-your-font@0.1.0 --help29```30 31Wherever the examples below show `$DYF`, use `npx -y draw-your-font@0.1.0`. Shell variables do not persist between tool calls, so paste the full command each time. Everything runs locally; the user's handwriting never leaves the machine.32 33Photos arrive in Hermes either as a file path in the message or via the gateway image cache — use the actual file path with the CLI. When a photo lands in the conversation with no path, ask the user for the file (the CLI needs a real file, not your memory of the image).34 35Do the visual steps (contact sheets, previews, glyph sheets) by loading the PNGs with `vision_analyze`.36 37## Decide the flow38 39- **User has no photo yet** → offer the template: print, write, photograph.40- **User shares photo(s) of handwriting** → main flow below.41- **User pasted an image but there is no file path** → you can see it, but the42  CLI needs a file. Ask them to drag the image file into the terminal (that43  inserts its path) or give the path directly. Do not proceed from memory.44- **User wants changes to a font built this session** → Refine section.45 46## Template flow (best quality)47 48```bash49$DYF template -o template.pdf --charset minimal   # or: spanish50```51 52Tell the user: print it, write one character per box with a dark pen53(0.5 mm+), keep the letter sitting on the solid line, then photograph each54page from above in good light and share the file paths. The grid prints in55light grey and vanishes during processing - only their ink survives.56 57## Main flow: photo(s) → font58 59**1. Segment.** Works for template pages and freeform photos alike:60 61```bash62$DYF segment photo1.jpg photo2.jpg -d work63```64 65**2. Look, then label.** Load `work/contact-1.png` with `vision_analyze` (one per photo): every66detected blob is numbered. This is the step where your eyes matter - check:67 68- Did every written character get exactly one box? A letter drawn with69  separate strokes may appear as two boxes (relabel handles it: give the main70  box the character and mark the fragment `""`), and two touching letters may71  share one box (ask the user to re-shoot just those, or accept the gap).72- Junk boxes (shadows, ruled lines, smudges, page edges) → label them `""`.73 74Then write `work/labels.json` mapping blob id → character, e.g.75`{"0": "A", "1": "B", "7": "", "8": "a"}`:76 77- Template page: order is the charset order printed on the template - verify78  against the sheet instead of trusting it blindly. minimal order: A–Z, a–z,79  0–9, then `.,;:!?'"-()@#&+/$`; spanish appends `ÑñÁÉÍÓÚáéíóúü¿¡`.80- Freeform: identify each letter from the contact sheet. Uppercase vs81  lowercase for shape-twins (S/s, O/o, C/c, X/x…) is decided by relative size82  and position - compare against neighbors you're sure of.83- The user told you what they wrote (e.g. "ABC then abc")? Trust it, map in84  reading order (top row first, left to right), and verify visually.85- Same letter appears twice → label the better-drawn one, `""` the other.86 87**3. Build.**88 89```bash90$DYF build -d work --labels work/labels.json --name "Dan's Hand"91```92 93Name the font after the user (ask if unclear - one short question max).94 95**4. Judge before delivering.** Load `work/preview.png` and `work/glyphs.png` with `vision_analyze`96and critique like an art director:97 98- Broken or blotchy letters (bad trace) → often a faint pen stroke; try99  `--weight 1`, or ask for a re-shoot of just that letter.100- Everything too thin/thick → rebuild with `--weight 1` / `--weight -1`.101- Jagged edges → rebuild with `--smooth 1.5` (up to 2).102- A letter placed wrong (e.g. a `g` not descending) → usually a mislabel;103  fix labels.json and rebuild.104- Filled-in bowls (b, o, g look solid): should never happen - if it does,105  the crop is smudged; ask for a re-shoot.106 107Rebuilds are cheap and safe to iterate. Fix what you can yourself first;108only bother the user for re-shoots when the source ink is the problem.109 110**5. Deliver.** The font lands at `<workdir>/<NameWithoutSpaces>.ttf` (the111build output prints the exact path). Give that path and how to install:112macOS - double-click → "Install Font"; Windows - right-click → "Install".113Mention what's missing (the build prints uncovered letters) and offer,114without pushing:115 116- Web formats + CSS: rebuild with `--formats ttf,woff,woff2,css`.117- A legibility read (below).118- Their next photo to fill missing characters: re-run segment with ALL119  photos (old and new) into a fresh workdir - `$DYF segment p1.jpg p2.jpg -d120  work2` - then relabel from the new contact sheets (blob ids renumber; the121  old labels.json does not carry over) and build from the new workdir.122 123## Refine (conversational iteration)124 125| User says | Do |126|---|---|127| "smoother / rounder" | `build … --smooth 1.5` (max 2) |128| "thicker / bolder" | `build … --weight 1` (max 2) |129| "thinner / lighter" | `build … --weight=-1` (negative needs the `=` form) |130| "the g looks bad" | show them `work/crops/<id>.png` for that letter; offer re-shoot or smooth |131| "wrong letter" / swap | edit labels.json, rebuild |132| "give me woff2 / web" | `build … --formats ttf,woff,woff2,css` |133| custom preview text | `$DYF preview -d work --text "…"` (after a build) |134 135All refine commands rebuild from the stored crops - no re-photographing136needed unless the ink itself is the problem.137 138## Legibility report (offer after delivering)139 140```bash141$DYF preview -d work --text "minimum mill rn m cl d I l 1 O 0 quick brown fox" -o work/legibility.png142```143 144Read it and give an honest, kind read: a score out of 10 for body-text use,145the 2–3 letter pairs most likely to confuse (rn→m, cl→d, I/l/1, O/0), and one146or two concrete fixes (rewrite those letters larger, more spacing). Note that147display use (headings, notes) is more forgiving than paragraphs. Never gate148delivery on this - it's advice, not a blocker.149 150## Troubleshooting151 152Segmentation found far too many / too few blobs, grey guide lines surviving,153shadow blobs, faint ballpoint strokes → see154`references/troubleshooting.md`.155