The working drawings for version one: what it is, the ink it uses, the faces it is set in, and the tricks that make paper behave on a screen.
An advisory practice is a book of record, so the site is set as one — cream stock, hairline rules, tabular figures and one working red, composed with the pressure of print rather than the gloss of the web. The four products post as ledger entries whose balance column accumulates what a career gains, a conceit that forces every number on the page to be true.
Aa Rr Gg — 0123456789 & the italic hand.
The engraved letterhead. Display lines, folio headings, entry names, balances and pull quotes; the italic carries marginalia and the balance column. One weight only — a letterpress shop owns the sizes it owns, and the discipline shows.
S$39.90 3,684 №01–04 LIVE ✓
The typed matter. Descriptions, notes, labels, stamps,
buttons and every figure on the page. Money columns run
font-variant-numeric: tabular-nums lining-nums so numerals sit in
registers, as a ledger demands. The numerals are the protagonists here.
The centre of the site is the ledger itself: each product is a ruled entry with a debit (its published price), a credit (its published counts) and a running balance that accumulates what a career gains — a licence, then a filled calendar, then the work on record, then a team you can read. One entry, reproduced at reduced scale:
Stage one — get licensed
Mock exams and chapter practice for Singapore’s CMFAS and SCI papers.
S$39.90
one paper · one month
3,684 practice questions
9 papers · 104 chapters
A licence.
Why it works: a ledger is the one format where honesty is the aesthetic. Debits must be real prices, credits must be real counts, and the accumulating balance tells the company’s whole argument — get licensed, fill the calendar, do the work, read the room — without a single adjective. The double rule at the foot is the accountant’s full stop.
Every structural rule is an element, not a border, so GSAP
ScrollTrigger can draw it — scaleX 0→1 from the left as it enters,
like a pen pulled along a straightedge.
The posting line in Folio 02 is an SVG path with
stroke-dashoffset scrubbed to scroll position — the line literally
keeps pace with your reading.
Counts tick up on a stepped ease (steps(22)) in
tabular figures — mechanical increments, no easing glide, the way an
adding machine actually behaves.
The LIVE marks are type in a double border, rotated, eroded
by an feTurbulence mask and blended with
mix-blend-mode: multiply — then thunked in at 1.9× scale with a
power-in ease, which is the physics of a stamp.
A fixed full-page overlay of SVG feTurbulence
noise in a data URI — six percent warm speckle, zero image files. Shown
here at six times strength.
A radial-gradient dot screen, sized 7×7px and
faded with a mask — the print-photo texture that softens the closing folio.
The pull quote hangs its opening quote into the margin —
hanging-punctuation: first last where supported, a negative
text-indent everywhere else.
One…
The memo’s dog-ear is the border trick: a zero-size box whose borders paint page colour over the corner and fold colour under it, plus one soft shadow.
Proof-reader’s notes in Instrument italic, run vertically in
the gutters with writing-mode: vertical-rl — the human hand in an
otherwise ruled machine.
All motion is gated behind
prefers-reduced-motion and the presence of GSAP; with either
absent, the page renders complete and still — as a printed page should.
Entries to be posted by the examiner