ORIGINAL STUDY 03 / INTERACTIVE TYPOGRAPHY
Refraction: typography held inside a moving field of light.
Refraction begins with stable ivory typography. As attention moves across it, a local lens bends the letterforms while a wider orange field arrives with its own delay. The two systems stay related without collapsing into one effect, allowing the type to remain readable while light appears to pass through it.
- SUBJECT
- Short phrases rendered as accessible DOM typography
- INPUT
- Pointer position, direction, speed, and keyboard movement
- RESPONSE
- Local lensing, dispersion, caustic detail, and delayed light
01
Three optical layers, one restrained response
The base type remains clear. A masked lens and text layer performs the local deformation. Outside it, an independent warm-orange field expands and lags behind the point of contact, joined by restrained dispersion edges and curved wavefront details.
Separating these layers avoids the familiar look of an RGB glitch. Refraction is concentrated around attention, while the wider field gives the surrounding negative space enough energy to feel connected.
02
Direction and speed shape the return
Slow movement keeps the lens visible and reveals the relationship between type and light. Faster movement stretches the response. When input stops or leaves the field, the optical layers settle at different rates instead of snapping back together.
03
Typography remains content
The phrases are real DOM text rather than pixels trapped in a canvas. They retain a localized accessible name, keyboard input, and a reduced-motion path. The experiment can therefore behave like an optical surface without giving up the responsibilities of a public web page.