16 — Glyph Field
The entire canvas is packed with letterforms — Latin and Arabic — all shifting and swelling as your cursor moves through the field.
fills the frame · cursor → warp + glow
Experiments
Mouse-driven sketches that fill the frame — dense type fields, flowing lines, and full-bleed surfaces. Move through each canvas to warp the whole space.
The entire canvas is packed with letterforms — Latin and Arabic — all shifting and swelling as your cursor moves through the field.
fills the frame · cursor → warp + glow
Thousands of red strokes stream across every inch of the canvas, following a noise field bent toward your mouse.
fills the frame · mouseY → stroke length
Horizontal lines stack from edge to edge, compressing and bending into volumetric waves — the whole surface breathes.
fills the frame · mouseX → bend · mouseY → density
Portfolio words tile wall-to-wall at different depths. Move to parallax the entire typographic surface.
fills the frame · mouse → parallax drift
Designer one-liners tile every scanline — hire mohsen, kerning matters, final_final_v9.pdf. The whole field ripples in waves under your cursor.
fills the frame · cursor → ripple wave · lines scroll slowly
Thousands of red ticks orient toward your cursor like iron filings. Move up and down to change field strength and scatter.
mouseY → field strength · mouseX → jitter
A headline stretches and swells as you move through it — letters near the cursor grow and drift, like live typesetting.
mouseX → scale · mouseY → tracking spread
Two line grids slide past each other to build interference patterns. Classic optical print energy, driven by position.
mouseX → phase shift · mouseY → line spacing
Weighted glyphs hang from the top edge and swing on strings. Push them around with your cursor like a soft physics toy.
mouseY → push force · proximity → repulsion
Move to leave a fading ribbon of rotating letterforms — Latin and Arabic glyphs cycle as you draw paths through the canvas.
speed → spawn rate · mouseY → glyph size
A typeset line rides a ruled baseline grid. Skew and size respond to cursor position — editorial rhythm made interactive.
mouseX → italic skew · mouseY → leading
Hollow letter specimens with editable counters. Move closer to collapse or expand the inner shape. Click to cycle glyphs.
proximity → counter scale · click → next glyph
Letter pairs drift apart until your cursor pulls them into a ligature — Latin fi/fl and Arabic pairs included. Click to switch.
cursor → snap distance · mouseY → snap threshold
A single word stretches and compresses like a live tracking control in InDesign. Pure letter-spacing play.
mouseX → tracking · mouseY → point size
A vertical stack of Aa specimens at increasing optical sizes. Hover a row to highlight weight and slide the glyph.
mouseY → select row · mouseX → slide
Classic pong — your paddle is I, the CPU is O, and the ball is a bullet. Move vertically to defend. First to score wins bragging rights.
mouseY → paddle · click → serve · double-click → reset
Spin the role generator — random designer titles from the portfolio shuffle like a casino. Click to spin your next identity.
click → spin the reels
Smash through the bricks to spell HIRE ME. Move your paddle with the mouse, click to launch. Clear the wall to win.
mouseX → paddle · click → launch
Design skills float up as bubbles — Type, Brand, Figma, Arabic, Code. Hover or click to pop them before they escape.
hover / click → pop bubbles
Letters rain down — catch M-O-H-S-E-N in order with your basket. Build combos, complete the name, feel like a portfolio arcade.
mouseX → basket · catch letters in sequence