Tracksmith Time Trials

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-based 2D arcade time-trial game titled “Tracksmith Time Trials.” Use a fixed top-down canvas arena that fills the space below a dark navy header. The visual style is polished minimalist neon UI: deep navy background with a subtle 32-pixel square grid, dark outlines, muted slate-blue road, yellow dashed center line, red/orange start marker, pale blue waypoint markers, and compact rounded controls with blue borders. Keep the camera fixed to the full track; do not add scrolling or 3D perspective.

The game has two modes. In Build mode, show a translucent dark information panel at upper left titled “Build your track,” explaining that the player clicks or taps points around the arena to draw a course and needs at least four points before racing. Every click/tap in the canvas (away from the outer 20-pixel margin) appends a waypoint. Connect all waypoints in order and close the loop from the last point back to the first. Render the route as a broad road: first a very dark approximately 94-pixel outline, then a slate-blue approximately 78-pixel road, with a thin yellow dashed centerline (roughly 18-pixel dash and 16-pixel gap). Draw the first waypoint as a larger red circular start point and all other waypoints as smaller light-blue circles. If there are fewer than two points, display centered helper text such as “Tap to place your first track point.” Include buttons for Load sample, Save level, and Reset best. Load sample should create a pre-made loop similar to points around (130,460), (170,300), (310,210), (480,230), (650,170), (790,270), (720,420), (560,500), (380,460), and (240,510), scaled to the current canvas. Save level stores the custom waypoint list locally on the device; loading should restore it when available. Clear removes the track and returns to Build mode.

In Race mode, require at least four points; otherwise show a notification telling the player to add at least four track points. Start the small top-down car at the first waypoint, facing toward the second waypoint. The player drives the loop and completes a lap by returning near the red start point after at least three seconds. Use WASD or arrow keys: Up/W accelerates in the car’s facing direction, Down/S reverses/brakes, Left/A and Right/D steer, and Space acts as a handbrake. Also provide mobile/touch controls at bottom right: circular left, up, down, and right arrow buttons plus a BRAKE button. Hold Space/BRAKE while steering to drift: normal handling strongly damps sideways velocity, while handbrake handling preserves much more lateral velocity and slightly damps forward speed. Apply acceleration, reverse acceleration, steering that becomes more responsive with speed, velocity limits, and friction so the car has loose arcade drifting movement. Keep the car constrained to the track: if the proposed position is within about 62 pixels of the closed road centerline, allow it; otherwise heavily slow it and only move it a small amount.

Render the player car as a compact red-orange rectangular vehicle with a dark outer rectangle, a light-blue windshield/detail block toward its front, and four dark wheels/details, rotated to its heading. During a race, replay the previous best run as a semi-transparent pale-blue ghost car following recorded positions and headings over time; if there is no best run, show no ghost. Record the current car position and angle each frame. On finishing, if the elapsed time beats the stored best, save the time and ghost replay locally and notify the player with “New best: …s”; otherwise report the finish time and best time. Show the current time in the header during racing and “Finish …” after completion, with a centered “FINISH!” message and “Press R or Race to try again” below it. Press R after finishing or click Race to restart. Build mode should show the stored best in the header when available, otherwise “Best —.”

The persistent header should include a yellow “2D” badge, the title, a time/best status, and buttons Build, Race, and Clear; Race is the prominent coral button, the active mode is blue. Use responsive layout: desktop shows the instructional panel and header controls, while narrow screens reduce header/panel sizing and reveal the mobile control pad. Add small dark toast notifications near the top center for actions such as “GO!”, “Track cleared,” “Sample track loaded,” “Level saved on this device,” and best-time results. Do not invent additional enemies, collectibles, laps, weapons, or scenery; the core objective is drawing a closed track and driving one timed loop as quickly as possible.