Geometric and computational foundations of the Bit character from TRON (1982)
Bit is modeled as a finite state machine with three states:
$$S \in \{\text{neutral},\; \text{yes},\; \text{no}\}$$The neutral state is the resting configuration. External input drives transitions to the yes or no state, and after a timeout (1500 ms), the machine returns to neutral:
$$\delta(S_{\text{neutral}}, I_{\text{yes}}) = S_{\text{yes}}$$ $$\delta(S_{\text{neutral}}, I_{\text{no}}) = S_{\text{no}}$$ $$\delta(S_{\text{yes}}, \tau) = S_{\text{neutral}}$$ $$\delta(S_{\text{no}}, \tau) = S_{\text{neutral}}$$where $\tau$ represents the timeout event. Each state maps to a distinct polyhedron and color:
The golden ratio appears throughout the geometry of both the icosahedron and dodecahedron:
$$\varphi = \frac{1 + \sqrt{5}}{2} \approx 1.618033989$$The vertices of a regular icosahedron lie at cyclic permutations of:
$$(0,\; \pm 1,\; \pm \varphi)$$The vertices of a regular dodecahedron lie at:
$$(\pm 1, \pm 1, \pm 1), \quad (0, \pm \varphi^{-1}, \pm \varphi), \quad (\pm \varphi^{-1}, \pm \varphi, 0), \quad (\pm \varphi, 0, \pm \varphi^{-1})$$In the implementation, $\varphi$ is computed directly:
var PHI = (1 + Math.sqrt(5)) / 2;
The neutral geometry is constructed by stellating a regular icosahedron -- raising a spike from each triangular face.
THREE.IcosahedronGeometry(1, 0), which produces 12 vertices and 20 equilateral triangular faces.The result: 20 faces $\times$ 3 = 60 triangular faces, stored as a raw Float32Array in a Three.js BufferGeometry.
The yes state uses a regular octahedron, the simplest of the three geometries:
new THREE.OctahedronGeometry(1.2, 0)
The octahedron is a Platonic solid -- one of only five convex regular polyhedra. Its Euler characteristic confirms:
$$V - E + F = 6 - 12 + 8 = 2$$The smooth, rounded feel of the octahedron (relative to the spiky alternatives) makes it the natural choice for the affirmative state.
The no state is the most aggressive geometry: a stellated dodecahedron with randomized spike heights.
THREE.DodecahedronGeometry(1, 0). Three.js internally triangulates each of the 12 pentagonal faces, producing a set of triangles.Spike heights vary per face using a deterministic pseudo-random function (a GPU hash trick):
function seededRandom(seed) {
var x = Math.sin(seed * 127.1 + seed * 311.7) * 43758.5453;
return x - Math.floor(x);
}
The seed for face $g$ is $7g + 3$. This produces a value in $[0, 1)$, which scales the spike height:
$$h = 1.8 \times (0.8 + r \times 1.0)$$where $r = \text{seededRandom}(7g + 3)$. The effective range is:
$$h \in [1.44,\; 3.24]$$This variation gives the no form its irregular, threatening silhouette.
Each frame, the mesh rotates around two axes at rates that depend on the current state:
$$\theta_y(t+1) = \theta_y(t) + \omega$$ $$\theta_x(t+1) = \theta_x(t) + 0.4\omega$$where $\omega$ is the per-frame angular speed:
The y-axis rotates 2.5x faster than the x-axis (ratio $1 : 0.4$), creating an asymmetric tumble.
A sinusoidal vertical displacement gives Bit a hovering quality:
$$y(t) = 0.15 \sin(1.5t)$$where $t$ is the elapsed time in seconds from a THREE.Clock. The amplitude is 0.15 units and the period is $\frac{2\pi}{1.5} \approx 4.19$ seconds.
The icosahedron and dodecahedron are dual polyhedra. Duality means:
| V | E | F | |
|---|---|---|---|
| Icosahedron | 12 | 30 | 20 |
| Dodecahedron | 20 | 30 | 12 |
Bit morphs between stellations of these duals: the neutral state stellates the icosahedron, the no state stellates the dodecahedron. The binary character literally oscillates between dual geometric forms.
From an information-theoretic perspective, Bit encodes exactly one bit of Shannon entropy. Assuming equal probability of yes and no:
$$H = -\sum_{i} p_i \log_2 p_i = -(0.5 \log_2 0.5 + 0.5 \log_2 0.5) = 1 \text{ bit}$$This is the irreducible minimum of meaningful information: a single binary decision. The character is the physical (digital) embodiment of this quantity.
The scene uses Phong shading with flat interpolation, creating the crystalline faceted look. The lighting rig consists of four sources:
The material is MeshPhongMaterial with:
flatShading: true -- normals are per-face, not interpolated across verticesshininess: 80 -- moderately sharp specular highlightsopacity: 0.92 -- slight translucency for a digital/holographic feelside: DoubleSide -- both faces of each triangle are renderedThe Phong reflection model computes the color at each fragment as:
$$I = k_a I_a + \sum_j \left[ k_d (\hat{n} \cdot \hat{l}_j) I_j + k_s (\hat{r}_j \cdot \hat{v})^{\alpha} I_j \right]$$where $k_a$ is the ambient coefficient, $k_d$ the diffuse, $k_s$ the specular, $\hat{n}$ the face normal, $\hat{l}_j$ the light direction, $\hat{r}_j$ the reflection vector, $\hat{v}$ the view direction, and $\alpha = 80$ the shininess exponent.