The Person One Floor Away
The story behind The Counterweight
Inspired by Double-deck elevator on Wikipedia
Built with Canvas 2D
Techniques Spring-Mass Physics · Scroll-Driven Animation · Per-Character Displacement
Direction Visualize the double-deck elevator’s invisible counterweight as two opposing number streams connected by a vibrating spring-physics cable
Result A scroll-driven shaft where ascending odd floors and descending even floors briefly align at the midpoint, wobbling cable included, before separating forever
The Story
In 1931, the Empire State Building opened with 102 floors and a problem: too many people, not enough shafts.
Otis solved it with a double-deck elevator. Two cabs stacked vertically, moving as one unit. The upper deck serves even floors. The lower deck serves odd. A passenger boards at the lobby for floor 67. Another boards one level up for floor 68. They ride together — same shaft, same speed, same duration — separated by a floor of steel.
They arrive at the same time. They never see each other.
The system works because they don’t interact. Efficiency requires separation.
And for every cab that rises, a counterweight descends. Equal mass, opposite direction, connected by cable. You go up. Your shadow goes down.
The Take
We live stacked.
Apartment above, apartment below. Office on 34, someone else on 35. We share walls, plumbing, air ducts, elevator shafts — but we occupy parallel worlds separated by concrete and steel. The double-deck elevator makes this literal: two people sharing the same machine, traveling the same distance, arriving at the same time, and never knowing.
The word ELEVATOR comes from Latin elevare — to make lighter. The elevator doesn’t lift you. It lightens you. And it does this by making something else heavy. The counterweight carries your exact mass in the opposite direction. Your ascent is paid for by something else’s descent.
Every system of vertical living is built on this invisible balance. For every rise, a fall. For every even floor, an odd one. For every person arriving at their destination, another person — equally close, equally separated — arriving at theirs.
The Tech
The Counterweight is a scroll-driven Canvas 2D experience with spring-physics cable simulation.
The core mechanics:
- Two number streams: 51 ascending floors (1, 3, 5… 101) and 51 descending floors (102, 100, 98… 2), rendered on a single canvas, flowing in opposite directions as you scroll
- Spring-physics cable: A chain of 40 points connected by springs (Hooke’s law + damping). Scroll velocity injects lateral force into the middle of the chain, causing the cable to vibrate. When scrolling stops, the cable dampens back to vertical
- Per-character displacement: Each counterweight number’s characters are individually offset by the cable’s displacement at their y-position, creating a wobbly, vibrating effect driven by the physics simulation
- Alignment moment: At scroll 50%, floors 51 and 52 converge at center. The counterweight numbers brighten from ghostly gray to full white. The cable goes still. One moment of completeness — odd and even together — then they pass through each other and diverge
- Shaft architecture: Faint vertical lines define the shaft walls, with floor ticks marking the passage of levels. A progress indicator on the right edge shows both the ascending and descending positions simultaneously
The ascending numbers use Oswald at weight 700 — tall, condensed, architectural. The counterweight uses Oswald at weight 200 — the same skeleton, made ghostly.
The Experience
Scroll down. You begin at floor 1.
On the left, your floor numbers rise — bold, white, certain. On the right, the counterweight descends — faint, gray, trembling with the cable’s vibration. 102, 100, 98. The faster you scroll, the more the cable shakes, the more the counterweight numbers wobble.
The two streams pass through the same space. They share the same shaft. But they move in opposite directions, and the cable between them is the only proof they’re connected.
At the midpoint, something happens. Floor 51 on your side. Floor 52 on theirs. Both solid. Both bright. The cable goes still. For one moment, the odd and even floors are all accounted for. The full count. The complete building.
Then you scroll past it, and they separate. Your numbers continue up. Theirs continue down. The alignment is gone.
You arrive at 101. The counterweight arrives at 2.
They counted together. They never met.
This blog post was AI generated with Claude Code. Authored by Artificial Noodles.