Steel Apex

Cinevva's analyzer read this game's design doc and its source, then wrote the brief below. "Make your own" hands it to the game creator as your opening message, so you start from a real spec rather than a one-line idea.

Create a browser-playable 2D side-scrolling motorcycle time-trial game titled “Steel Apex,” rendered entirely on a responsive HTML canvas with a dark industrial steel aesthetic. Use a wide world approximately 10,400 pixels across and a camera that smoothly follows the rider horizontally, keeping the rider around one-third from the left; the viewport should resize to the browser and support both keyboard and touch.

The player controls a small side-view motorbike and helmeted rider. Draw the bike with two black wheels and pale metal hubs, a dark frame, orange-red body/frame accents, and a light gray helmet/rider. The rider has a physics-driven position, horizontal velocity, vertical gravity, rotation and angular velocity. Start at x=260 on the first deck. Controls: D or Right Arrow, or a bottom-screen THROTTLE touch button, accelerates; A or Left Arrow, or BRAKE, brakes; Q or LEAN ◀ rotates the bike counterclockwise; E or LEAN ▶ rotates it clockwise. Leaning should be especially useful while airborne, while grounded rotation damps and the bike aligns toward the track slope. Clamp forward speed between 0 and about 470, apply gravity around 920, and allow the throttle to consume boost while moving quickly. Boost starts at 72, drains while throttle is held above roughly 150 speed, regenerates when not being used up to 100, and is shown in the HUD.

Build one fixed industrial obstacle course from left to right. The track is made of steel deck sections, gaps, girders, elevated platforms, ramps, a loop, scaffolding, an electrical hazard section, and a raised finish. Use these exact approximate sections and ordering: deck from x=0 to 620 at y=428; a 220-wide gap with a 110-wide missing portion; deck to x=1300; girder to x=1680; another 180-wide gap; deck to x=2420; an upward ramp from y=428 to y=300 over 340 pixels; elevated platform at y=300 to x=3180; downward ramp back to y=428 over 330 pixels; deck to x=3830; a 170-wide gap; deck to x=4470; a large circular loop centered around x=4830,y=302 with radius 175, continuing to x=5190; deck to x=5540; ramp up to y=250; elevated platform to x=6340; ramp down to y=428; a 210-wide hazard segment; deck to x=7400; a 240-wide gap with a 145-wide opening; girder to x=8240; scaffold to x=8660; a 260-wide gap with a 120-wide opening; deck to x=9640; final ramp up to y=235; and a finish platform from x=9940 to x=10400. The finish is reached when the rider passes approximately world width minus 140.

Render the world with a blue-gray/charcoal vertical gradient sky/background, distant dark blocky industrial silhouettes, faint diagonal structural lines, tall steel pylons with cross braces and small gold details, and a dark steel track. Decks should have gray top surfaces, darker undersides, diagonal braces, and girder/scaffold variants. Ramps should be solid gray sloping polygons with dark outlines and repeated gold diagonal markings. The loop should be a thick gray/dark circular track with repeated gold rectangular accents around the inside/outside. Add five clearly visible electrical obstacles at approximately x=1110, 2040, 3440, 6750, and 8460: short gold blocks with black diagonal warning stripes, red outlines, and the label “LIVE.” Contact with one causes an immediate crash.

Implement collisions using the track surface: gaps have no surface, ramps interpolate between their endpoint heights, and the loop supplies a circular surface. Keep the bike on the surface when its wheel reaches it, align toward slopes, and leave it airborne over gaps. Crash if the rider falls below the viewport, lands at an angle whose absolute value exceeds roughly 1.18 radians, or hits an electrical hazard. Stop motion after a crash. Show a brief reason toast such as “MISSED THE GAP,” “BAD LANDING,” or “ELECTRICAL IMPACT.”

At the beginning show a 3-second countdown overlay; any control input skips the countdown. Track elapsed race time after the countdown. Reaching the finish displays a dark overlay with gold “COURSE CLEARED” and the final time; crashing displays red “CRASHED” and a restart instruction. Store the best completion time in localStorage under a Steel Apex best-time key and display it, keeping the fastest time. Restart via an upper-right RESTART button, the R key, or tapping restart after a finish/crash. If the player presses a control after a terminal state, restart as appropriate.

HUD: reserve a dark translucent top bar. At upper left show “TIME 0.0s” and “BEST --” or the saved best time. Center a gold BOOST label, outlined horizontal boost bar and five lightning-bolt indicators reflecting the boost amount. Upper right show “#7” and “POSITION,” plus a gold RESTART button. Near the bottom show four outlined dark translucent touch buttons: BRAKE and THROTTLE on the left, LEAN ◀ and LEAN ▶ on the right. Include the small keyboard hint “Keyboard: D throttle  A brake  Q/E lean.” Use responsive dimensions so buttons remain usable on phones; prevent browser scrolling/touch gestures on the canvas. Keep the presentation minimalist, high-contrast, industrial, metallic, and arcade-like, with no extra game modes, enemies, powerups, laps, or UI features beyond those described.