Thread letters - Lab

Every title here is set in a font whose letters are drawn as the braid's threads. A script reads each letter of a serif font, takes the spine of every stroke (traced by hand for some letters, found from the outline for the rest) and lays threads along it. The letters keep their widths and spacing; only their outlines are redrawn. Here are the parts, and what else the letters can do once they are threads.

Parts

spine A letter as the font script reads it: how wide each stroke is, the spine it runs along, and the threads it lays on the spine.

two threads A fine single thread runs every stroke. Where the letter is thick a second, double one joins it, and the two twist round the spine.

twist A turn of the threads takes a set length of stroke, rounded so each stroke turns a whole number of times. Move across it to change that length.

provi

the name Touched, its threads loosen apart, roll a whole turn and twist back, and the i's dot is tossed up, loosening into a loop.

SWAY

sway The titles' font has one axis, SWAY, that bends every stroke sideways; a pluck sets it swinging. Drag it, or press the letters.

Forms

Aa type

Your own words in the titles' font. Touched, they loosen exactly as the name does: the same code, given the titles' threads instead of the name's.

loose threads

Type, then touch the words.

Bb knobs

The font script's own settings, live, each starting as the font is built: how long a turn is, how far apart the two threads swing, how heavy they are, and which thread is the second.

turn spread weight

Cc stitch

A needle sews the word stroke by stroke, in the order the data lists them, and from one stroke to the next the thread is carried behind, shown faint. Sewn, the word holds a moment, and the needle picks it out again, backwards.

Dd unravel

Every thread is a chain of points the letters hold in place. A press lets them go from the end of each stroke back toward its start, where each stays tied: they come loose and dangle from the letters, swaying a little.

Press to unravel it; run the pointer through the loose threads; press again to knit it.

Ee hand

Pass over the word and its threads comb aside and spring back. Hold down, and every thread near the hand gathers into a knot that follows it; let go and they spring home.

Move over it; hold down and drag.

Ff wave

A paragraph in the titles' font, each letter able to be plucked on its own: a click sends a wave of plucks out from where it lands, weaker as it goes.

Every title on this site is set in a font whose strokes are threads, and a pluck bends every stroke of every letter at once.

Click anywhere in the paragraph.

What they showed

The drawings work from what the script keeps of each letter: each stroke's spine, how wide it is along the way, where the second thread joins it, and any dot. The outline is only what those draw at rest.

The font can bend its strokes only along its one axis, as the sway and the wave do. Anything else means drawing the letters from their data, as the name does while it moves.