DEV Community

Arthur031221
Arthur031221

Posted on

Building a local handwriting font workshop with editable glyphs

I built GlyphSprout for projects that need a small set of personal characters. It turns a handwritten page into a font subset that I can inspect and adjust one glyph at a time.

GlyphSprout workshop recording

The workflow begins with an A4 template. Each page has 35 cells, and a project can use up to 512 supported BMP characters across 15 pages. The input is a flat, evenly lit PNG or JPEG scan. I assign the page, confirm its visible ID, and place four registration corners by hand. GlyphSprout shows a rectified preview and asks me to confirm the page before worker processing starts.

The tracing step thresholds each cell and removes small connected specks. It follows the black ink as independent contours, so counters and detached dots remain part of the glyph. I keep the source cell visible beside the outline. That makes it possible to tune threshold, speck filtering, crop, scale, offsets, and spacing separately for each character. I can also draw and erase when a scan is not the right input.

The live specimen loads the generated font rather than a simulated rendering. Finished projects export as TTF or WOFF2. If some selected characters are incomplete, I must choose an explicitly labeled completed subset export.

Paper Bloom is the first visit example. It contains six real letter crops from public domain NIST SD19 form f1002_33. The TTF measures 3,284 bytes. I checked its family and character map with Fontconfig, used it in LibreOffice, and confirmed the PDF text and embedded font with Poppler. The size applies only to these six letters. The Han and kana sample is original synthetic geometry, not handwriting.

Project data stays in browser storage. IndexedDB keeps current and previous recovery snapshots and warns about a write from another tab. I still recommend downloading the project JSON because browser storage can be cleared. Offline use starts only after the complete application cache reports ready.

I would appreciate feedback on the scan confirmation and per glyph review steps. Try the workshop: https://Arthur031221.github.io/GlyphSprout/

Source and setup notes: https://github.com/Arthur031221/GlyphSprout/

Top comments (0)