Before day zero: a domain and a WebGL homepage

On June 4, 2026 — five days before we told anyone we existed — we bought one thing: the domain pangaea.id, from Hostinger. Day minus five. No site, no copy, no plan beyond a conviction: if we were going to sell AI, implemented, the homepage had to feel like it.

The first build was the fun one

Before the strategy, before the SEO, before any of the discipline the rest of this diary is about — we did what every engineer does first. We built the cool version.

One page. Dark. A live WebGL backdrop behind every section: an animated agent constellation, points of light wiring themselves together as you scrolled. It was a literal picture of the work we wanted to do — agents as nodes, pipelines as the edges between them.

One scroll, the whole story

It was a single-page app. Lenis carried the scroll, smooth as oil, from the hero all the way down — every section floating over the same dark, breathing field of stars. Here's the whole thing at a glance, then a quick tour of each frame, top to bottom.

Reading the sheet top to bottom, here's what each frame was:

• Hero — “AI, implemented.” The constellation at its calmest, with two ways in: book an audit, or meet the agents.
• Trusted by A quiet row of the clients and partners we'd already shipped for.
• Why — “Adoption is a discipline. We install it.” Three cards: compress the learning curve, sell the discipline (not the hype), prove it with metrics.
• 01 · AI Implementation Whiteboard-to-production RAG and agentic systems, beside a mock production-pipeline panel.
• 02 · Eval & Audit “No AI ships on vibes” — four score tiles: faithfulness 0.94 and friends.
• 03 · Plugins & Agents A library of demoable agents, each a node in the constellation: AI Audit, Prod RAG Pipeline, CodeGen, AIReview.
• 04 · Software Development The other half of the work — four case-study cards, from travel commerce to government-scale microservices.
• Proof — “Numbers that survive an audit.” Weeks, Week 1, 12+, 100% — with named testimonials.
• Process Scope → Build → Eval → Ship: the whole engagement in four moves.
• 05 · Digital Marketing Platform Own your storefront, not a rented stall — the reach-and-conversion pitch.
• Pricing — “Priced to approve, structured to stop.” Three rungs (Adopt, Amplify, Autonomize); Fixed vs Monthly.
• Team — “Built by people who ship.” Secure by design, quality over quantity, real production pedigree.
• FAQ — Methodology, security, commercials. The skeptic's questions, answered straight.
• Contact — “Let's start.” The Adopt-Assessment form, over the densest part of the field.

The brief that started it

We didn't sketch this in Figma. We wrote the whole thing as one prompt — committed on day one as pangaea-design-system-prompt.md, still sitting in our very first commit — and built straight from it. The heart of it, verbatim:

# Build the Pangaea Labs Design System — "Agent Constellation"

Build a production-grade, reusable design system + immersive landing page for
Pangaea Labs, an AI infrastructure & services company. The whole site sits on top
of one continuous live WebGL scene — no video files, rendered every frame — that
carries the brand's emotion the way a film's cinematography does. Make it
unforgettable, not generic. Refined, dark, atmospheric, engineered.

## The Signature: Agent Constellation (the centerpiece — get this right)
A single fixed-position React Three Fiber canvas behind all content, rendering a
constellation of glowing "agent" nodes connected by thin signal lines in deep space:
- Zero video. Everything is live WebGL/GLSL, rendered each frame.
- GLSL shaders bloom the nodes and send light pulses along the edges between
  connected agents (signal flow).
- Lenis smooth scroll: scroll *velocity* physically drives the camera through the field.
- WebGL depth of field: the focused cluster is crisp; distant clusters blur like a lens.
- Two hex colors carry every emotion — #0A1A2F (navy void) + #3FA9F5 (electric blue).
  Never a third hue. Emotion comes from node density, brightness, fog, camera energy.

## Anti-slop guardrails
- No Inter / Roboto / Arial / system fonts; no Space Grotesk.
- No purple-on-white, no generic SaaS gradient hero, no third color.
- No stock video, no <video> background — the scene must be live WebGL.
- Every section must visibly change the constellation; if a section doesn't move
  the scene, it's wrong.

Reading it back now, the pivot we were about to make looks almost inevitable: it's gorgeous — and it's a lot of machine for a homepage.

Step one: make it run

This entry is only step one — get it building and running on our own machine. No domain wired up yet, no deploy, no edge. Just npm run dev, localhost:5173, and a dark page that genuinely made us grin.

The version that makes the builders grin isn't always the version that gets you found. We were about to learn that the hard way.

That reckoning — why we eventually deleted this beautiful thing — is its own chapter, the pivot. But that's getting ahead of ourselves.

Next: point pangaea.id at something real, and ship it.