Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Fork of COPY Fork of HTML Starter, Hello World

Public visualization

Post on XLinkedIn

Viewing a saved revision (read-only)

ecdb0548051e4c9593d353b75ea748f3

Open

Fork of Fork of COPY Fork of HTML Starter, Hello World

0 stars1🌍 Public
Mmarkus.pfander@axelspringer.com
Last edited Apr 16, 2026
Created on Apr 16, 2026

This example presents a simple "Hello World" message and a small HTML starter interface. It uses the `d3.select` and `d3.forceSimulation` APIs to create and run a basic force-directed layout, though no external data source is loaded. The code relies on a standard SVG rendering approach with CSS styling for visual elements, and the interface remains static aside from the simulation's animation.

AI-generated description

Timmy Rescue '86 - Arcade Text Adventure

An 80s-style arcade text adventure game built with vanilla JavaScript, HTML5 Canvas, and Web Audio API.

Features

  • Pixel-perfect retro aesthetics with red/white/pink color scheme
  • Interactive story with meaningful choices that affect game state
  • Dynamic map visualization with canvas-based graphics
  • Real-time HUD showing Hydration, Trust, Prep, Team, Round, and Score
  • Procedural music - Ambient techno beats play during gameplay
  • Sound effects - Error sounds on mission failure
  • Multiple palettes - Different color schemes available
  • Game mechanics - Stats that increase/decrease based on choices
  • Win/Loss conditions - Multiple failure paths and one success path

How to Play

  1. Start at the Flachwasser (shallow water) where Timmy is stranded
  2. Make strategic choices using buttons or keyboard (1/2 keys)
  3. Manage your resources: Hydration, Trust, and Prep determine success
  4. Each choice has consequences reflected in the HUD
  5. Reach the Ostsee (Baltic Sea) to save Timmy

Game Mechanics

  • Hydration: Decreases each round; drops to 0 = failure
  • Trust: Team confidence; drops to 0 = failure
  • Prep: Equipment preparation; needed for certain choices
  • Team: Number of helpers; affects resource loss per round
  • Round: Increases each decision; >7 rounds = time-based failure
  • Score: Points earned from successful choices

Technologies

  • Vanilla JavaScript (ES6+)
  • HTML5 Canvas for map visualization
  • Web Audio API for procedural music and sound effects
  • CSS Grid and Flexbox for responsive layout
  • Requestanimationframe for smooth 60fps rendering