As a developer, I want the scaffold project to reflect the structure and layout of all 11 mock-design pages so that the app visually matches the intended design system. Remove unneeded scaffold pages (signup, welcome, ai-assistant, settings) and wire up routing to match the defined user flows.
As a developer, I want the Egyptian color palette defined as CSS variables and theme tokens across the entire app so that all components consistently use Desert Sand (#F4E3C1), Nile Blue (#0077B6), Obsidian Black (#1C1C1C), Pyramid Gold (#D4AF37), and Oasis Green (#A3C4BC).
As an administrator, I want a polished login page matching the v2 JSX design so that I can securely authenticate and be redirected to the admin dashboard. This page is the entry point for the Administrator user flow.
As any user, I want a visually stunning home page matching the v2 JSX design featuring an interactive 3D map of Egypt as the signature element, so that I am immediately immersed in the Egyptian simulation experience and can navigate to Landmark Select or Car Select. Entry point for Casual Driver, Car Enthusiast, and Simulation Enthusiast flows.
As a car enthusiast, casual driver, or simulation enthusiast, I want a Car Select page matching the v2 JSX design so that I can browse Egyptian car models with previews and specs and select a vehicle to proceed to customization or directly to simulation. Navigates from Home or Landmark Select.
As a casual driver or simulation enthusiast, I want a Landmark Select page matching the v2 JSX design so that I can browse and choose from available Egyptian landmarks (Pyramids, Nile, Cairo streets) before proceeding to car selection and simulation. Navigates to Car Select page.
As a backend system, I want login and JWT-based authentication endpoints so that the frontend can authenticate users, return role-based tokens, and enforce access control for admin vs. regular user flows.
As a car enthusiast, I want a Customization page matching the v1 JSX design with tabs for exterior (color, body kits, rims) and performance (engine, suspension, tires) modifications so that I can personalize my selected Egyptian car before entering the simulation. Navigates from Car Select.
As a backend system, I want a home page data endpoint that returns featured landmarks, available cars, and a current Egypt weather snapshot so that the home page 3D map and content panels are dynamically populated.
As an administrator, I want a Landmarks DB management page matching the v2 JSX design so that I can view, add, edit, and delete 3D landmarks such as the Pyramids, Nile, and Cairo streets with their metadata and 3D asset references. Accessible from the Dashboard.
As an administrator, I want a Weather Manager page matching the v1 JSX design so that I can view the live Egypt weather sync status, override weather conditions per simulation zone, and toggle between real-world and manual weather modes. Accessible from the Dashboard.
As a simulation enthusiast or casual driver, I want a Simulation page matching the v1 JSX design with an interactive 3D driving environment, interactive car interior (dashboard, steering wheel, speedometer), AI traffic display, and a weather toggle control so that I have a fully immersive Egyptian driving experience.
As an administrator, I want a Traffic Manager page matching the v1 JSX design so that I can configure AI traffic density, Egyptian license plate patterns, vehicle type distributions, and traffic behavior presets for each simulation zone. Accessible from the Dashboard.
As an administrator, I want a dashboard overview page matching the v1 JSX design so that I can see a summary of the cars database, landmarks, active traffic configurations, and weather status from a single admin control center. Links to Cars DB, Landmarks DB, Traffic Manager, and Weather Manager pages.
As an administrator, I want a Cars DB management page matching the v2 JSX design so that I can view, add, edit, and delete Egyptian car models including attributes like make, model, license plate format, performance specs, and customization options. Accessible from the Dashboard.
As a backend system, I want a dashboard statistics endpoint that aggregates counts of cars, landmarks, active AI traffic configurations, and current weather override status so that the admin dashboard panels are populated with live data.
As a backend system, I want REST API endpoints to get and update AI traffic configuration settings so that the Traffic Manager admin page can persist traffic density, license plate rules, and vehicle distribution profiles to the database.
As a backend system, I want full CRUD REST API endpoints for the cars database so that the admin panel can create, read, update, and delete car records including Egyptian car models, specs, exterior/interior options, and performance parameters stored in MySQL.
As a backend system, I want full CRUD REST API endpoints for the landmarks database so that the admin panel can manage landmark records including name, description, GPS coordinates, 3D asset references, and associated weather zones stored in MongoDB.
As a backend system, I want REST API endpoints for managing weather configurations so that the Weather Manager page can read current Egypt weather sync state, apply manual overrides per zone, and toggle live vs. manual weather modes persisted in the database.
As a backend system, I want a landmarks listing endpoint that returns all available landmarks with names, preview images, descriptions, and 3D asset metadata so that the Landmark Select page can dynamically display and filter landmark options.
As a backend system, I want a cars listing endpoint that returns all available car models with make, model, preview images, performance specs, and customization availability flags so that the Car Select page can render a browsable and filterable vehicle catalog.
As an AI engineer, I want to integrate a real-world Egypt weather data API via LiteLLM/Langchain orchestration that periodically fetches current conditions for Egyptian cities and syncs them to the weather configuration store so that the simulation and weather manager reflect accurate live Egyptian weather without manual admin input.
As a backend system, I want REST API endpoints to fetch available customization options per car model and save a user's customization session so that the Customization page can load valid exterior/performance options and persist the player's configured vehicle state before simulation.
As a backend system, I want REST API endpoints to initialize a simulation session with the selected landmark, car configuration, weather state, and traffic settings and to stream real-time simulation state updates so that the Simulation page can load a fully configured driving environment and receive live data during gameplay.
As a simulation enthusiast, I want an AI-driven traffic behavior engine using LiteLLM and Langchain that generates realistic Egyptian traffic patterns, assigns valid Egyptian license plates to AI vehicles, selects appropriate Egyptian car models, and responds dynamically to player actions so that the simulation feels authentically set in Egypt with believable NPC traffic.

No user flows yet.
The User Flow Agent will generate per-persona navigation diagrams after SRD updates.
No comments yet. Be the first!