Skip to content

This website

← projects

meta · web

Can a fixed-viewport, no-scroll shell stay usable for real content?

Agent island JS

1.6 KB gz

gzip of the inlined island script, commit 9e8830a

Steering maths tests

18

vitest run, commit a6dd73a

Lighthouse score

pending · M4 audit (PHI-45)

Astro 6 · TypeScript · Tailwind v4 · Cloudflare Pages · 2026

Problem

Portfolio sites collapse into templates: a scrolling page, a wall of cards, numbers nobody can check. The brief for this one was different — a fixed viewport where panels slide instead of scrolling, a live simulation of steering agents as the signature element, and a standing rule that no metric appears anywhere without a source.

Approach

Content is data: every project, note, and build-log entry is a markdown file with a schema-checked frontmatter, so adding one is a commit, never a code change. The shell is Astro with view transitions; the agents are a vanilla-TypeScript canvas island ported from my COS30002 steering coursework. The honest-numbers rule is enforced mechanically — a metric without a source field fails the build.

Architecture

A 200px rail and a 100dvh stage; five panel routes joined by directional slide transitions. One island owns the canvas: pure steering maths over an injected seeded RNG, an engine for the loop and DPR-aware sizing, and a readout that displays only live-measured values. CI runs type-check, build, and the steering tests on every push, then deploys to Cloudflare Pages.

Results

The metrics above are the build’s own receipts: the island’s gzipped size, the test count, and a Lighthouse card that stays an em-dash until the M4 audit actually runs.

Reflection

The constraint is the design. No-scroll forces every panel to fit the viewport, which forces editing; the source-required schema forces every claim to carry its receipt. The build log on this site records the decisions as they happened, commit by commit.