Vilya Protection

An assassination-prevention SaaS, live in one short cycle. Built the public site and the demo dashboard for Vilya Protection. Brief on Monday, live two tiny tweaks later.

• 01User surface

  The whole experience the user sees

  This frame shows the live product: vilya protection · assassination-prevention software platform for public figures and large events. the demo shows the full operational dashboard. Every component is ours · scope, design, code, deploy.

• 02Stack behind the screen

  What's powering it: Next.js, TypeScript, Three.js

  4 stack components run behind this frame · Next.js, TypeScript, Three.js drive the visible UI; the rest sit in the data layer. All studio-owned.

• 03What we shipped

  Real-time threat assessment with severity classification

  A single operational console for every protection-detail signal

• 04Status

  Live · demo.vilyaprotection.com.

  This isn't a demo · real traffic flows through it, with monitoring + weekly fixes attached.

• 01 · BRIEF

  Two pages of brief, no kickoff call.

  Michael sent a short LinkedIn DM with a Notion brief. The studio sent back a 90-minute scope confirmation, then the build started. No decks, no workshops, no committee.

• 02 · ARCHITECTURE

  Stack decisions before any code.

  Decision doc captured the data flow, Next.js, TypeScript, Three.js, WebGL role split, and the failure modes we'd handle in v1 vs defer. Cross-service boundaries (where AI ends and the web app begins) were drawn here so neither side leaked into the other later.

• 02 · BUILD

  Marketing site + tactical dashboard, parallel tracks.

  Public site on Next.js, demo dashboard with Three.js for the 3D venue walk-through. Threat-severity colour system (Critical, High, Medium) wired in from day one so the demo reads as a real product.

• 04 · POLISH

  Performance, accessibility, and observability.

  PSI / a11y / coverage budgets enforced as launch gates. Logging + metrics wired before cut-over · the team can answer 'is it working?' from a dashboard, not a Slack thread. Threat-model checklist signed off before traffic hits the box.

• 03 · SHIP

  Two minor tweaks, then live.

  Inbox arrival was already what Michael had pictured. Two small revisions covered the entire feedback round. Cut over, indexed, and the demo dashboard was running for sales calls within the same week.

• 01Marketing site

  Public site explaining a niche category

  Hero leads with the problem (predictable threat patterns get missed), services explain the operational answer, the demo CTA routes high-intent buyers straight into the dashboard.

• 023D demo

  WebGL venue walk-through in the browser

  Three.js scene with threat markers, evacuation routes, sight-lines. No Unity, no Unreal, no install · the prospect can interact with it from the same page they read the pitch on.

• 03Threat board

  Live threat list with severity classification

  Critical / High / Medium / Low colour system, source flags, location pins, response state. Reads like a SOC console an analyst already knows how to use.

• 04i18n

  English-first with Spanish-ready routing

  Alicante-based founder · the locale tree is wired so a Spanish surface can drop in without re-architecting.