A living travel poster.
The Wanderer is a single-page, single-file generative "poster" — a small figure walks an endless path while famous landmarks rise over the horizon ahead of them. Change the destination, flip between day and night, dial in rain or snow, and watch the scene paint itself in soft, illustrated colour.
- 11 landmarks to walk to — Mt. Fuji, the Eiffel Tower, the Pyramids of Giza, the Taj Mahal, Big Ben, the Statue of Liberty, the Sydney Opera House, Christ the Redeemer, the Colosseum, Santorini and the Great Wall.
- Natural-language destinations — type things like "Paris in the rain", "Fuji at night" or "make it snow" and the poster updates the destination, time of day and weather all at once.
- Day / night and weather toggles — switch between sun, rain and snow, and between day and night, each with its own palette, lighting, and effects (stars, rain streaks, snowfall, lantern glow).
- Walking controls — steer the figure's pace and drift as they walk.
- Today's Walk — a new destination, time and weather combo is generated every day (seeded by date), with a streak counter for coming back daily.
- Journey log & odometer — a running tally of kilometres walked and a stamp for every landmark you've visited, with quick-travel by clicking a stamp.
- Achievements — unlock milestones like First Steps, Globetrotter, World Tour, Night Owl, Storm Chaser and daily-streak badges.
- Postcards — save the current view (with its title) as a PNG.
- Shareable links — copy a URL that reopens the poster at the exact destination, time of day and weather you're looking at.
- Ambient sound — optional generative audio that matches the scene.
- Type a place into the box at the bottom (e.g. "Santorini", "Great Wall at night", "Rio in the snow") and hit GO or press Enter.
- Or click one of the destination chips above the input.
- Click ★ TODAY to jump to the daily destination (and complete your streak for the day).
The row of round buttons on the right lets you:
| Button | Effect |
|---|---|
| ☀ / ☾ | Toggle day and night |
| Weather icon | Cycle clear → rain → snow |
| 🔊 | Toggle ambient sound on/off |
| Postcard icon | Save the current view as a PNG |
| Dice icon | "Surprise me" — random destination, time and weather |
| Link icon | Copy a shareable link to the current view |
Use the keyboard to control the walker:
| Key | Action |
|---|---|
| ↑ / W | Speed up (sprint) |
| ↓ / S | Slow down |
| ← / A | Drift left |
| → / D | Drift right |
| Space | Pause — the figure stops to take in the view |
Every landmark you visit earns a stamp in the bottom-left journey log. Click a stamp to walk back there. Your total distance is tracked in the "KM WALKED" counter, top-left.
The Wanderer is a single index.html file with no build step and no dependencies.
git clone https://github.com/marcusandrew75/the-wanderer.git
cd the-wanderer
python3 -m http.server 8741Then open http://localhost:8741 in your browser.
(You can also just open index.html directly in a browser, though some browsers restrict certain features — like clipboard access for the share button — on the file:// protocol.)
Everything lives in index.html — styles, canvas drawing code and logic are all in one place, so it's easy to fork and modify:
- Landmarks are defined in the
SCENESobject — each entry has a native-language label, a stamp abbreviation, a colour palette and a drawing function (e.g.drawFuji,drawEiffel). Add a new entry and drawing function to add your own landmark. - Achievements are defined in the
ACHIEVEMENTSarray — each has anid,title,descand acheck()function. - Daily Walk destinations are picked deterministically from today's date via
seededRandom, so everyone sees the same daily destination on a given day.
Released under the MIT License — do whatever you like with it, just keep the copyright notice. Forks, remixes and tweaks are very welcome!
by Marc Andrew