Inspiration
Most security tools feel like a visit to the doctor who hands you a 40-page report instead of telling you what's actually wrong. Tables. Charts. CVE numbers. Severity scores. None of it feels urgent. None of it feels real.
We kept asking one question: what if your company's digital infrastructure had a body?
The moment that metaphor clicked, everything followed naturally. Domains are organs. APIs are arteries. Vulnerabilities are infections spreading through tissue. Security controls are immune cells fighting back. The biology was already there — we just made it visible.
We were also tired of seeing security treated as a compliance checkbox. The teams that get breached are not the ones who lack data. They are the ones who couldn't feel the risk. We wanted to build something that makes you feel the risk in the first five seconds of looking at it.
That became The Digital Immune System.
What It Does
The Digital Immune System turns your organization's attack surface into a living, breathing 3D organism — in real time.
You enter a URL. The system scans it. And instead of returning a spreadsheet, it builds a world.
- Domains become organs — each one a node you can rotate, zoom into, and click
- APIs become arteries — glowing connections that carry data between organs
- Open ports become exposed wounds — pulsing red points on the organism's surface
- Vulnerabilities become infections — spreading particle storms that darken the sky around the affected organ
- Third-party dependencies become parasites — external nodes orbiting the organism
- Security controls become immune cells — visible defenders actively patrolling the healthiest regions
The AI layer then speaks in plain English. Not 12 vulnerabilities found. Instead:
Your authentication system is currently the weakest organ in your digital immune system. Three active infection vectors detected. The camera will take you there now.
And the camera moves. The organism reacts. The particles swarm.
The entire experience is scroll-driven, cinematic, and interactive — built to make cybersecurity legible to anyone, not just security engineers.
How We Built It
The 3D organism lives inside a WebGL canvas rendered with React Three Fiber and Three.js. The organism surface is a high-subdivision icosahedron driven by a custom GLSL vertex shader — simplex noise displaces the geometry in real time, giving it the slow breathing quality of something alive. A second shader controls color, blending healthy cyan toward infected red as the threat score rises.
The particle system runs 40,000+ points distributed on a spherical shell around the organism. Particles use additive blending so they glow without obscuring depth. During a scan they swarm inward. During a threat event they storm outward in red.
Scroll-driven camera choreography is handled by GSAP ScrollTrigger. Scrolling does not move a page — it moves the camera through space. Each section has a different position, angle, and lighting atmosphere. The user feels like they are flying through a system.
The backend is a FastAPI service running real security checks — socket-level port scanning across common attack vectors, HTTP security header analysis, and DNS record inspection. Raw findings are then passed to an OpenAI API call that converts them into biological narrative: specific, vivid, plain-English organ metaphors tied to real vulnerability data.
State flows through Zustand — scan phase, progress, vulnerability array, and organism health all live in a single store that both the 3D canvas and the UI layer read from in real time.
Challenges We Ran Into
Making the metaphor accurate, not just pretty. The hardest problem was ensuring the biology mapped onto real security concepts without becoming decorative. Every visual decision had to carry actual meaning. An infection that spreads to adjacent organs needed to reflect how lateral movement actually works in a compromised network. We rewrote the mapping system three times before it felt honest.
Performance at scale. Running 40,000 particles, a noise-displaced shader organism, scroll-driven camera animation, and a live React UI simultaneously on a single thread pushed the GPU hard. We had to carefully balance particle count, shader complexity, and draw calls. Additive blending and depth write optimization were critical to staying above 60fps on mid-range hardware.
GSAP ScrollTrigger inside a fixed Canvas. The 3D canvas is fixed to the viewport while scroll content layers above it. Getting ScrollTrigger to drive camera position from a scrollable div without fighting React's render cycle required a specific architecture — refs bridging the GSAP world and the R3F useFrame loop rather than direct state updates.
The LLM narrative quality. Early prompts produced generic output. Getting the model to produce specific, biologically coherent, emotionally resonant explanations tied to real findings — not just rephrased CVE descriptions — required significant prompt engineering and structured output formatting.
Demo stability. A live scan that fails in front of a judge is worse than no scan at all. We built a complete pre-scanned demo mode with real target data that is visually indistinguishable from a live scan. The fallback engages silently. The demo never breaks.
Accomplishments That We're Proud Of
The organism feels alive. Within the first five seconds of loading, before anyone reads a word, the breathing sphere communicates something. That was the hardest thing to achieve and the most important.
The metaphor holds under scrutiny. Every node, every particle behavior, every color shift maps to a real security concept. It is not decoration — it is a visual language for threat communication that security professionals and non-technical stakeholders can both read.
Real scan data, not mock data. The backend performs genuine port scanning, header inspection, and DNS analysis. The organism that grows is built from actual findings about an actual domain.
The AI narrative layer. Replacing a vulnerability count with a sentence a CEO can understand — and having the camera physically fly to the problem as the AI speaks — is the moment every judge leans forward. We are proud of that moment.
Zero dashboard UI. We shipped the entire project without a single card, sidebar, table, or modal. Every piece of information surfaces through the 3D object itself or through cinematic text overlays. This constraint made every design decision harder and better.
What We Learned
We learned that the constraint is the design. Refusing to use cards or dashboards forced us to find spatial solutions to information problems we would otherwise have solved lazily. The organism became richer every time we removed a UI element and pushed the meaning into the 3D world.
We learned that metaphor is not decoration. The biology metaphor works because it maps onto how security actually behaves — infections spread, immune systems respond, organs fail. That structural accuracy is why the visualization feels intuitive rather than gimmicky.
We learned that a demo that can fail is a liability. The engineering time we spent on the pre-scanned fallback system was not wasted time. It was risk management. Ship the experience, not the live dependency.
We learned that prompt engineering is product engineering. The difference between an LLM that produces generic output and one that produces something a judge quotes to another judge is entirely in the prompt structure, the output schema, and the few-shot examples. That layer deserved far more time than we initially gave it.
What's Next for The Digital Immune System
Continuous monitoring. Right now, the organism is a snapshot. The next version watches your domain continuously and evolves the organism in real time as your attack surface changes. The organism grows new nodes when new APIs deploy. It darkens when a certificate approaches expiration. It pulses when anomalous traffic spikes.
Time Travel. A slider that moves the organism backward and forward through time — showing how the attack surface evolved over weeks, when infections first appeared, and what the predicted state looks like in 30 days based on current exposure trends.
Team mode. Multiple organisms in one space. Your company's organism orbits alongside your critical vendors and third-party dependencies. When one is compromised, you see the infection vector crossing the gap. Supply chain risk becomes visible for the first time.
The Threat Storm alert system. When a zero-day drops that affects your stack, the organism triggers automatically. Sky darkens. Red particle storm. Camera shake. Push notification. Not a Slack message with a CVE link — a biological emergency your whole team can see.
Enterprise dashboard — built spatially. No cards. The executive view is a solar system of organisms. Each subsidiary, each product, each region is its own planet. Health is visible at a glance from orbit. Zoom into any one and the full detail surfaces.
The long-term vision is simple: security that anyone in an organization can see, feel, and understand — not just the team that reads the reports.
Log in or sign up for Devpost to join the conversation.