HUMAN OS
an operating system for a living human
An interactive authorial project about the fact that a human cannot be reduced to a set of metrics. The site starts like an operating system: it loads a “biological system”, describes it through four processes — sleep, fuel, connection and protection — builds a model, tries to compute the “optimal human state” and runs into the limit of its own model. The finale: “You are not a machine. You are a living system. Take care of it.” I am the author of the idea and art direction: I developed the concept and script in dialogue with AI, and built the site with Codex as a static Next.js project.
01 / what it is
A project about the fact that technology has changed, while basic human needs have not
Four directions — sleep, food, closeness and protection — started as four separate ideas: a managed shutdown (Sleep OFF), “last meal” (Last Meal), a consent interface (Consent UI) and safety without weapons (Safe Mode). I merged them into one system: HUMAN OS — “an operating system for biological life”. The project line: “Ancient body. Modern world.”
This is not a scrolling landing page. One viewport, scenes replace one another, the central object is a human and their material world: a face, hands, food, fabric. The interface gradually gives way to the body: DATA → BODY. The drama follows the arc MEASURE → MODEL → OPTIMIZE → FAIL → REVEAL: the system first seems authoritative, then shows interdependencies, tries to optimise the human — and admits that care is not optimisation.
02 / interface
Key screens of the finished site
The shots are taken from the running build at 1440×900. In reality these are interactive scenes: switches, sliders, mutual confirmation, sound on request.
Open the site ↗











03 / script
Five steps from measurement to admitting the limit
The whole experience is a single dramatic arc. Every chapter ends with a return to the main map, and the map changes: at first it is strict and confident, by the finale — open and incomplete.
- Boot. Three loading scenes: species — Homo sapiens, origin — about 300,000 years ago, environment — industrial and digital. “Evolutionary legacy meets modern environment”.
- Main System. Four processes around a central object. “System model / structured”, dependencies unmapped. After each chapter it changes: dependencies detected → variables interdependent → boundary permeable → model incomplete.
- Four chapters. Sleep, Fuel, Connect, Protect — 8 screens each. Each has its own visual carrier: the body, material, a pair of people, the space around the body.
- Optimization failed. 5 screens: calculating the optimal state → conflicting variables → objective function unresolved → optimal state undefined → optimization failed. This is not a crash: the system admits its limit.
- Reveal. 4 screens: “Model limit detected”, “A human is not a problem to solve”, “Optimization is about control. Care is about response”, “You are not a machine. You are a living system. Take care of it.”
04 / chapters
Four processes — four visual languages and one logic
The chapters differ in form but obey the same principles. Each has its own hard rule that forbids turning it into a familiar health interface.
| Chapter | What happens | Interaction | Rule |
|---|---|---|---|
| 01 / SLEEP | Entry → Wind down → Sleep onset → Deep recovery → Interruption → Restriction → Wake → Return. The carrier is the body: face, breathing, closed eyes. | Light, information, activity: categorical switches; a sleep window of 2H–10H | No sleep score and no “perfect sleep”. 8 hours means “within typical adult range”, not an optimum |
| 02 / FUEL | Demand → Input → Breakdown → Availability → Satiety → Modern environment → Mismatch → Return. The carrier is material, not a person. | Availability: NOW / LATER / SUSTAINED | No calories, macros or “good” food: food has no moral status. Mismatch: “target / undefined” |
| 03 / CONNECT | Detection → Distance → Approach → Mutual signal → Contact → Disconnect → Boundary → Return. The carrier is two people. | Distance FAR / NEAR / CLOSE; each human has their own signal button and withdrawal | No human becomes the interface for another: both have the same status, not “user / target”. Sync ≠ merge |
| 04 / PROTECT | Baseline → Signal → Orientation → Response → Defense layers → Prolonged activation → Recovery window → Return. The carrier is the space around the body. | Response: Move away / Pause / Seek support / Limit access | A signal is not yet a threat: “Threat status — unknown”. No radar, tactical HUD or alarm colours |
Between chapters, relations are shown (no more than 1–3 at a time): related, potential, contextual, interdependent, in tension, unresolved. Each is marked with a reliability level — OBSERVED, INFERRED or SIMULATED. The words “priority”, “recommended”, “best next”, “causes”, “fixes” are forbidden in the interface.
05 / project language
HIL — Human Interface Language: repeat principles, not tricks
The project is recognised not by colour, glitch or grid, but by how the system thinks, doubts and admits the limits of its own model. For that I formulated 10 rules — the Human Interface Language.
- 01 / Body before interface
- 02 / Data is a model
- 03 / The system can be wrong
- 04 / Motion must have a cause
- 05 / Data → Body
- 06 / Biology overrides UI
- 07 / Error has meaning
- 08 / 100% is not a human state
- 09 / No moral judgment
- 10 / Care ≠ Optimization
13 familiar elements are forbidden in the interface: health, wellness, readiness and risk scores, compatibility %, calorie target, macro %, daily goal, streak, progress %, best next step, recommended and priority rank. Green does not mean “good”, red does not mean “bad”.
Two readiness tests. The blind test: remove the name, the modules and the accent colours and ask “what does this interface want from the person?” — the right answer is “nothing specific, it observes and describes conditions”. The anti-sci-fi test: if the interface could be renamed “Orbital Defense System” without changing its language, it must be redone.
06 / how it was made
From four ideas, through 25 screens and grayscale wireframes, to a site with 49 states
The project was built in stages. Each stage ended with a document and a check, not just a picture: about 64,000 words in 36 files in total — from the concept to the acceptance criteria.
- The original task: four themes — sleep, food, closeness, defence — as one noticeable authorial project.
- One system instead of four cases; the formula “operating system for biological life”.
- A full 25-screen script, then vertical slice v0.1: Boot → Main System → Sleep → Main System → Final.
- Sleep as the reference chapter: 9 key-frame candidates, a photo selection matrix, 3 sleep-restriction variants, a clickable prototype.
- Fuel, Connect and Protect on the same pattern; a transition map between modules and rules for showing relations.
- A handoff package for development: screen inventory, state machine, components, tokens, motion, responsive rules, copy, acceptance criteria. Built from it with the help of Codex.
07 / technology
Stack and how the build works
The site is a static Next.js export: the host needs neither Node.js nor a database. The whole script is described by types and a finite-state machine, so each of the 49 states is reachable and testable.
| Layer | What is used |
|---|---|
| Framework | Next.js 15 (App Router, static export), React 19, TypeScript |
| State | XState 5: 49 scene identifiers, events NEXT, BACK, RETURN_MAIN, OPEN_MODULE; progress is kept in the browser (sessionStorage) with no profile or scoring |
| Motion | GSAP; every movement has a cause and is simplified under prefers-reduced-motion |
| Graphics | 5 WebGL shaders (“fields”): wind-down, fuel material, connect, protect and the finale; plus WebP photography |
| Sound | Web Audio API: 5 ambient tracks (room tone, system hum, sleep low, material soft, environment threshold), enabled only by the user, no rewards or alarms |
| Styles | CSS Modules and CSS variables: tokens, grid, typography in Space Grotesk, Geist Mono and Oxanium (fonts are local) |
| Accessibility | Keyboard and focus ring, targets of at least 44 px, no hover-only actions, responsive from 1440+ to <768 |
| Size | about 110 source files, ~4,500 lines of TypeScript and ~1,550 lines of CSS; an 8.3 MB build |
The repository also has a server-side layer that classifies the sleep state through TypeSafe Jev (typed states and a confidence threshold); it is not part of the static version — it is groundwork for extension.
08 / scientific frame
Human OS may visualise biology, but does not pretend to diagnose it
The project is speculative design, not health-tech. During the work 13 formulations that looked scientific were replaced with more honest ones. For example:
| Was | Became | Why |
|---|---|---|
| 8H = OPTIMAL | 8H = WITHIN TYPICAL ADULT RANGE | 8 hours is not a universal optimum |
| RECOVERY SCORE 62% | RECOVERY STATE / CONSTRAINED | recovery cannot be reduced to one number |
| ENVIRONMENT COMPATIBILITY 43% | Mismatch: evolutionary legacy meets modern environment | there is no validated compatibility scale |
| OXYTOCIN RESPONSE | Sensory / social signal / proximity response | touch is not a “love hormone” |
| FEAR IS A SAFETY PROTOCOL | FEAR IS A SAFETY SIGNAL | less mechanistic |
| FAILED for emotions and love | IRREDUCIBLE | the finale is about the limit of reduction, not a “breakdown” |
Three reliability levels for every value: OBSERVED — a user choice or a known value, INFERRED — a plausible direction of effect, SIMULATED — an artistic model with the mandatory label “simulated system model”.
09 / next projects