Back
🏆 Finalists · Generative UI Hackathon🤖 Agentic InterfacesMay 2026CDMX

atriumAn AI medical team living in a 3D HQ.

Six specialists — Synapse, Pulso, Atlas, Aire, Vesta and Vitrum — walk around their clinic, examine a navigable human body, explain the heart live, map four-generation pedigrees and measure how much water and CO₂ each inference costs. Bilingual voice, zero API keys.

RoleLead · Frontend · 3D · Remotion render
Team4 people · Emilio · Héctor · Sergio · Ken
StackNext.js · React Three Fiber · CopilotKit · Web Speech API
Delivery8 sub-views · 65s Remotion reel

Three surfaces, one medical team

3D hospital, navigable body and corazón explained live.

Three views sharing the same six-agent team: a 3D HQ where they walk, examine and discuss cases; a body atlas with four visualization modes; and a cardiac panel pulsing with real patient physiology.

Live demo

The 3D clinic in orbit: agents walking between the operating room, waiting room and ER. 60 fps, per-agent pathfinding, no backend.

Atrium Clinic showing a 3D human body with skin, wire, x-ray, bones tabs and organ-selection panel

Atlas · Body 3D

The body, navigable.

An interactive human body with four modes: skin, wire, x-ray and bones. Click the heart → Pulso explains it; click the brain → Synapse shows up. Every organ is an entry point to a specialist.

  • 4 visualization modes
  • Multi-agent clinical board
  • Click → specialist
  • 4-generation pedigree
Pulso agent panel showing live 72 BPM, EKG and key human heart data

Pulso · Live cardiology

BPM, EKG and SpO₂ told as a story.

Pulso doesn't return raw data, it explains. ‘Hi, this is Pulso. The heart is a double muscular pump…’ Normal ranges, key data (cardiac output, ejection fraction) and when to go to ER. X-ray mode over the thoracic cavity.

  • BPM live · 60–100
  • 120/80 mmHg · 5 L/min
  • AI cardiologist voice
  • Urgent alerts
Mendoza Ríos family pedigree across four generations with index case highlighted and side panel showing respiratory conditions

Pedigree · Family genetics

Four generations, one index case.

Vitrum maps full pedigrees: atopic phenotypes, maternal-line transmission, candidate genes like ORMDL3 (17q21) in asthma. The index case (Carlos Mendoza Ríos) is highlighted with all conditions, allergies, exposures and clinical notes.

  • 4 generations
  • Index case highlighted
  • ORMDL3 · 17q21
  • Maternal line

Project showcase

65 seconds rendered with Remotion + React

9 cinematic scenes at 1080p — intro, office, agents, voice, neural, stack, Atrium Clinic, healthcare companion and outro. All code, no Premiere or After Effects.

Capabilities · Clinical system

Six specialists that show their work.

It's not a chatbot answering questions — it's a team that moves, examines, discusses and leaves visible trace. Every decision fires a pulse in the shared neural network; every inference is measured in water, CO₂ and energy.

System core

Neural Mind · 6 especialistas

A shared neural network pulses every time an agent makes a decision. Visualized in 2D and 3D — Synapse (neurology, purple), Pulso (cardiology, pink), Atlas (coordination, orange), Aire (pulmonology, blue), Vesta (GI, green) and Vitrum (anatomy, yellow). Each agent has a pose: type, talk, think, walk, idle.

6specialists
60 fpsunder stress
2D + 3Dtopology
2D neural network with the six specialists (Synapse, Pulso, Atlas, Aire, Vesta, Vitrum) and pulsing nodes
Body atlas with mic FAB visible
Bilingual voice

Hold SPACE. Talk to the team.

Native Web Speech API, push-to-talk via spacebar or mic FAB. Real-time language detection (ES/EN), parses ‘everyone to the meeting room’ or ‘Pulso follow patient’, dispatches intents (meeting, work, think, walk, idle, talk-to) and replies with TTS in the same language. Aliases for STT mishears (pickle→pixel, amber→ember).

  • ES + ENauto-detect
  • 0API keys
  • 11intents
Atrium Infection Control panel with water, CO2 and energy metrics
Sustainability live

Every prompt costs water.

‘Infection Control’ panel measuring the real environmental cost of each inference: 14.3 L of water today, 38 g CO₂e per session, 0.21 kWh total, 142 prompts at 0.10 L/call. Switching to Haiku reduces use by ~40 %. The first health dashboard that shows its datacenter footprint.

  • 14.3 Lwater today
  • 38 gCO₂e
  • 0.10 L/ prompt
Isometric view of the 3D Atrium office with dialogue bubbles between agents
Multi-agent clinical board

The six gather, with you watching.

When the case calls for it, the agents gather in the meeting room — four seated, two standing — and talk to each other with 3D bubbles: ‘Let's order the MRI’, ‘to the nurses' station’, ‘reviewing the case’. Each agent has aliases in Spanish and English, and respects explicit subjects (‘Pulso think’ → only Pulso thinks).

  • 4 + 2seated + standing
  • 11intents
  • ES + ENaliases

Hackathon stack

Built for Generative UI, shipped solo.

Tech bets: React Three Fiber over Unity, CopilotKit over custom orchestration, Web Speech API over cloud Whisper, Remotion over After Effects. Each one dropped iteration cost to minutes.

Web
  • Next.js

    Next.js

    App router · Edge

  • React

    Live UI 18+

  • Tailwind

    Tailwind

    Quick styles

3D
  • RealityKit

    Three.js + R3F · drei

  • Figma

    HQ mockups

AI
  • Notion

    CopilotKit · agents

  • Python

    Hono runtime

Render
  • GSAP

    Remotion 4 · React 19

  • Vercel

    Native Web Speech API

Closing

Four people, six medical agents.

Atrium · Clinic was born at the Generative UI · Agentic Interfaces hackathon — CDMX, May 2026, hosted by AI Tinkerers Mexico City. The question was: what do UIs look like when agents are first-class citizens? The answer was to give them a body, a clinic and let them walk.

6AI specialists
8Sub-views
~5.2kLines shipped
65 sRemotion reel

“The past generation of AI products put a chat box on top of everything. The next one will let agents live in a space. Atrium was my way of testing it in clinical — but the pattern works just as well for finance, education and ops.”

— Project notes, day 2