UI Lab
An exhibition of 50 interactive and 75 cinematic particle text effects — each rendered in real-time with GLSL shaders. Hover to interact. Click to enter.
Title
The Birth of Venus
Artist
SANDRO BOTTICELLI
Edition
c. 1485 · ORIGINAL
Exhibition Status
Medium
GPU Particles · GLSL
Interactive Effects
Move your cursor over each painting to reveal the particle effect. Each piece responds to your touch like a living canvas.
Scatter
Dissolve
Text breaking apart into dust
Angular scatter + noise jitter
Explode
Explosion, detonation, shrapnel
Strong radial push + glow spike
Shatter
Glass shatter, breaking, fragmentation
Hash-based random direction per particle
Glitch
VHS tracking, datamosh, corrupted data
Quantized time steps + teleport offsets
Confetti
Confetti, celebration, party popper
Hash scatter + gravity + random brightness
Spiral Out
Expansion, flower bloom, outward spiral
Spiral with growing radius
Wind
Wind, gust, blowing, drift
Slowly rotating wind dir + turbulence
Attract
Magnet + Burst
Magnetic attraction that periodically detonates
sin phase pull/burst cycle
Vortex
Whirlpool, tornado, centrifugal spin
Orbit at current distance
Black Hole
Black hole, gravity well, singularity
Pull inward + shrink point size
Spiral
Galaxy, nebula, fibonacci spiral
Two-arm spiral with distance wrap
Drain
Drain, whirlpool, toilet flush
Fast rotation + shrinking radius + sink z
Assemble
Assembling, gathering, magnetic convergence
Mix to cursor + orbital offset
Magnetize
Magnetic alignment, crystallization, lattice snap
Snap to grid lattice + intersection glow
Wave
Transform
Shake
Earthquake, vibration, trembling
High-freq sin with per-particle phase
Inflate
Balloon inflating, expansion, swelling
Uniform outward expansion + z-push
Gravity
Gravity, falling, dropping
Fall down + horizontal sway
Liquid
Water parting, laminar flow, viscous fluid
Tangent flow with side sign
Bokeh
Camera focus pull, depth of field, dreamy blur
Z-depth push + alpha fade
Stretch
Taffy pull, elastic stretch, rubber band
Pull along home-to-cursor direction
Breathing
Breathing, meditation, organic pulse
Slow 0..1 cycle + outward expansion
Parallax
Depth of field, 3D parallax, z-space push
Z-depth push + xy shift + fade
Morph
Shape morphing, text-to-circle, transformation
Mix to circle positions around cursor
Slice
Slicing, cutting, text cleaving in two
Top/bottom split + opposite slides + gap glow
Pinch
Pinch, squeeze, accordion compression
Pull to horizontal line + expand outward
Twist
Wringing, twisting, torsion
Rotation by height around vertical axis
Flatten
Flattening, squishing, pancake
Compress vertically + expand horizontally + z-push
Ambient / Scene
Tornado
Tornado, dust devil, vertical vortex
Twist angle by height + shrinking radius
Ember
Campfire, sparks, hot ash rising
Rise + flicker drift + intense glow
Matrix
Matrix digital rain, cascading code
Quantized columns + cyclic fall + leading edge
Constellation
Starry night, twinkling stars, celestial map
Twinkle sines + glow pulse, no displacement
Lens
Magnifying glass, lens distortion, refraction
Magnify inside ring + edge glow
Quantum
Quantum superposition, teleportation, uncertainty
Discrete time steps + random teleport + mask
Orbit
Planetary orbit, satellite, stable rotation
Stable circular orbit at current distance
Static
TV static, white noise, signal lost
Hash-based random on all 3 axes
Sand
Hourglass, sand timer, granular flow
Accelerated fall + horizontal pile spread
Bubbles
Bubbles, effervescence, carbonation
Rise + wobble + soft pulse glow
Comet
Comet tail, motion trail, streak
Trail behind cursor velocity + head glow
Ink
Ink in water, diffusion, bleeding
Slow turbulent flow + dark intense glow
Visual
Cinematic Animations
Watch particles assemble into text through carefully choreographed entrance animations. Each transition tells a story.
Direction
Rise up
Particles rise from below into position
origin.y = target.y - offset, mix with ease
Fall down
Particles fall from above into position
origin.y = target.y + offset, gravity-like ease
Slide left
Particles slide in from the right edge
origin.x = target.x + canvasW, linear ease
Slide right
Particles slide in from the left edge
origin.x = target.x - canvasW
Slide up
Particles slide in from the bottom
origin.y = target.y - canvasH
Slide down
Particles slide in from the top
origin.y = target.y + canvasH
Diagonal TL
Particles slide in from top-left corner
origin.x -= W, origin.y += H
Diagonal TR
Particles slide in from top-right corner
origin.x += W, origin.y += H
Diagonal BL
Particles slide in from bottom-left
origin.x -= W, origin.y -= H
Diagonal BR
Particles slide in from bottom-right
origin.x += W, origin.y -= H
Converge
Particles converge from all screen edges
origin = edge nearest to target
Diverge
Particles start at center, diverge outward to targets
origin = center, mix to target
Wave
Easing
Power3 out
Sharp deceleration (current default)
ease = 1 - (1-t)^3
Power5 out
Even sharper deceleration
ease = 1 - (1-t)^5
Expo out
Exponential deceleration
ease = 1 - pow(2, -10 * t)
Sine out
Gentle sine deceleration
ease = sin(t * PI / 2)
Back out
Overshoot then settle back
ease = 1 + 2.7 * pow(t-1, 3) + 1.7 * pow(t-1, 2)
Elastic out
Bouncy spring with oscillation
ease = sin(t * PI * 3) * pow(2, -10*t)
Bounce out
Multiple bounces
Piecewise: ease = bounce(t)
Circ out
Circular deceleration
ease = sqrt(1 - pow(1-t, 2))
Linear
Constant speed
ease = t
Morph
Morph sphere
Particles start on a sphere, morph to text
origin = sphere(angle, phi)
Morph cube
Particles start on a cube surface
origin = cubeFace(face, uv)
Morph grid
Particles start on a grid lattice
origin = floor(random * grid) * cell
Morph circle
Particles start on a circle ring
origin = circle(angle, radius)
Morph line
Particles start on a line
origin = line(t, axis)
Morph cloud
Particles start as a random cloud
origin = random * spread
Morph spiral
Particles start on a spiral
origin = spiral(angle, r)
Morph torus
Particles start on a torus
origin = torus(u, v)
Morph wave
Particles start on a wave surface
origin = wave(x, y, t)
Physics
Special
Explode inward
Particles start scattered, implode to targets
origin = random * 3W, mix inward
Starburst
Particles burst from center outward then settle
origin = center, expand past target, settle
Fireworks
Multiple burst points, particles fly to targets
origin = burstPoint + random * burst
Vortex in
Particles spiral inward from outer ring
origin = spiral(angle, maxR)
Tornado in
Particles twist down/up into position
origin = spiral + heightOffset
Orbit in
Particles orbit center, then spiral into targets
angle = t * speed, r = lerp(maxR, dist, ease)
Scatter gather
Particles scatter outward then gather back
Phase 1: expand, Phase 2: contract to target
Teleport
Particles blink in sequentially at full opacity
if t > delay: alpha = 1, no movement
Quantum assemble
Particles blink in at random quantum times
delay = random * duration, instant appear
Pixelate in
Particles start blocky/quantized, smooth to text
origin = floor(target / gridSize) * gridSize
Dissolve in
Particles materialize from noise pattern
alpha = noise(target.xy, t) > threshold
Materialize
Particles fade in with slight scatter, then settle
alpha = ease, pos = target + scatter * (1-ease)
Blur in
Particles start with large z-spread, focus to plane
origin.z = random * spread, mix z to 0
Scale up
Particles start at 0 size, grow to full size
pointSize = uSize * ease, no movement
Scale down
Particles start huge, shrink to normal size
pointSize = uSize * (1 + (1-ease) * 10)
Flip X
Particles rotate in on X axis (3D flip)
angleX = (1-ease) * PI, pos.z = sin(angle) * depth
Flip Y
Particles rotate in on Y axis (3D flip)
angleY = (1-ease) * PI, pos.x += sin(angle) * depth
Cascade
Particles cascade in like dominoes falling
delay = i / count * duration, sequential
Liquid flow
Particles flow in like liquid, viscous motion
origin = offscreen, pos = origin + flow(t)
Constellation form
Stars twinkle in sequentially, then connect
delay = random, alpha = twinkle(t, delay)
Typewriter
Letter-by-letter reveal
delay = charIndex * charDelay, per-letter
Curtain open
Particles split from center, open like curtains
origin.x = target.x ± (W/2 * (1-ease))
Venetian blinds
Particles appear in horizontal strips sequentially
delay = floor(yNorm * strips) / strips
Scanline
Particles appear following a scanning line
delay = yNorm, bright scanline at y = progress
Glitch assemble
Particles glitch in with random offsets then settle
origin = target + glitch, glitch decreases with t
Ink spread
Particles spread from a point like ink in water
origin = point, r = ease * dist, turbulent
Paintings
Masterworks rendered as thousands of GPU particles. Hover to scatter — watch them reform into the painting.

The Birth of Venus
Sandro Botticelli, c. 1485

Mona Lisa
Leonardo da Vinci, c. 1503–1519

The Night Watch
Rembrandt van Rijn, 1642

Girl with a Pearl Earring
Johannes Vermeer, c. 1665

The Great Wave off Kanagawa
Katsushika Hokusai, c. 1831

Liberty Leading the People
Eugène Delacroix, 1830

Napoleon Crossing the Alps
Jacques-Louis David, 1801

The Scream
Edvard Munch, 1893

The Creation of Adam
Michelangelo Buonarroti, c. 1512

The Starry Night
Vincent van Gogh, 1889

Self-Portrait
Vincent van Gogh, 1889

Café Terrace at Night
Vincent van Gogh, 1888

Impression, Sunrise
Claude Monet, 1872

Water Lilies
Claude Monet, 1916

The Kiss
Gustav Klimt, 1908

The Star (L'Étoile)
Edgar Degas, 1878

The Last Supper
Leonardo da Vinci, c. 1495–1498

Declaration of Independence
John Trumbull, 1819
Ant Text
1,500 ants with detailed sprites — body, legs, antennae — crawl across the canvas, wandering and stopping like a real colony. They converge to form words, scatter, and reform.