I Made Spider‑Man Swing Without Animating a Single Frame

Description and use

A fully procedural Spider‑Man swing effect implemented with a Python agent that sends physics parameters via WebSocket to the browser, achieving 60 FPS without pre‑rendered frames.

Problem

Create a real‑time Spider‑Man swing animation in the browser without pre‑rendered frames, sprite sheets, or video files.

Outcome

A fully procedural Spider‑Man swing that runs at 60 FPS without pre‑baked frames, achieved by a rule‑based Python agent communicating over WebSocket.

Workflow

• 1. Run a Python WebSocket server (server.py) that listens for state updates from the browser.
• 2. The agent observes current position and velocity sent by the browser.
• 3. If no web is attached, the agent selects the nearest building anchor within a 300‑pixel cone ahead and sends an "attach" command with the anchor coordinates.
• 4. If a web is attached, the agent computes pendulum physics; when the character reaches the bottom of the swing and is moving forward, it sends a "release" command.
• 5. The browser updates the canvas rendering based on the received anchor or release command, drawing a stick‑figure Spider‑Man at 60 FPS.
• 6. The loop terminates when the character reaches the right edge of the screen or after 500 iterations as a safety guard.

Evidence

I built a Spider‑Man swing effect that runs entirely in the browser, with no pre‑rendered animation, no sprite sheets, and no video files.

Source

The agent runs in Python (using a lightweight loop) and communicates with the browser via WebSocket.

Source

I built a simple agent loop in Python that runs at 30 Hz.

Source