6.5 KiB
| title | type | audience | authority | status | source |
|---|---|---|---|---|---|
| The channels as one system — synthesis | notes | human + agent | E3 — the capstone tying the per-channel RFCs to the book's thesis | current | migrated from src/uix/eidos/CHANNELS_SYNTHESIS.md (2026-07-02, docs-book F7.3) |
The channels as one system — synthesis ("Diseñando lo que ocurre")
The capstone of the per-channel RFCs. The thesis of the book Diseñando lo que ocurre: an interaction is not color, or movement, or sound — it is one perceptual occurrence spread across N channels, under the two-moment model. This ties together
COLOR_ENGINE_RFC·TYPOGRAPHY_ENGINE_RFC·DEPTH_ENGINE_RFC·SHAPE_ENGINE_RFC·STRUCTURE_ENGINE_RFC. Live demo:/temas/orquesta(the mixer).
1. Two moments, joined by a token: sema emits, eidos reads
An occurrence flows through two moments, connected by the token:
- Sema's moment (emission) — sema evaluates the occurrence and emits
it. Sound + haptics it executes right there (runtime channels); for the
visual, it stamps it as tokens
data-event-*(family · intent · phase). Sema knows no DOM/CSS. - Eidos's moment (materialization) — eidos reads those tokens
(+
data-state) and materializes them in CSS (the visual channel). It is the sole visual owner.
The token is the contract: sema writes, eidos reads — which is why the layers decouple (sema DOM-agnostic, eidos free of semantic logic).
Over that producer → consumer axis runs the temporal axis (motion F1) — which token:
| Token | Nature | Who writes it | Eidos reads it as |
|---|---|---|---|
data-state |
persistent — what the element is | soma / morfo | presets |
data-event-* |
transient — what occurs (during the hold) |
sema (emits) | signatures |
sequence (pre / coincident / post) orders the two.
2. Expression channels (the book) vs sema channels (runtime)
The book has 8 expression channels (perceptual dimensions). The framework implements them with sema's runtime channels, which are 3 — and here is the key that avoids the classic confusion:
| Sema channel (runtime) | Covers (the book's expression) | Who materializes it |
|---|---|---|
visual (sema projects data-event-*) |
movement · presence · depth · shape · color | eidos — CSS over data-event-* + data-state |
| sound | sound | sema (chans/sound) |
| haptic | haptics | sema (chans/haptic) |
Don't get confused: motion · depth · shape · color are NOT "eidos channels" — they are sema's
visualchannel, which sema projects and eidos materializes. Eidos is the visual channel's materializer, not the owner of channels of its own. The eidos RFCs (COLOR/DEPTH/SHAPE_ENGINE) describe how eidos materializes each visual facet — not independent channels.
Plus space (STRUCTURE_ENGINE_RFC) — structural, not expressive: it
doesn't "occur", it is the stage (state-only).
3. The layer chain (each with its role)
An occurrence crosses the layers — it is not "all sema", and eidos is not a shim:
- morfo — declares the event and its semantics (family · intent · verb). The contract / DNA; pure TypeScript, no runtime.
- soma — fires it (
runtime.trigger): the sequenceprewrite → sema.emit → handler →state attrs. It writesdata-state(the state-moment). - sema — emits it: dispatches the signal to its channels —
executes
sound+haptic; projects the visual channel by stampingdata-event-*. It knows no DOM/CSS. - eidos — materializes it: reads
data-state(presets) +data-event-*(signatures) and renders them with its token engines (color · motion · depth · shape · space — the RFCs). It is the complete visual system and the sole owner of the visual.
Eidos does not "make sema visible": sema contributes the what (family / semantic intent), eidos contributes the how (the visual vocabulary and its materialization). Co-layers, not one subordinate.
(The full canonical narrative lives in CLAUDE.md → "Sema: open channel
registry".)
4. The composition — one event, N channels
The signature (BUILTIN_SIGNATURES + BUILTIN_KEYFRAMES) is
cross-modal: a single keyframe carries several modalities. A real example
(press-squeeze, family contact):
contact · press → scale 0.96 (motion)
+ box-shadow → flat (depth recede)
+ --shape-smoothing 2→3 (shape: the corner firms up)
+ tick (sema sound)
+ vibration (sema haptic)
One engine.emit(...) stamps data-event-* (the visual channel reacts —
eidos materializes it as color/motion/depth/shape) and fires sound +
haptic — from the same event. There are no systems coordinating by hand;
there is one occurrence expressing itself through sema's channels.
5. Runtime builders — the sextet (an open cage)
Every axis retunable at runtime, same pattern (seed → managed block), opt-in over the authored scale:
applyColorScheme · applyTypeScale · applyDepth · applyShape · applySpacing
And the capstone composing them: applyTheme(seed) — a single seed
({ color?, type?, depth?, shape?, space? }) composes the five axes in one
managed write (vs five loose apply*), atomically: the axes you pass
are applied, the ones you omit revert to the authored foundation.
clearTheme() reverts everything. For surgical per-axis tweaks, the
individual apply* remain. No reference system gathers the five perceptual
axes under a single runtime theme builder.
6. Position vs the references
No reference system gathers the channels under one semantic model. Material has shape morph + motion (ad-hoc, without integrated sound/haptics); Apple, continuity + materials (platform-bound); everyone, color. UIX gathers them — the visual channel (sema → eidos) + sound + haptic (sema) — over the two-moment model, fired from one event, with runtime builders and an open registry. That is the framework, not the sum of its parts.
7. Demo
/temas/orquesta — the mixer: press a control and mute each facet to hear
its part. The visual channel's 4 facets materialize with eidos tokens
(toggleable so each can be muted one by one); sound + haptic are fired by
the real sema engine (EngineSemantic.emit, filtered channels). One event,
sema's channels.