all projects

live on this page

Mascot engine

A hand-built physics engine and brain for the scout that lives on this site.

Rhombus scout, technical drawing The site mascot drawn as an 11 by 9 pixel diamond: off-white body, one cyan eye and an orange three-pixel aft vent, with dimension lines, labeled callouts and a title block. 11 px 9 px X · body #F8F8F2 E · eye #8BE9FD M · aft vent #FFB86C RHOMBUS-SCOUT RENDER4px/px SRCsprites.ts

What it is

Gravity, squash and stretch, and perch-to-perch leaps between real elements on the page, plus a face that reacts to what's on the page, grab-and-fling, and a "wanna fight?" mini game. What it does next is a small utility AI: fatigue, boredom and a memory of where it has already stood score every option, and it picks among the best few. Every few seconds it also asks Jev, TypeSafe's decision model, what fits the moment, so it goes to look at what you hover, keeps quiet while you read, and picks the line that suits the hour. Physics, perches, expressions, interactions and the brain each live in their own pure module, composed by one state machine reducer and covered by Vitest, down to minutes-long simulated visits.

sprite
rhombus-scout, 11 × 9 px
render
svg rects, 4px per pixel (3px under 640)
body
#F8F8F2
eye
#8BE9FD
aft vent
#FFB86C
moods
neutral · happy · surprised · sleepy
glyphs
Z · ! · ? · @ · heart
src
sprites.ts

Stack

  • TypeScript
  • Vue
  • Astro
  • Vitest
  • Jev
  • Cloudflare Workers