Ship #1 Changes requested

@raslanyossif on Nexus Escape · about 1 month ago

I developed a game called NEXUS-09: Neon Escape, which is a cyberpunk-style escape room game that involves solving four puzzles to get fragments of access and run away before time is up. This game consists of a security code puzzle, a signal sequence challenge, and a memory matching game.

The biggest difficulties were creating separate puzzle systems combined into one, handling the running of the countdown and game states simultaneously, and coming up with a graphical animated interface. It was also extremely important to track all progress, mistakes, sounds, transitions, and final results during the gameplay.

I feel proud of the atmosphere and presentation of the game in general. The neon design of the game, glitch effects, particle background, scanlines, sound feedback, progress tracking, and ranking system are what I am especially satisfied with.

What should you know before testing:
Solve the terminal puzzle first, then complete the signal, memory, and reactor core challenges. The goal is to collect all four fragments before the timer reaches zero.
You can’t access or do core challenge until you complete all the other 3 challenges then core unlocks.

1 devlog
10h

Try project → See source code →

Open comments for this post

@raslanyossif on Nexus Escape · about 2 months ago

9h 53m 11s logged

DEVLOG TIMEEEE:»

NEXUS-09 // Neon Escape

Built a browser escape room game - vanilla HTML/CSS/JS, no frameworks, no libraries. Just a single index.html, style.css, and script.js.

the pitch

You’re trapped inside a failing machine intelligence called NEXUS-09. You’ve got 5 minutes to recover 4 access fragments and get out before containment seals the partition. Cyberpunk/hacker terminal aesthetic - scanlines, glitch text, a particle field background, screen shake, the works.

the four puzzles

- Terminal - crack a 4-digit auth code using deduced clues (first digit > 3, second digit = cores online, third = flagged subsystems, last digit = double the first, wrapping past 9).

Signal - a Simon-says style sequence of 4 symbols flashed on a fake oscilloscope canvas, played back and then repeated by the player. 3 mistakes and the transmission resets.
Memory - classic 8-pair matching grid, but themed as a “memory lattice” with glyph tiles.
Core - locked until the other 3 fragments are secured. Three concentric SVG rings, each rotated independently in 90° steps until all align - a synchronization puzzle to trigger the final breach.

Once all 4 are collected, the game unlocks a shutdown/escape sequence with a progress bar and a scored results screen (time remaining, mistakes, puzzles completed → rank from Rookie Hacker up to System Breaker), with high score saved locally.

some of the fun technical bits

Web Audio, zero audio files. Every sound -clicks, errors, alarms, victory chime - is a synthesized oscillator tone (sine/square/triangle/sawtooth) with gain envelopes and frequency sweeps. No .mp3/.wav anywhere.
Canvas particle field in the background: ~70 points drift around and draw connecting lines when close to each other, classic constellation effect, capped by screen area so it doesn’t die on big displays.
Fake system telemetry running the whole time you play - a live clock, CPU/security bars wiggling via sine waves + noise, a scrolling log of believable-sounding system messages, a random hex string ticking over. Purely cosmetic, but it sells the “you’re inside a machine” feeling.
Screen shake is just a CSS class toggled on/off (forcing a reflow with offsetWidth so it can retrigger), fired on mistakes, fragment pickups, and timer milestones.
Countdown timer flips into warning (⚠️ orange) and critical (🔴 red) states at 3 minutes and 1 minute left, with an alarm tone + shake at each threshold.

Structure

Everything is organized into small classes - AudioEngine, ParticleField, Telemetry, CountdownTimer, one class per puzzle (TerminalPuzzle, SignalPuzzle, MemoryPuzzle, CorePuzzle), and a top-level Game class that owns state (which fragments are collected, mistakes, current view) and wires everything together. Screens are just <section> elements toggled with an active class — boot log → start screen → game → final access → escape sequence → win/lose.