Maksutov Design MAKSUTOV DESIGN
Speculative design Interactive experience 49 states 4 processes: SLEEP · FUEL · CONNECT · PROTECT Next.js · XState · GSAP Web Audio · WebGL

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.

49states, 32 of them in four chapters
4×8screens: Sleep, Fuel, Connect, Protect
40photographs (6.6 MB with sound)
5ambient tracks, mp3 and ogg
6types of relation between processes
0scores, rankings or recommendations

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 ↗
HUMAN OS — first scene with four processes
01 — Boot: core processesThe first scene: four processes as abstract shapes — SLEEP, FUEL, CONNECT, PROTECT — still without people or data.
HUMAN OS — main system map
02 — Main System“System model / structured”: dependencies unmapped, model confidence high, no chapters completed yet.
HUMAN OS — Sleep chapter, sleep onset
03 — Sleep: onset“Sleep cannot be forced”: conscious control is reducing, direct control is unavailable.
HUMAN OS — Sleep chapter, recovery window
04 — Sleep: recovery windowA choice from 2H to 10H. At 2H the “productivity override” request is denied — a biological constraint.
HUMAN OS — Fuel chapter, availability
05 — Fuel: availabilityThree states — NOW, LATER, SUSTAINED — instead of calories and macros.
HUMAN OS — Fuel chapter, mismatch
06 — Fuel: mismatch“Target / undefined”: availability is not need; food has no moral status.
HUMAN OS — Connect chapter, mutual signal
07 — Connect: mutual signalTwo equal humans and two independent confirmations. A connection exists only when both agree and can be withdrawn at any time.
HUMAN OS — Protect chapter, protective layers
08 — Protect: protective layersBody, distance, support, network, reflex, space, rules, infrastructure — as nested layers, not a radar.
HUMAN OS — system map after four chapters
09 — Main System: model incompleteAfter four chapters: variables are interdependent, context is non-local, confidence is limited; three relations between processes are visible.
HUMAN OS — optimization, objective function unresolved
10 — Optimization: objective unresolvedThe system tries to compute the “optimal human state” and records a conflict of variables.
HUMAN OS — optimization failed
11 — Optimization failedNot a crash and not a red screen: the interface goes quiet first, material and human presence remain.
HUMAN OS — final scene
12 — Reveal: model limitThe finale: the interface almost disappears, the human becomes the main layer of the frame.

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.

  1. Boot. Three loading scenes: species — Homo sapiens, origin — about 300,000 years ago, environment — industrial and digital. “Evolutionary legacy meets modern environment”.
  2. 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.
  3. 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.
  4. 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.
  5. 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.

ChapterWhat happensInteractionRule
01 / SLEEPEntry → 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–10HNo sleep score and no “perfect sleep”. 8 hours means “within typical adult range”, not an optimum
02 / FUELDemand → Input → Breakdown → Availability → Satiety → Modern environment → Mismatch → Return. The carrier is material, not a person.Availability: NOW / LATER / SUSTAINEDNo calories, macros or “good” food: food has no moral status. Mismatch: “target / undefined”
03 / CONNECTDetection → 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 withdrawalNo human becomes the interface for another: both have the same status, not “user / target”. Sync ≠ merge
04 / PROTECTBaseline → 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 accessA 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.

  1. The original task: four themes — sleep, food, closeness, defence — as one noticeable authorial project.
  2. One system instead of four cases; the formula “operating system for biological life”.
  3. A full 25-screen script, then vertical slice v0.1: Boot → Main System → Sleep → Main System → Final.
  4. Sleep as the reference chapter: 9 key-frame candidates, a photo selection matrix, 3 sleep-restriction variants, a clickable prototype.
  5. Fuel, Connect and Protect on the same pattern; a transition map between modules and rules for showing relations.
  6. 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.
HUMAN OS — Sleep — 8 grayscale wireframes
Sleep — 8 grayscale wireframesA contact sheet of eight key frames of the Sleep chapter: from entry to the return to the system. At this stage only structure and rhythm were checked.
HUMAN OS — Three directions for the sleep-onset frame
Three directions for the sleep-onset frameEditorial, Clinical and Tactile for the same screen. They were compared with the “blind HIL” test: is the feeling of Human OS kept without the name and logo. A hybrid won.
HUMAN OS — Motion prototype
Motion prototypeA storyboard of transitions: every movement must have a cause — light, breathing, the loss of cursor control.

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.

LayerWhat is used
FrameworkNext.js 15 (App Router, static export), React 19, TypeScript
StateXState 5: 49 scene identifiers, events NEXT, BACK, RETURN_MAIN, OPEN_MODULE; progress is kept in the browser (sessionStorage) with no profile or scoring
MotionGSAP; every movement has a cause and is simplified under prefers-reduced-motion
Graphics5 WebGL shaders (“fields”): wind-down, fuel material, connect, protect and the finale; plus WebP photography
SoundWeb Audio API: 5 ambient tracks (room tone, system hum, sleep low, material soft, environment threshold), enabled only by the user, no rewards or alarms
StylesCSS Modules and CSS variables: tokens, grid, typography in Space Grotesk, Geist Mono and Oxanium (fonts are local)
AccessibilityKeyboard and focus ring, targets of at least 44 px, no hover-only actions, responsive from 1440+ to <768
Sizeabout 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:

WasBecameWhy
8H = OPTIMAL8H = WITHIN TYPICAL ADULT RANGE8 hours is not a universal optimum
RECOVERY SCORE 62%RECOVERY STATE / CONSTRAINEDrecovery cannot be reduced to one number
ENVIRONMENT COMPATIBILITY 43%Mismatch: evolutionary legacy meets modern environmentthere is no validated compatibility scale
OXYTOCIN RESPONSESensory / social signal / proximity responsetouch is not a “love hormone”
FEAR IS A SAFETY PROTOCOLFEAR IS A SAFETY SIGNALless mechanistic
FAILED for emotions and loveIRREDUCIBLEthe 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