Retype
Custom software for new ideas and broken processes.
Backs up to where the lines differ and types the rest, at an uneven pace and with one slip it catches.
Type, a ShirePath lab study
Lab study
Type in motion
Eight ways to move a line of text, each in plain TypeScript and CSS with no animation library, so any of them can be lifted into another site. Write your own line and every specimen picks it up.
Shuffle
Custom software for new ideas and broken processes.
Letters the two lines share slide to their new places on an arc. It measures both layouts and animates the difference.
Flap
Custom software for new ideas and broken processes.
A split-flap board. Each cell turns through its drum to the next letter, a beat behind its neighbor.
Weight
Custom software for new ideas and broken processes.
Letters thicken near the pointer on the font's weight axis. Left alone, a swell runs along the line.
Rise
Custom software for new ideas and broken processes.
Each wrapped line rises from behind its own edge. The split is re-measured at every width.
Read
Custom software for new ideas and broken processes. Each word comes up to full ink as it passes the middle of the box. The browser ties the color to the scroll position, so no script runs while you read.
Scroll the box. Words ink in as they cross its middle, on a CSS view timeline with no script.
Ring
The line set around the mark on an SVG text path, spaced to close the circle. Point at it to spin it up.
Revise
Custom software for new ideas and broken processes.
A proofreader's edit: strike the old words, caret in the new ones above, then set the line clean.
In place
Three made-up sites with the specimens where a real page would use them.