I THINK I STARTED WORKINGAS AN FRONTEND ENGINEERIN 2024.

• 0101
  FIELD/LAB
  Art · Build · Generative · Webshop
  GENERATIVE · NEXT.JS
  2023

  Webshop for generative art prints. The hero is a generative canvas that reacts to the scroll and the time of day.

• 0202
  LSRP:WORLD
  Fullstack · Game server
  REACT · C++ · MYSQL
  2022

  A multiplayer roleplay server for GTA. I built the web dashboard and the server-side C++ logic.

• 0303
  A.
  ART · BUILD · EXPERIMENTS
  NEXT.JS · MDX
  2023

  a field guide to looking.

• S-001Pattern ShellA tessellating shell that unfolds along the cursor.WebGL2024→
• S-002Oil Paint TrailPointer trails rendered as viscous, pigment-thick strokes.WebGL2024→
• S-003Chain WiggleVerlet-integrated chain that settles into calm after motion.JavaScript2024→
• S-004ASCII MouseLive video re-rendered as a dense ASCII field.JavaScript2024→
• S-005Random GenerativeA daily generative grid, seeded by the date.JavaScript2023→
• S-006Drag & Drop MediaPipeHand-tracked drag and drop without a pointer device.MediaPipe2023→
• S-007Infinite MarqueeSeamless two-track marquee with velocity skew.GSAP2023→
• S-008Type RevealPer-character mask reveal bound to scroll progress.GSAP2023→
• S-009Distorted SphereAn icosahedron displaced by simplex noise and time.Three.js2024→
• S-010Scroll SnapshotCaptures a frame at every section to build a filmstrip nav.Next.js2024→
• S-011Magnetic ButtonButtons that lean toward the cursor with easing.JavaScript2025→
• S-012Time-of-Day ThemePalette that rotates with the visitor's local hour.CSS2025→
• S-013Fluid Gradient TypeText filled with a slow-moving fluid simulation.WebGL2025→
• S-014Cursor TetherA secondary cursor lags the primary with a spring.JavaScript2025→
• S-015Pixel Sort ImageAsm-style pixel sort over a webcam feed.Canvas2024→
• S-016Scroll Hijack ReframeSmooth-scroll that reframes panels instead of sliding.GSAP2024→
• S-017Audio Spectrum RingFFT ring that breathes with an ambient stem.Web Audio2024→
• S-018Voronoi Tile HoverA voronoi grid that re-tiles on hover.SVG2025→
• S-019Page TransitionsView-transition wrapper for route changes.Next.js2025→
• S-020Grain & HalftoneAdjustable film grain + halftone post pass.Canvas2023→
• S-021Kinetic TypographyLetters that breathe with a slow sine wave.GSAP2025→
• S-022Cursor HaloA soft halo trails the cursor with elastic easing.JavaScript2025→
• S-023Noise Field FlowParticles advected through a curl-noise field.WebGL2024→
• S-024Scroll Velocity SkewElements skew based on scroll velocity, then settle.GSAP2024→
• S-025ASCII RainMatrix-style rain seeded by the section heading.Canvas2023→
• S-026Magnetic DockA dock that pulls items toward the cursor, macOS-style.JavaScript2025→
• S-027Liquid BorderA button border that flows like liquid metal.SVG2025→
• S-028Pinned Reveal StackScroll-pinned cards that stack and reveal.GSAP2024→
• S-029Tone SweepA sine sweep visualised as a fading ring trail.Web Audio2024→
• S-030Dither GradientBayer-matrix dithering on a slow gradient.Canvas2023→
• S-031Hover Card TiltCards that tilt in 3D toward the cursor.JavaScript2025→
• S-032Reduced-Motion ModeEvery animation, gracefully paused.CSS2025→

LET'S MAKE
something
WORTH KEEPING.