|
Rulerv1.0OCR & QA Platform

Detect errors in artwork before production

  • Machine Learning
  • OCR
  • Web app
  • Product design

About the project

A packaging team signing off artwork revisions by eye — every new proof read line by line against the approved file, under a print deadline.

Role
Product/UX
Industry
Packaging & print
Platform
Web app
Languages
Thai & English

The brief and the build

What was needed

Every revision had to be checked against the approved file, and by hand that is slow. What slips through is rarely the obvious thing — it is the small change that carries the most risk once the job is printed.

Work I did

I shaped the product and built it: framing the problem, setting what the system has to catch, and designing how a reviewer works through what it finds. I then built it as a web app — a FastAPI service with PaddleOCR for the words and OpenCV for the rules, and an Alpine.js workspace that shows the artwork at true size beside everything found on it, in Thai and English.

Ruler's start screen: a millimetre workspace with rulers, a grid and Card-to-A0 page outlines, and a card to drop an artwork (JPG, PNG or PDF up to 50 MB) with an optional physical width.

Highlights

A summary list instead of a visual inspection

Every finding points to its place on the artwork

Changes recorded with the file

The workspace

The artwork on the left, everything found on it on the right. Pick a row and the viewer flies to that spot; pick a box and the list follows.

ruler · results
The Ruler workspace on the Lines tab: a coconut-drink label with its nutrition table, one rule selected, and the list of every rule with its thickness in millimetres.

Font size, measured

A PDF's own text layer is read first, for exact characters and sizes; OCR fills in outlined text. Everything else is sized from its glyphs — Thai by body height, Latin by cap height — in millimetres and points.

Line weights, measured

Every horizontal rule is found and its thickness measured below the pixel, so a 0.18 mm hairline and a 0.35 mm rule are told apart.

A record that ships

The list, the overlay and every export come from one set of findings — JSON, CSV, or a PDF report with the marked-up artwork.

A workspace in millimetres

Rulers, a grid and Card-to-A0 outlines frame the artwork at its true size, so a label can be judged against the page it will print on.

Read twice, kept only when sure

Large OCR lines are read again at several sizes, and a new reading replaces the first only when the rereads agree — so one shaky reading never reaches the list.

Close-up of the label's nutrition table, with each text run and each rule boxed and numbered, and the energy line selected.
Down to the nutrition table. Each line of text and each rule gets its own box and number, so a finding can be checked on the artwork itself.
The Lines tab of the results list: each horizontal rule with its position and thickness in millimetres.
Lines, on their own. Filter to the rules and read each weight and position in millimetres.

Measured, not eyeballed

Known weights in, measured weights out

The test label is drawn in code, so the true weight of every rule is known. By eye they are all “a thin line”; Ruler reads each one to within 0.002 mm.

  • 0.175mmdrawn 0.176
  • 0.353mmdrawn 0.353
  • 0.793mmdrawn 0.794
  • 1.058mmdrawn 1.058

Ruler’s readings, drawn at 8× actual thickness.

What changed
The reviewer will use a summary list instead of a visual inspection, and each finding will point to a specific point on the artwork, with changes recorded in the file.